import { Button, Group } from '@mantine/core';
import { IconCheck, IconPaperclip, IconX } from '@tabler/icons-react';
import type { TFunction } from 'i18next';
import type { AdvancedColumn } from '@ema-platform/ui';
import type { MedicalCertificate, SeaServiceRecord } from '@ema-platform/api';
import { LICENSE_PERMISSIONS, RequirePermission } from '@ema-platform/auth';

export function medicalActionsColumn(
  t: TFunction,
  handlers: {
    ruling: boolean;
    onEvidence: (certificate: MedicalCertificate) => void;
    onVerify: (certificate: MedicalCertificate) => void;
    onReject: (certificate: MedicalCertificate) => void;
  },
): AdvancedColumn<MedicalCertificate> {
  return {
    header: '',
    label: t('recordVerification.columns.actions', 'Actions'),
    align: 'right',
    cell: ({ row }) => (
      <Group gap="xs" justify="flex-end" wrap="nowrap">
        <Button
          size="compact-xs"
          color="blue"
          variant="light"
          leftSection={<IconPaperclip size={14} />}
          onClick={() => handlers.onEvidence(row.original)}
        >
          {t('recordVerification.evidence', 'Evidence')}
        </Button>
        <RequirePermission
          anyOf={[LICENSE_PERMISSIONS.VERIFY_SEAFARER_RECORDS]}
          hideOnly
        >
          {row.original.status === 'SUBMITTED' && (
            <>
              <Button
                size="compact-xs"
                color="teal"
                leftSection={<IconCheck size={14} />}
                loading={handlers.ruling}
                onClick={() => handlers.onVerify(row.original)}
              >
                {t('recordVerification.verify', 'Verify')}
              </Button>
              <Button
                size="compact-xs"
                color="red"
                variant="light"
                leftSection={<IconX size={14} />}
                onClick={() => handlers.onReject(row.original)}
              >
                {t('recordVerification.reject', 'Reject')}
              </Button>
            </>
          )}
        </RequirePermission>
      </Group>
    ),
  };
}

export function seaServiceActionsColumn(
  t: TFunction,
  handlers: {
    ruling: boolean;
    onEvidence: (record: SeaServiceRecord) => void;
    onVerify: (record: SeaServiceRecord) => void;
    onReject: (record: SeaServiceRecord) => void;
  },
): AdvancedColumn<SeaServiceRecord> {
  return {
    header: '',
    label: t('recordVerification.columns.actions', 'Actions'),
    align: 'right',
    cell: ({ row }) => (
      <Group gap="xs" justify="flex-end" wrap="nowrap">
        <Button
          size="compact-xs"
          color="blue"
          variant="light"
          leftSection={<IconPaperclip size={14} />}
          onClick={() => handlers.onEvidence(row.original)}
        >
          {t('recordVerification.evidence', 'Evidence')}
        </Button>
        <RequirePermission
          anyOf={[LICENSE_PERMISSIONS.VERIFY_SEAFARER_RECORDS]}
          hideOnly
        >
          {row.original.status === 'SUBMITTED' && (
            <>
              <Button
                size="compact-xs"
                color="teal"
                leftSection={<IconCheck size={14} />}
                loading={handlers.ruling}
                onClick={() => handlers.onVerify(row.original)}
              >
                {t('recordVerification.verify', 'Verify')}
              </Button>
              <Button
                size="compact-xs"
                color="red"
                variant="light"
                leftSection={<IconX size={14} />}
                onClick={() => handlers.onReject(row.original)}
              >
                {t('recordVerification.reject', 'Reject')}
              </Button>
            </>
          )}
        </RequirePermission>
      </Group>
    ),
  };
}
