/**
 * @Move (SQDP)
 * Only used by the Acknowledgements module - move to Acknowledgements/
 */
import Tooltip from '@material-hu/mui/Tooltip';

import { ExchangeWindowStatus as Status } from 'src/types/acknowledgements';
import { useLokaliseTranslation } from 'src/utils/i18n';

import Label from 'src/components/Label';

type Props = {
  status: Status;
};

const STATUS_COLOR_MAP = {
  [Status.ACTIVE]: '#469D4B',
  [Status.EXPIRED]: '#E15141',
  [Status.UPCOMING]: null,
};

const ExchangeWindowStatus = ({ status }: Props) => {
  const { t } = useLokaliseTranslation('backoffice_only');

  if (!STATUS_COLOR_MAP[status]) {
    return null;
  }

  return (
    <Tooltip
      title={t('backoffice_only:exchange_window_status.tooltip', {
        context: status,
      })}
    >
      <div>
        <Label
          color={STATUS_COLOR_MAP[status]}
          size="small"
          sx={{ color: 'white' }}
        >
          {t('backoffice_only:exchange_window_status.window_status', {
            context: status,
          })}
        </Label>
      </div>
    </Tooltip>
  );
};

export default ExchangeWindowStatus;