index.tsx 3.97 KB
import React from 'react';
import { StyleSheet } from 'react-native';
import ListGrid, {
  FPColumn,
  HeaderRow,
  ItemRow,
  PlayerColumn
} from '../../ListGrid';
import HeaderColumn from '../../ListGrid/HeaderColumn';
import { BorderRadius, CardHeight } from '../constants';

const styles = StyleSheet.create({
  itemWrapper: {
    height: CardHeight,
    borderRadius: BorderRadius
  },
  player: {
    justifyContent: 'center'
  },
  stats: {
    justifyContent: 'center',
    alignItems: 'center'
  }
});

const TotalsList: React.FC<any> = () => {
  return (
    <ListGrid style={{ marginTop: 10 }}>
      <HeaderRow style={{ marginBottom: 5 }}>
        <HeaderColumn align="center" size={3} fontSize="sm" label="PLAYER" />
        <HeaderColumn align="center" size={1.5} fontSize="sm" label="1-week" />
        <HeaderColumn align="center" size={1.5} fontSize="sm" label="2-week" />
        <HeaderColumn align="center" size={1.5} fontSize="sm" label="4-week" />
        <HeaderColumn align="center" size={1.5} fontSize="sm" label="Season" />
      </HeaderRow>
      <ItemRow style={styles.itemWrapper}>
        <PlayerColumn
          name="EZEKEL ELLIOT"
          position="RB"
          team="DAL"
          rating={4.3}
          size={3}
          style={styles.player}
        />
        <FPColumn size={1.7} style={styles.stats}>
          24.5
        </FPColumn>
        <FPColumn size={1.5} style={styles.stats}>
          14.9
        </FPColumn>
        <FPColumn size={1.5} style={styles.stats}>
          15.8
        </FPColumn>
        <FPColumn size={1.5} style={styles.stats}>
          24.5
        </FPColumn>
      </ItemRow>
      <ItemRow style={styles.itemWrapper}>
        <PlayerColumn
          name="MICHAEL THOMAS"
          position="WR"
          team="NO"
          rating={3.5}
          size={3}
          style={styles.player}
        />
        <FPColumn size={1.5} style={styles.stats}>
          33.2
        </FPColumn>
        <FPColumn size={1.5} style={styles.stats}>
          31.6
        </FPColumn>
        <FPColumn size={1.5} style={styles.stats}>
          16.9
        </FPColumn>
        <FPColumn size={1.5} style={styles.stats}>
          33.2
        </FPColumn>
      </ItemRow>
      <ItemRow style={styles.itemWrapper}>
        <PlayerColumn
          name="JULIO JONES"
          position="WR"
          team="ATL"
          rating={4}
          size={3}
          style={styles.player}
        />
        <FPColumn size={1.5} style={styles.stats}>
          33.2
        </FPColumn>
        <FPColumn size={1.5} style={styles.stats}>
          17.7
        </FPColumn>
        <FPColumn size={1.5} style={styles.stats}>
          25.9
        </FPColumn>
        <FPColumn size={1.5} style={styles.stats}>
          33.2
        </FPColumn>
      </ItemRow>
      <ItemRow style={styles.itemWrapper}>
        <PlayerColumn
          name="DESEAN WATSON"
          position="QB"
          team="HOU"
          rating={4}
          size={3}
          style={styles.player}
        />
        <FPColumn size={1.5} style={styles.stats}>
          24.5
        </FPColumn>
        <FPColumn size={1.5} style={styles.stats}>
          19.9
        </FPColumn>
        <FPColumn size={1.5} style={styles.stats}>
          15.6
        </FPColumn>
        <FPColumn size={1.5} style={styles.stats}>
          24.5
        </FPColumn>
      </ItemRow>
      <ItemRow style={styles.itemWrapper}>
        <PlayerColumn
          owned
          name="COOPER KUPP"
          position="WR"
          team="STL"
          rating={3}
          size={3}
          style={styles.player}
        />
        <FPColumn size={1.5} style={styles.stats}>
          33.2
        </FPColumn>
        <FPColumn size={1.5} style={styles.stats}>
          21.8
        </FPColumn>
        <FPColumn size={1.5} style={styles.stats}>
          15.8
        </FPColumn>
        <FPColumn size={1.5} style={styles.stats}>
          33.2
        </FPColumn>
      </ItemRow>
    </ListGrid>
  );
};

export default TotalsList;