'use client'

import PropTypes from 'prop-types'
import {useRouter} from 'next/navigation'
import Pagination from '@mui/material/Pagination'
import Grid from '@mui/material/Grid'

export default function Pajinasyon({pajTotal, paj}) {
  const router = useRouter()

  const handleChange = (event, value) => {
    const href = `/awtis?paj=${value}`
    router.push(href)
  }

  return (
    <Grid container sx={{marginTop: 10, marginBottom: 3, justifyContent: 'center'}}>
      <Pagination size='small' page={paj} count={pajTotal} color='primary' onChange={handleChange} />
    </Grid>
  )
}

Pajinasyon.propTypes = {
  pajTotal: PropTypes.number.isRequired,
  paj: PropTypes.number.isRequired
}