"use client";

import Link from "next/link";
import { useMemo } from "react";
import { ConfidenceMeter } from "@/components/ui/confidence";
import { DataTable, type Column } from "@/components/ui/data-table";
import { FreshnessLabel } from "@/components/ui/freshness";
import { LivePrice, ChangeCell } from "@/components/ui/price";
import { StatusBadge } from "@/components/ui/status-badge";
import { ASSET_CLASS_LABEL, formatCompact, instrumentHref } from "@/lib/format";
import { useLiveQuote, useMarketStream } from "@/lib/stream";
import type { InstrumentWithQuote } from "@/lib/types";

function LiveChange({ row }: { row: InstrumentWithQuote }) {
  const live = useLiveQuote(row.id);
  const useLive = !!live && row.quote && live.received >= Date.parse(row.quote.updated_at);
  return <ChangeCell value={useLive ? live!.change_pct : row.quote?.change_percent} />;
}

function LiveVolume({ row }: { row: InstrumentWithQuote }) {
  const live = useLiveQuote(row.id);
  const v = live && row.quote && live.received >= Date.parse(row.quote.updated_at) ? live.volume : row.quote?.volume;
  return <span className="mono tnum text-ink-2">{formatCompact(v)}</span>;
}

/**
 * Dense instrument table with live cells. Subscribes to the per-class stream channel when
 * `liveClass` is given (one subscription for the whole table), otherwise per-instrument channels
 * for tables under ~60 rows.
 */
export function InstrumentTable({ rows, liveClass, showClass, showExchange, defaultSort = "change", compact, maxHeight, emptyText }: { rows: InstrumentWithQuote[]; liveClass?: string | string[]; showClass?: boolean; showExchange?: boolean; defaultSort?: string; compact?: boolean; maxHeight?: string; emptyText?: string }) {
  const channels = useMemo(() => {
    if (liveClass) return (Array.isArray(liveClass) ? liveClass : [liveClass]).map((c) => `quotes:class:${c}`);
    return rows.slice(0, 80).map((r) => `quotes:${r.id}`);
  }, [liveClass, rows]);
  useMarketStream(channels);

  const columns: Column<InstrumentWithQuote>[] = [
    {
      key: "symbol",
      header: "Symbol",
      sort: (r) => r.symbol,
      cell: (r) => (
        <Link href={instrumentHref(r.id)} className="block min-w-0">
          <span className="mono block font-medium leading-tight">{r.symbol}</span>
          <span className="block max-w-[180px] truncate text-[11.5px] text-ink-3 sm:max-w-[260px]">{r.name}</span>
        </Link>
      ),
    },
    ...(showClass ? [{ key: "class", header: "Class", hideBelow: "sm" as const, sort: (r: InstrumentWithQuote) => r.asset_class, cell: (r: InstrumentWithQuote) => <span className="text-xs text-ink-2">{ASSET_CLASS_LABEL[r.asset_class] ?? r.asset_class}</span> }] : []),
    ...(showExchange ? [{ key: "exchange", header: "Venue", hideBelow: "md" as const, sort: (r: InstrumentWithQuote) => r.exchange_id ?? "", cell: (r: InstrumentWithQuote) => <span className="mono text-xs text-ink-2">{r.mic ?? r.exchange_id?.toUpperCase() ?? "—"}</span> }] : []),
    { key: "price", header: "Price", num: true, sort: (r) => r.quote?.price, cell: (r) => <LivePrice instrumentId={r.id} quote={r.quote} assetClass={r.asset_class} showChange={false} /> },
    { key: "change", header: "Chg %", num: true, sort: (r) => r.quote?.change_percent, cell: (r) => <LiveChange row={r} /> },
    ...(compact ? [] : [{ key: "volume", header: "Volume", num: true, hideBelow: "md" as const, sort: (r: InstrumentWithQuote) => r.quote?.volume, cell: (r: InstrumentWithQuote) => <LiveVolume row={r} /> }]),
    { key: "conf", header: "Confidence", hideBelow: "sm", sort: (r) => r.quote?.confidence, cell: (r) => <ConfidenceMeter confidence={r.quote?.confidence} sources={r.quote?.source_count} proxies={r.quote?.proxy_count} validators={r.quote?.validator_count} /> },
    { key: "status", header: "Status", sort: (r) => r.quote?.data_status, cell: (r) => <StatusBadge status={r.quote?.data_status} /> },
    ...(compact ? [] : [{ key: "fresh", header: "Freshness", hideBelow: "lg" as const, cell: (r: InstrumentWithQuote) => <FreshnessLabel quote={r.quote} /> }]),
  ];
  return <DataTable rows={rows} columns={columns} rowKey={(r) => r.id} defaultSort={defaultSort} maxHeight={maxHeight} emptyText={emptyText} />;
}