import Link from 'next/link';
import { Badge, ClaimBadge } from '@/components/ui/badge';
import { SourceBadge } from '@/components/ui/source-badge';
import { fmtInt, fmtPct } from '@/lib/format';
import type { PathChain } from '@/lib/graph-model';

const SOURCE_SLUG_BY_ID: Record<string, string> = { 'CI-SOURCE-00000006': 'civic', 'CI-SOURCE-00000015': 'chembl', 'CI-SOURCE-00000016': 'openfda', 'CI-SOURCE-00000004': 'clinicaltrials', 'CI-SOURCE-00000008': 'gdc', 'CI-SOURCE-00000017': 'cbioportal' };

function Arrow() {
  return (
    <span aria-hidden className="mx-1 text-ink-4">
      →
    </span>
  );
}

/**
 * One cancer → gene → variant → drug → approval → trials chain, readable as a sentence. Each hop
 * keeps its own claim category: cohort frequency (observed), CIViC predictive edge (curated),
 * approval (regulatory), trial count (observed). Missing hops say so — nothing is filled in.
 */
export function PathChainView({ chain, compact = false, sourceSlugs }: { chain: PathChain; compact?: boolean; sourceSlugs?: Map<string, string> }) {
  const slugOf = (id: string) => sourceSlugs?.get(id) ?? SOURCE_SLUG_BY_ID[id] ?? id;
  const g = chain.gene;
  const freq = g.frequency != null && g.casesAffected != null && g.casesProfiled != null ? `${fmtPct(g.frequency, g.frequency >= 0.1 ? 0 : 1)} (${fmtInt(g.casesAffected)} / ${fmtInt(g.casesProfiled)} cases${g.cohorts > 1 ? `, largest of ${g.cohorts} cohorts` : ''})` : null;
  return (
    <li className={`ci-rule ${compact ? 'py-2' : 'py-3'} text-[13.5px] leading-relaxed`}>
      <p className="m-0 flex flex-wrap items-baseline">
        <Link href={`/gene/${g.symbol}`} className="ci-link ci-mono font-sans font-medium">
          {g.symbol}
        </Link>
        <Arrow />
        <Link href={`/variant/${chain.variant.slug}`} className="ci-link">
          {chain.variant.name}
        </Link>
        <Arrow />
        <Link href={`/drug/${chain.drug.slug}`} className="ci-link font-medium">
          {chain.drug.name}
        </Link>
        {chain.approval ? (
          <>
            <Arrow />
            <span>
              {chain.approval.authority} <Badge tone="outline" mono>{chain.approval.jurisdiction}</Badge>
              {chain.approval.approvalDate ? <span className="ci-num text-ink-2"> {chain.approval.approvalDate}</span> : <span className="text-ink-3"> (date not published)</span>}
              {chain.approval.tumorAgnostic && !chain.approval.cancerId ? <span className="text-ink-3"> · tumour-agnostic</span> : null}
            </span>
          </>
        ) : null}
        {chain.trials ? (
          <>
            <Arrow />
            <span>
              <span className="ci-num">{fmtInt(chain.trials.active)}</span> active / <span className="ci-num">{fmtInt(chain.trials.total)}</span> trials
            </span>
          </>
        ) : null}
      </p>
      <p className="m-0 mt-1 flex flex-wrap items-center gap-x-2 gap-y-1 text-[12px] text-ink-3">
        <span className="inline-flex items-center gap-1">
          <ClaimBadge kind="curated" />
          {chain.edge.evidenceLevel ? (
            <Badge tone="accent" mono title="Source-native evidence level (CIViC A–E)">
              level {chain.edge.evidenceLevel}
            </Badge>
          ) : (
            <Badge tone="outline">level not stated</Badge>
          )}
          <span>{chain.edge.direction ?? 'direction unknown'}</span>
          <span>
            · support <span className="ci-num">{fmtInt(chain.edge.supportCount)}</span>
          </span>
          {chain.edge.sourceIds.map((s) => (
            <SourceBadge key={s} compact p={{ sourceSlug: slugOf(s) }} title={null} />
          ))}
        </span>
        {!compact ? (
          <>
            <span aria-hidden>·</span>
            <span className="inline-flex items-center gap-1">
              <ClaimBadge kind="observed" />
              {freq ? <span>{g.symbol} altered in {freq}</span> : <span>cohort frequency not yet available for {g.symbol} in this cancer</span>}
            </span>
            {chain.approval ? (
              <>
                <span aria-hidden>·</span>
                <span className="inline-flex items-center gap-1">
                  <ClaimBadge kind="regulatory" />
                  <span>
                    {chain.approval.status}
                    {chain.approval.cancerName ? ` for ${chain.approval.cancerName}` : ''}
                    {chain.approval.total > 1 ? ` (${fmtInt(chain.approval.total)} approval records)` : ''}
                  </span>
                </span>
              </>
            ) : (
              <>
                <span aria-hidden>·</span>
                <span>no approval record in this cancer</span>
              </>
            )}
            {chain.edge.contextNames.length ? (
              <>
                <span aria-hidden>·</span>
                <span>
                  context: {chain.edge.contextNames.slice(0, 3).join(', ')}
                  {chain.edge.contextNames.length > 3 ? ` +${chain.edge.contextNames.length - 3}` : ''}
                </span>
              </>
            ) : null}
          </>
        ) : null}
      </p>
    </li>
  );
}