import { type Dispatch, type SetStateAction } from 'react';
import { useFormContext } from 'react-hook-form';

import { fromPairs } from 'lodash-es';

import HuFormCheckbox from '@material-hu/components/design-system/Checkbox/Checkbox/form';
import HuTableCell from '@material-hu/components/design-system/Table/components/TableCell';
import HuTableHead from '@material-hu/components/design-system/Table/components/TableHead';
import HuTableRow from '@material-hu/components/design-system/Table/components/TableRow';

import { useGetManagerTypes } from 'src/hooks/queryHooks/vacations';
import { type Vacations } from 'src/types/vacations';
import { useLokaliseTranslation } from 'src/utils/i18n';
import {
  getOptionsSelected,
  isDisabledCheckboxRequest,
  vacationsTableHeader,
} from 'src/utils/vacations';

import {
  createStickyHeaderStyle,
  stickyLeftCellStyle,
  stickyRightCellStyle,
} from '../../constant';

const stickyLeftHeaderCellStyle = createStickyHeaderStyle(stickyLeftCellStyle);
const stickyRightHeaderCellStyle =
  createStickyHeaderStyle(stickyRightCellStyle);

export type RequestRowHeaderProps = {
  isManagerView: boolean;
  vacationData: Vacations;
  onSetSelectAllRequest: Dispatch<SetStateAction<boolean>>;
};

const RequestRowHeader = (props: RequestRowHeaderProps) => {
  const { isManagerView, vacationData, onSetSelectAllRequest } = props;

  const { t } = useLokaliseTranslation('time_off');
  const { setValue, watch } = useFormContext();
  const { isAdmin } = useGetManagerTypes();

  const { requests } = watch();

  const availableRequests = vacationData.filter(
    vc => !isDisabledCheckboxRequest(vc, isAdmin),
  );

  const {
    allSelected: allRequestsSelected,
    someSelected: someRequestsSelected,
  } = getOptionsSelected(requests, availableRequests);

  return (
    <HuTableHead>
      <HuTableRow headerRow>
        {isManagerView && (
          <HuTableCell
            headerCell
            sx={stickyLeftHeaderCellStyle}
          >
            <HuFormCheckbox
              checkBoxProps={{
                label: '',
                onChange: () => {
                  setValue(
                    'requests',
                    fromPairs(
                      availableRequests
                        .map(vd => vd.id)
                        .map(pt => [pt, !allRequestsSelected]),
                    ),
                  );
                  onSetSelectAllRequest(!allRequestsSelected);
                },
                checked: allRequestsSelected,
                indeterminate: someRequestsSelected,
              }}
              name={'requests.ALL'}
            />
          </HuTableCell>
        )}
        {vacationsTableHeader(t, isManagerView).map(headerElement => (
          <HuTableCell
            key={headerElement.id}
            headerCell
            align={headerElement.align}
            sx={{ textWrap: 'nowrap' }}
          >
            {headerElement?.text}
          </HuTableCell>
        ))}
        <HuTableCell sx={stickyRightHeaderCellStyle}></HuTableCell>
      </HuTableRow>
    </HuTableHead>
  );
};

export default RequestRowHeader;