import styles from '../styles/Home.module.css';
import Grid from '@mui/material/Grid';
import { H3 } from '../components/UI/H3/H3';
import { TableArrivals } from '../components/Table/Arrivals';

function createData(
  name: string,
  attempt_1: number,
  attempt_2: number,
  attempt_3: number,
  attempt_4: number,
  attempt_all: number
) {
  return { name, attempt_1, attempt_2, attempt_3, attempt_4, attempt_all };
}

const rows = [
  createData('Frozen yoghurt', 159, 6, 24, 4, 5),
  createData('Ice cream sandwich', 237, 9.0, 37, 4.3, 5),
  createData('Eclair', 262, 16.0, 24, 6.0, 6),
  createData('Cupcake', 305, 3.7, 67, 4.3, 7),
  createData('Gingerbread', 356, 16.0, 49, 3.9, 8),
];

export default function Arrivals() {
  return (
    <div className={styles.container}>
      <div className='header'>
        <H3>Заезды: Робо-слалом </H3>
      </div>
      <main className={styles.main}>
        <Grid container rowSpacing={1} columnSpacing={{ xs: 12, sm: 4, md: 4 }}>
          <Grid item xs={12} sm={3} md={4}>
            <TableArrivals nominations={'Младшая группа'} data={rows}/>
          </Grid>
          <Grid item xs={12} sm={3} md={4}>
            <TableArrivals nominations={'Младшая группа'} data={rows}/>
          </Grid>
          <Grid item xs={12} sm={3} md={4}>
            <TableArrivals nominations={'Младшая группа'} data={rows}/>
          </Grid>
        </Grid>
      </main>
    </div>
  )
}