import IconButton, { IconButtonProps } from '@mui/material/IconButton';
import { memo, ReactNode } from 'react';
import css from './PaginationButton.module.scss';

export interface PaginationButtonProps extends IconButtonProps {
  /** The icon to show inside the {@link IconButton} */
  icon: ReactNode;
}

export const PaginationButton = memo(({ onClick, disabled, icon, ...props }: PaginationButtonProps) => (
  <IconButton {...props} disabled={disabled} onClick={onClick} color='primary' className={css.noHoverBackground}>
    {icon}
  </IconButton>
));