import { formatAgorotGrouped, formatAgorotShekels } from '@/lib/money';
import type { StringBundle } from '@/lib/i18n/types';
import {
  Tooltip,
  TooltipContent,
  TooltipProvider,
  TooltipTrigger,
} from '@/components/ui/overlays/Tooltip';

export type AffiliateLtvData = {
  marginAgorot: number;
  stripeFeeKnown: boolean;
  totalPayoutsAgorot: number;
};

type AdminAffiliatesT = (key: keyof StringBundle['admin_affiliates']) => string;

export function affiliateMarginAgorot(ltv?: AffiliateLtvData): number {
  return ltv?.marginAgorot ?? 0;
}

export function affiliateTotalPayoutsAgorot(ltv?: AffiliateLtvData): number {
  return ltv?.totalPayoutsAgorot ?? 0;
}

export function AffiliateLtvMarginValue({
  ltv,
  t,
}: {
  ltv?: AffiliateLtvData;
  t: AdminAffiliatesT;
}) {
  const marginAgorot = affiliateMarginAgorot(ltv);
  const approximate = ltv != null && ltv.stripeFeeKnown === false;

  const value = (
    <span
      className="tabular-nums"
      data-affiliate-ltv-margin-agorot={marginAgorot}
      data-affiliate-ltv-stripe-fee-known={ltv?.stripeFeeKnown ?? true}
    >
      {approximate && (
        <span className="me-0.5 text-(--color-text-muted)" aria-hidden="true">
          {t('ltv_margin_approx_prefix')}
        </span>
      )}
      {formatAgorotGrouped(marginAgorot)}
    </span>
  );

  if (!approximate) return value;

  return (
    <TooltipProvider>
      <Tooltip>
        <TooltipTrigger asChild>
          <span className="cursor-help">{value}</span>
        </TooltipTrigger>
        <TooltipContent>{t('ltv_margin_approx_hint')}</TooltipContent>
      </Tooltip>
    </TooltipProvider>
  );
}

export function AffiliateTotalPayoutsValue({ ltv }: { ltv?: AffiliateLtvData }) {
  const totalPayoutsAgorot = affiliateTotalPayoutsAgorot(ltv);

  return (
    <span className="tabular-nums" data-affiliate-total-payouts-agorot={totalPayoutsAgorot}>
      {formatAgorotShekels(totalPayoutsAgorot)}
    </span>
  );
}