import { ArrowUpRight, ChevronDown, MapPin } from 'lucide-react';
import Link from 'next/link';
import type { ReactNode } from 'react';
import { Chip } from '@/components/ui/badges';
import { Empty, Note } from '@/components/ui/section';
import { cn } from '@/lib/cn';
import { countryName } from '@/lib/countries';
import { fmtDate, fmtDateTime, fmtInt, fmtMoney, plural } from '@/lib/format';
import { descriptionOf, groupRelationships, logoCandidates, relationshipName, sourceFor, sourceLabel } from '@/lib/profile';
import { routes } from '@/lib/site';
import type { CompanyCard, CompanyDetail, CompanyFact, MoneyFact, Relationship } from '@/lib/types';
import { CompanyLogo } from './company-logo';

/* ------------------------------------------------------------------------------------------------------- source chip */
/** Small provenance chip; `title` carries the retrieval time so every fact is auditable on hover / long-press. */
export function SourceChip({ source, url, retrievedAt, className }: { source: string | null | undefined; url?: string | null; retrievedAt?: string | null; className?: string }) {
  if (!source) return null;
  const label = sourceLabel(source);
  const title = retrievedAt ? `${label} · retrieved ${fmtDateTime(retrievedAt)}` : label;
  const llm = source.toLowerCase() === 'llm';
  const chip = (
    <Chip tone={llm ? 'warning' : 'outline'} title={title} className={cn('font-normal', className)}>
      {label}
    </Chip>
  );
  if (!url) return chip;
  return (
    <a href={url} target="_blank" rel="noopener nofollow noreferrer" className="inline-flex hover:opacity-80" aria-label={`${label} source (opens in a new tab)`}>
      {chip}
    </a>
  );
}

/* ------------------------------------------------------------------------------------------------ description credit */
/** Attribution line under the description — the wording depends on where the paragraph came from. */
export function DescriptionAttribution({ c, className }: { c: CompanyCard; className?: string }) {
  const d = descriptionOf(c);
  if (!d || !d.source) return null;
  const ext = { target: '_blank', rel: 'noopener nofollow noreferrer' } as const;
  if (d.source === 'wikipedia') {
    const license = d.license ?? 'CC BY-SA 4.0';
    return (
      <p className={cn('text-[11px] text-ink-3', className)}>
        Source:{' '}
        {d.url ? (
          <a href={d.url} {...ext} className="hover:text-accent">
            Wikipedia
          </a>
        ) : (
          'Wikipedia'
        )}{' '}
        · {license}
      </p>
    );
  }
  if (d.source === 'wikidata') {
    return (
      <p className={cn('text-[11px] text-ink-3', className)}>
        Source:{' '}
        {d.url ? (
          <a href={d.url} {...ext} className="hover:text-accent">
            Wikidata
          </a>
        ) : (
          'Wikidata'
        )}
        {d.license ? ` · ${d.license}` : ' · CC0'}
      </p>
    );
  }
  if (d.source === 'homepage') {
    return (
      <p className={cn('text-[11px] text-ink-3', className)}>
        {d.url ? (
          <a href={d.url} {...ext} className="hover:text-accent">
            From the company’s website
          </a>
        ) : (
          'From the company’s website'
        )}
      </p>
    );
  }
  return (
    <p className={cn('flex flex-wrap items-center gap-1.5 text-[11px] text-ink-3', className)}>
      <Chip tone="warning" className="font-normal">
        Generated from the company’s public pages
      </Chip>
      <span>Model-written summary of observed first-party text — not a statement by the company.</span>
    </p>
  );
}

/* ----------------------------------------------------------------------------------------------------- key facts */
type FactRow = { key: string; label: ReactNode; value: ReactNode; source: string | null; url: string | null; retrievedAt: string | null };

const MONEY_LABEL: Record<'revenue' | 'net_income' | 'total_assets', string> = { revenue: 'Revenue', net_income: 'Net income', total_assets: 'Total assets' };

function money(m: MoneyFact | null): ReactNode {
  if (!m || typeof m.value !== 'number') return null;
  return (
    <span className="tnum">
      {fmtMoney(m.value, m.currency)} <span className="text-ink-3">· FY{m.year}</span>
    </span>
  );
}

/** Deterministic public registry links for identifiers (no lookup, no inference). */
const EDGAR = (cik: string) => `https://www.sec.gov/cgi-bin/browse-edgar?action=getcompany&CIK=${encodeURIComponent(cik)}`;
const GLEIF = (lei: string) => `https://search.gleif.org/#/record/${encodeURIComponent(lei)}`;

/** Builds the sourced fact rows: structured profile fields first (typed formatting), then any extra `facts[]` entries. */
export function buildFactRows(c: CompanyDetail): FactRow[] {
  const p = c.profile ?? null;
  const rows: FactRow[] = [];
  const covered = new Set<string>();
  const push = (key: string, label: ReactNode, value: ReactNode, fields: string[] = [key]) => {
    if (value === null || value === undefined || value === '' || value === false) return;
    const s = sourceFor(p, ...fields);
    const f = (c.facts ?? []).find((x) => x.key === key || fields.includes(x.key));
    rows.push({ key, label, value, source: s?.source ?? f?.source ?? null, url: s?.url ?? f?.url ?? null, retrievedAt: s?.retrieved_at ?? f?.retrieved_at ?? null });
    covered.add(key);
    fields.forEach((x) => covered.add(x));
  };

  if (p) {
    if (p.founded_year) push('founded_year', 'Founded', <span className="tnum">{p.founded_year}</span>, ['founded_year', 'founded', 'inception']);
    const hqParts = [p.hq?.city, p.hq?.region, p.hq?.country ? countryName(p.hq.country) : null].filter(Boolean) as string[];
    if (hqParts.length)
      push(
        'hq',
        'Headquarters',
        <span className="inline-flex flex-wrap items-center gap-x-1.5">
          <span>{hqParts.join(', ')}</span>
          <Link href={routes.company(c.slug, 'locations')} scroll={false} className="inline-flex items-center gap-0.5 text-[11px] text-ink-3 hover:text-accent" aria-label="Open the Locations tab">
            <MapPin className="size-3" aria-hidden /> map
          </Link>
        </span>,
        ['hq', 'headquarters', 'hq_city', 'hq_country'],
      );
    if (typeof p.employees === 'number')
      push(
        'employees',
        'Employees',
        <span className="tnum">
          {fmtInt(p.employees)}
          {p.employees_year ? <span className="text-ink-3"> · {p.employees_year}</span> : null}
        </span>,
        ['employees', 'employees_year'],
      );
    for (const k of ['revenue', 'net_income', 'total_assets'] as const) push(k, MONEY_LABEL[k], money(p[k]));
    if (p.legal_form) push('legal_form', 'Legal form', p.legal_form);
    if (p.public_company && (p.ticker || c.ticker))
      push(
        'listing',
        'Listing',
        <span className="mono text-xs">
          {p.ticker ?? c.ticker}
          {(p.exchange ?? c.exchange) && <span className="text-ink-3"> · {p.exchange ?? c.exchange}</span>}
        </span>,
        ['ticker', 'exchange', 'listing'],
      );
    if (p.isin) push('isin', 'ISIN', <span className="mono text-xs">{p.isin}</span>);
    if (p.lei)
      push(
        'lei',
        'LEI',
        <a href={GLEIF(p.lei)} target="_blank" rel="noopener nofollow noreferrer" className="mono inline-flex items-center gap-0.5 text-xs hover:text-accent">
          {p.lei} <ArrowUpRight className="size-3 text-ink-3" aria-hidden />
        </a>,
      );
    if (p.sec_cik)
      push(
        'sec_cik',
        'SEC CIK',
        <a href={EDGAR(p.sec_cik)} target="_blank" rel="noopener nofollow noreferrer" className="mono inline-flex items-center gap-0.5 text-xs hover:text-accent">
          {p.sec_cik} <ArrowUpRight className="size-3 text-ink-3" aria-hidden />
        </a>,
        ['sec_cik', 'cik'],
      );
    if (p.industry_labels?.length) push('industry_labels', 'Industry (Wikidata)', p.industry_labels.join(', '), ['industry_labels', 'industries']);
    if (p.phone) push('phone', 'Phone', <span className="mono text-xs">{p.phone}</span>);
    if (p.wikipedia_url || p.wikidata_url)
      push(
        'references',
        'References',
        <span className="flex flex-wrap gap-x-3 gap-y-0.5 text-xs">
          {p.wikipedia_url && (
            <a href={p.wikipedia_url} target="_blank" rel="noopener nofollow noreferrer" className="link inline-flex items-center gap-0.5">
              Wikipedia <ArrowUpRight className="size-3" aria-hidden />
            </a>
          )}
          {p.wikidata_url && (
            <a href={p.wikidata_url} target="_blank" rel="noopener nofollow noreferrer" className="link inline-flex items-center gap-0.5">
              Wikidata <ArrowUpRight className="size-3" aria-hidden />
            </a>
          )}
        </span>,
        ['wikipedia_url', 'wikidata_url'],
      );
  }
  // extra flattened facts not already rendered from the structured profile
  for (const f of c.facts ?? []) {
    if (covered.has(f.key) || !f.value) continue;
    rows.push({ key: `fact:${f.key}`, label: f.label || f.key, value: f.value, source: f.source, url: f.url, retrievedAt: f.retrieved_at });
    covered.add(f.key);
  }
  return rows;
}

/** Overview → first block. Hides null facts; each row carries a source chip whose tooltip is the retrieval time. */
export function KeyFactsPanel({ c, className }: { c: CompanyDetail; className?: string }) {
  const rows = buildFactRows(c);
  const enriched = c.profile?.enriched_at ?? null;
  return (
    <section className={className} data-key-facts>
      <div className="mb-2 flex items-baseline justify-between gap-2">
        <p className="eyebrow">Key facts</p>
        {enriched && <span className="text-[11px] text-ink-3">enriched {fmtDate(enriched)}</span>}
      </div>
      {rows.length === 0 ? (
        <Empty compact title="No sourced facts yet — enrichment pending.">
          Facts appear here once Wikidata, Wikipedia or registry lookups have been reconciled for this company.
        </Empty>
      ) : (
        <dl className="border-y border-rule text-sm">
          {rows.map((r) => (
            <div key={r.key} className="grid grid-cols-[6.5rem_minmax(0,1fr)_auto] items-baseline gap-x-3 border-b border-rule py-1.5 last:border-b-0 sm:grid-cols-[7.5rem_minmax(0,1fr)_auto]">
              <dt className="text-[13px] text-ink-3">{r.label}</dt>
              <dd className="min-w-0 break-words text-ink">{r.value}</dd>
              <dd className="shrink-0 self-center">
                <SourceChip source={r.source} url={r.url} retrievedAt={r.retrievedAt} />
              </dd>
            </div>
          ))}
        </dl>
      )}
      {rows.length > 0 && <Note className="mt-2">Facts are quoted from their source as retrieved; figures are not converted or adjusted, and a missing fact is simply not shown.</Note>}
    </section>
  );
}

/* ------------------------------------------------------------------------------------------- corporate structure */
function validity(r: Relationship): string | null {
  if (r.valid_from && r.valid_to) return `${fmtDate(r.valid_from)} – ${fmtDate(r.valid_to)}`;
  if (r.valid_from) return `since ${fmtDate(r.valid_from)}`;
  if (r.valid_to) return `until ${fmtDate(r.valid_to)}`;
  return null;
}

function RelationshipRow({ r, showKind = false }: { r: Relationship; showKind?: boolean }) {
  const name = relationshipName(r);
  const v = validity(r);
  const ended = !!r.valid_to;
  return (
    <li className={cn('flex flex-wrap items-center gap-x-2 gap-y-1 py-1.5 text-sm', ended && 'text-ink-2')}>
      <CompanyLogo name={name} candidates={r.company ? logoCandidates({ logo_url: r.company.logo_url ?? null }) : []} size={20} rounded="sm" />
      {r.company ? (
        <Link href={routes.company(r.company.slug)} className="min-w-0 truncate font-medium text-ink hover:text-accent">
          {name}
        </Link>
      ) : (
        <span className="min-w-0 truncate" title="Not an atlas company">
          {name}
        </span>
      )}
      {showKind && <Chip>{(r.kind ?? '').toLowerCase().replace(/_/g, ' ')}</Chip>}
      {ended && <Chip>former</Chip>}
      <span className="ml-auto inline-flex items-center gap-1.5 text-[11px] text-ink-3">
        {v && <span className="tnum">{v}</span>}
        {typeof r.confidence === 'number' && (
          <span className="tnum" title="relationship confidence">
            {Math.round(r.confidence * 100)} %
          </span>
        )}
        <SourceChip source={r.provenance?.source} retrievedAt={null} />
      </span>
    </li>
  );
}

/** Parent / owners / subsidiaries / holdings / acquisitions, grouped; collapsible when there are more than 8 rows. */
export function CorporateStructurePanel({ relationships, className, collapseAfter = 8 }: { relationships: Relationship[]; className?: string; collapseAfter?: number }) {
  const rels = relationships ?? [];
  const groups = groupRelationships(rels);
  const total = rels.length;
  const body = (
    <div className="space-y-4">
      {groups.map(({ group, rows }) => (
        <div key={group.id}>
          <p className="mb-0.5 flex items-baseline gap-2 text-[11px] font-semibold uppercase tracking-[0.1em] text-ink-3" title={group.hint}>
            {group.label} <span className="tnum font-normal normal-case tracking-normal">({rows.length})</span>
          </p>
          <ul className="divide-y divide-rule border-y border-rule">
            {rows.map((r, i) => (
              <RelationshipRow key={`${r.kind}:${r.company?.slug ?? r.to_name ?? i}:${r.valid_from ?? ''}`} r={r} showKind={group.id === 'other'} />
            ))}
          </ul>
        </div>
      ))}
      <Note>Structure as recorded by the cited sources (Wikidata statements, registries, first-party pages). “Former” marks a relationship with a recorded end date; the platform does not infer ownership changes.</Note>
    </div>
  );
  return (
    <section className={className} data-corporate-structure>
      <p className="eyebrow mb-2">Corporate structure</p>
      {total === 0 ? (
        <Empty compact title="No corporate relationships recorded yet." />
      ) : total > collapseAfter ? (
        <details className="group">
          <summary className="flex cursor-pointer list-none items-center gap-2 border-y border-rule py-2 text-sm text-ink-2 hover:text-ink [&::-webkit-details-marker]:hidden">
            <ChevronDown className="size-4 transition-transform group-open:rotate-180" aria-hidden />
            <span>
              {fmtInt(total)} recorded {plural(total, 'relationship')} · {groups.map((g) => `${g.rows.length} ${g.group.label.toLowerCase()}`).join(' · ')}
            </span>
          </summary>
          <div className="pt-3">{body}</div>
        </details>
      ) : (
        body
      )}
    </section>
  );
}

/* ---------------------------------------------------------------------------------------------- products (Wikidata) */
/** Fallback for the Products tab when no catalogue surface has been reconciled: products/services as stated on Wikidata. */
export function WikidataProducts({ products, source, className }: { products: string[]; source?: { url: string | null; retrieved_at: string } | null; className?: string }) {
  if (!products?.length) return null;
  return (
    <section className={className} data-wikidata-products>
      <p className="eyebrow mb-2 flex flex-wrap items-center gap-2">
        Products &amp; services listed on Wikidata <span className="tnum normal-case tracking-normal">({products.length})</span>
        <SourceChip source="wikidata" url={source?.url ?? null} retrievedAt={source?.retrieved_at ?? null} />
      </p>
      <ul className="flex flex-wrap gap-1.5">
        {products.map((p) => (
          <li key={p}>
            <Chip tone="neutral" className="font-normal">
              {p}
            </Chip>
          </li>
        ))}
      </ul>
      <Note className="mt-2">These names come from Wikidata “product or material produced” statements — not from a monitored catalogue page, so they carry no first-seen / last-seen dates.</Note>
    </section>
  );
}

export type { CompanyFact };