"use client";

import { Badge } from "@/components/ui/badge";
import { useTranslation } from "@/hooks/useTranslation";
import type { ProviderStatus, VerificationStatus } from "@/types/provider";

import {
  DOCUMENT_STATUS_VARIANT,
  PROVIDER_STATUS_VARIANT,
} from "./lib/provider-status";

/**
 * Provider account status pill. The dictionary keys under `providers.status`
 * mirror the ProviderStatus enum, so the lookup is a direct interpolation.
 */
export function ProviderStatusBadge({ status }: { status: ProviderStatus }) {
  const { t } = useTranslation();

  return (
    <Badge variant={PROVIDER_STATUS_VARIANT[status]}>
      {t(`providers.status.${status}`)}
    </Badge>
  );
}

/** KYC document verification status pill */
export function DocumentStatusBadge({
  status,
}: {
  status: VerificationStatus;
}) {
  const { t } = useTranslation();

  return (
    <Badge variant={DOCUMENT_STATUS_VARIANT[status]}>
      {t(`providers.documentStatus.${status}`)}
    </Badge>
  );
}