import {Container, Grid, makeStyles} from '@material-ui/core'

import TeksKat from './teks-kat'

const useStyles = makeStyles(() => ({
  container: {
    marginTop: '3em'
  }
}))

export default function DenyeTeks(teks) {
  const classes = useStyles()
  const teksKlasePaPibilikasyon = Object.values(teks).sort((a, b) => {
    const aDate = new Date(a.published_at)
    const bDate = new Date(b.published_at)
    return bDate.getTime() - aDate.getTime()
  }).slice(0, 6)

  return (
    <div className={classes.container}>
      <Container>
        <Grid container spacing={3}>
          {teksKlasePaPibilikasyon.map(t => <TeksKat key={t._id} teks={t} />)}
        </Grid>
      </Container>
    </div>
  )
}