import React from "react";
import Pagination from '@mui/material/Pagination';
import { FormControl, InputLabel } from '@mui/material';

const UsePagination = ({ 
  count, 
  page, 
  onPageChange, 
  rowsPerPage, 
  onRowsPerPageChange,
  totalItems 
}) => {
  return (
    <div className="flex items-center justify-between w-full p-4 border-t">
      <div className="flex items-center gap-2">
        <FormControl size="small">
          <InputLabel>Filas por página</InputLabel>
        </FormControl>
        <span className="text-sm text-gray-600">
        </span>
      </div>
      
      <Pagination
        count={count}
        page={page}
        onChange={onPageChange}
        color="primary"
        size="medium"
        showFirstButton
        showLastButton
        sx={{
          '& .MuiPagination-ul': {
            gap: '4px',
          },
          '& .MuiPaginationItem-root': {
            margin: 0,
            borderRadius: '4px',
            '&.Mui-selected': {
              backgroundColor: '#1976d2',
              color: 'white',
              '&:hover': {
                backgroundColor: '#1565c0',
              },
            },
          },
        }}
      />
    </div>
  );
};

export default UsePagination;