import type {
  ActionableRow,
  ActionableSummary,
} from "../../lib/actionable/loadActionable";
import {
  buildChannelRowView,
  neutralChannelPriority,
  type ChannelRowView,
} from "yt-dlp-transcript-common/views/channelRow";
import { InlineActionButton } from "../actions/InlineActionButton";
import { ChannelsTable } from "../../channels/components/ChannelsTable";
import type { ChannelRowExtras } from "../../channels/components/channelColumns";
// From the plain-data module, never the "use client" registry: a server
// component importing a client module's value gets a reference, not the array.
import { WORK_COLUMNS } from "../../channels/components/channelColumnPresets";
import type { SectionConfig } from "./sections";

// A server component on purpose: `SectionConfig.primaryAction` is a function
// that returns an element, and a function cannot cross the server/client
// boundary as a prop. So this is the SHELL — section, heading, description,
// empty paragraph — and the rows are the shared channel table
// (channels/components/ChannelsTable.tsx) with the WORK_COLUMNS preset, fed
// each row's count, extra figure and actions as data and elements.
//
// THE ARIA CONTRACT BELOW IS LOAD-BEARING. `channel-work.spec`,
// `cleanup-actionable.spec`, `incomplete-transcript.spec` and
// `download-format-guard.spec` all locate by these exact strings:
//   <section aria-label="<id>">, <h2>{title}</h2>,
//   <p aria-label="<id> empty">, <tr aria-label="<id> row <slug>">,
//   columns Slug / countLabel / [extra] / Last report / Last sync / Actions
//   (the report cell is the rack's: `report age for <slug>`, "stale" /
//   "missing" in the warning colour),
//   and a `refresh report <slug>` InlineActionButton on every row.
//
// NEVER add `role="status"` in here. This renders on the RUNNER operation
// pages, where `auto-subs-replace.spec.ts` takes `getByRole("status").first()`
// and the runner section reserves that role for its own console.
//
// On /cleanup the ChannelCleanupCard's own "Clean audio" control is a
// StreamActionLog whose button carries no aria-label, so the table's
// `clean audio <slug>` button is still the only match for that name; the log's
// `aria-label="Clean audio <slug> error"` differs from this table's only by
// case, and neither is asserted anywhere.
export function ChannelWorkTable({
  sections,
  summary,
}: {
  sections: SectionConfig[];
  summary: ActionableSummary;
}) {
  return (
    <>
      {sections.map((config) => (
        <Section key={config.id} config={config} rows={config.getRows(summary)} />
      ))}
    </>
  );
}

function Section({
  config,
  rows,
}: {
  config: SectionConfig;
  rows: ActionableRow[];
}) {
  // The functions stay HERE, on the server: each row's count, extra figure and
  // actions are computed now and cross to the shared (client) table as a
  // number, a string and an element.
  const rowExtras: Record<string, ChannelRowExtras> = {};
  for (const row of rows) {
    rowExtras[row.channel.slug] = {
      count: config.getCount(row),
      extra: config.extraColumn?.getValue(row),
      actions: (
        <span className="inline-flex items-center gap-3 flex-wrap">
          {config.primaryAction(row)}
          <InlineActionButton
            variant={{ kind: "refreshReport", slug: row.channel.slug }}
          />
        </span>
      ),
    };
  }
  const columns = config.extraColumn
    ? WORK_COLUMNS
    : WORK_COLUMNS.filter((id) => id !== "extra");
  return (
    <section
      aria-label={config.id}
      className="flex flex-col gap-2"
    >
      <div className="flex items-center justify-between flex-wrap gap-2">
        <h2 className="text-lg font-semibold">{config.title}</h2>
        {config.headerAction}
      </div>
      <p className="text-sm text-muted-foreground">{config.description}</p>
      {rows.length === 0 ? (
        <p
          aria-label={`${config.id} empty`}
          className="text-sm text-muted-foreground border border-dashed border-border rounded p-4"
        >
          {config.emptyLabel}
        </p>
      ) : (
        <ChannelsTable
          rows={rows.map(workRowOf)}
          columns={columns}
          rowLabelPrefix={config.id}
          rowExtras={rowExtras}
          labels={{
            count: config.countLabel,
            extra: config.extraColumn?.label,
            report: "Last report",
          }}
          sort={false}
          selection={false}
        />
      )}
    </section>
  );
}

// The shared row, for a table that draws no bands, no tier, no media badge and
// no Location column: those inputs are neutral rather than read. The report
// state is the builder's `reportStateOf` (common/views/channelRow.ts, moved
// there from loadActionable), which this table used to carry a copy of.
function workRowOf(row: ActionableRow): ChannelRowView {
  return buildChannelRowView({
    slug: row.channel.slug,
    config: row.channel.config,
    snapshot: row.snapshot,
    playlistCount: null,
    bands: [],
    priority: neutralChannelPriority(),
    media: null,
    volume: { id: "", label: "" },
  });
}