import ButtonKDS from '../Buttons/ButtonKDS';
import { getElements } from '../utils/helperFunctions';
import { ButtonsContainerProps } from '../utils/types';
import { ButtonsWrapper } from './style';
import { useTranslation } from 'react-i18next';

const showProcessedButtons = (toDone: string[]): boolean =>
  toDone && toDone.length > 0;

const showDeliveredButton = (allDone: string[], toDone: string[]): boolean =>
  allDone && allDone.length > 0 && toDone && toDone.length === 0;

const ButtonsContainer = (props: ButtonsContainerProps): JSX.Element => {
  const {
    isZoomIn,
    setIsZoomIn,
    lines,
    callOrderApi,
    orderId,
    authProvider,
    kdsDeviceConfigs,
      viewMode
  } = props;
  const { toDone, allDone, toPrepare, toConfirm } = getElements(
    lines,
    kdsDeviceConfigs && kdsDeviceConfigs.KDS_STAGE_DONE
      ? kdsDeviceConfigs.KDS_STAGE_DONE
      : ''
  );
  const { t } = useTranslation();

  const setOrderStatus = async (type: any, elements: any[]) => {
    try {
      const { token } = await authProvider();
      callOrderApi(
        orderId,
        type,
        token,
        elements,
        kdsDeviceConfigs && 'KDS_STAGE_DONE' in kdsDeviceConfigs
          ? kdsDeviceConfigs.KDS_STAGE_DONE
          : null
      );
    } catch (error) {
      console.warn(error);
    }
  };
  return (
    <ButtonsWrapper>
      {toConfirm.length > 0 && toPrepare.length === 0 && (
        <ButtonKDS
            small={viewMode === "2"}
          text={t('OS.KDS.Card.Button.CancelPreparing')}
          callOrderApi={() => setOrderStatus('confirm', toConfirm)}
        />
      )}
      {toPrepare.length > 0 && (
        <ButtonKDS
            small={viewMode === "2"}
          text={t('OS.KDS.Card.Button.PrepareAll')}
          callOrderApi={() => setOrderStatus('prepare', toPrepare)}
        />
      )}

      {showProcessedButtons(toDone) && (
        <>
          <ButtonKDS
            text={t('OS.KDS.Card.Button.DoneAll')}
            isIcon={true}
            small={viewMode === "2"}
            callOrderApi={() => setOrderStatus('prepared', toDone)}
          />
          {viewMode !== "2" && isZoomIn && (
                        <ButtonKDS
                            type="white"
                            text={t('OS.KDS.Card.Button.Minimize')}
                            setIsZoomIn={setIsZoomIn}
                            isZoomIn={isZoomIn}
                        />
                    )

          }
          {viewMode !== "2" && !isZoomIn && (
              (
                  <ButtonKDS
                      type="white"
                      isIcon={true}
                      text={t('OS.KDS.Card.Button.Enlarge')}
                      setIsZoomIn={setIsZoomIn}
                      isZoomIn={isZoomIn}
                  />
              )
          )}
        </>
      )}
      {showDeliveredButton(allDone, toDone) && (
        <ButtonKDS small={viewMode === "2"}
          text={t('OS.KDS.Card.Button.Delivered')}
          type={"large"}
          callOrderApi={() => setOrderStatus('deliver', [])}
        />
      )}
    </ButtonsWrapper>
  );
};

export default ButtonsContainer;
