/**
 * @deprecated — no Hugo equivalent.
 * Status badge that maps `FormApprovalStatus` enum values to hex colors via local `Label` (deprecated).
 * Hint: compose from `Pills` from `@material-hu/components/design-system/Pills` with a custom
 * status-to-variant mapper once a Hugo design is defined.
 */
import { FormApprovalStatus } from 'src/types/form';
import { useLokaliseTranslation } from 'src/utils/i18n';

import Label from 'src/components/Label';

type Props = {
  status: FormApprovalStatus;
};

const STATUS_COLOR_MAP = {
  [FormApprovalStatus.APPROVED]: '#73EE8C',
  [FormApprovalStatus.NOT_NEED_APPROVAL]: '#C8C9C7',
  [FormApprovalStatus.CANCELLED]: '#C8C9C7',
  [FormApprovalStatus.PENDING]: '#F9E32C',
  [FormApprovalStatus.REJECTED]: '#E5818A',
};

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

  return (
    <Label
      color={STATUS_COLOR_MAP[status]}
      size="small"
    >
      {t('backoffice_only:form_approval_status.form_approval_status', {
        context: `${status}`,
      })}
    </Label>
  );
};

export default LinearProgressWithLabel;