import { IconButton, Tooltip } from "@mui/material";
import NotificationsEnabledIcon from "@mui/icons-material/NotificationsActive";
import NotificationsDisabledIcon from "@mui/icons-material/NotificationsOff";
interface Props {
  notify: boolean;
  hidden?: boolean;
  onChange: Function;
  disabled?: boolean;
  tooltip: string;
}


export default function NotificationButton (props: Props) {

  const { notify, onChange, hidden, tooltip, disabled } = props;

  if (hidden) {
    return null;
  }

  return (
    <Tooltip title={tooltip}>
      <span>
        <IconButton
          aria-label="toggle notifactions"
          onClick={() => onChange()}
          disabled={disabled}>
          {notify ? <NotificationsEnabledIcon /> : <NotificationsDisabledIcon />}
        </IconButton>
      </span>
    </Tooltip>
  );
}