"use client";

import { Box, CircularProgress, Fab, Tooltip } from "@mui/material";
import SaveIcon from "@mui/icons-material/Save";

interface PickerBatchSaveFabProps {
  onClick: () => void;
  disabled: boolean;
  loading: boolean;
  label: string;
}

const PickerBatchSaveFab: React.FC<PickerBatchSaveFabProps> = ({
  onClick,
  disabled,
  loading,
  label,
}) => (
  <Tooltip title={label} placement="top">
    <Box
      component="span"
      sx={{
        position: "fixed",
        bottom: 24,
        right: 24,
        zIndex: 1100,
        display: "inline-flex",
      }}
    >
      <Fab
        color="primary"
        aria-label={label}
        onClick={onClick}
        disabled={disabled}
        sx={{
          boxShadow: 4,
          "&:hover": { boxShadow: 6 },
        }}
      >
        {loading ? (
          <CircularProgress size={28} color="inherit" />
        ) : (
          <SaveIcon />
        )}
      </Fab>
    </Box>
  </Tooltip>
);

export default PickerBatchSaveFab;
