import assert from "node:assert/strict";
import test from "node:test";
import { renderToStaticMarkup } from "react-dom/server";
import { AppLanguageProvider } from "@/components/providers/app-language-provider";
import { FilterPanelGrouped } from "@/components/ui/filter-panel";
import { ChartExportMenuButton } from "@/components/ui/chart-export-menu-button";
import {
  DashboardLabelsProvider,
  useDashboardTranslations,
} from "./dashboard-translation-provider";
import { resolveDashboardLabels } from "./dashboard-translations";
import { CdcGpsfDashboardHeader } from "./components/cdc-gpsf-dashboard-header";
import { CdcGpsfDashboardSummaryCards } from "./components/cdc-gpsf-dashboard-summary-cards";

function Filter() {
  const text = useDashboardTranslations();
  return <FilterPanelGrouped fields={[]} onChange={() => {}} labels={text} />;
}
test("shared header, cards, filter and chart export render owning-owner labels without a foreign translation query", () => {
  for (const owner of ["PSWG", "Ministry", "CDC", "CEFP", "CDC-GPSF"]) {
    for (const language of ["en", "kh"]) {
      const text = resolveDashboardLabels(language, {
        page_title: owner + " heading",
        total_primary_agencies: owner + " agencies",
        filter: owner + " filter",
        export_chart: owner + " chart export",
      });
      // No QueryClientProvider: any accidental issue_matrix/WG query throws.
      const html = renderToStaticMarkup(
        <AppLanguageProvider>
          <DashboardLabelsProvider text={text}>
            <CdcGpsfDashboardHeader actions={<span />} />
            <CdcGpsfDashboardSummaryCards />
            <Filter />
            <ChartExportMenuButton />
          </DashboardLabelsProvider>
        </AppLanguageProvider>,
      );
      for (const label of ["heading", "agencies", "filter", "chart export"]) {
        assert.ok(html.includes(owner + " " + label), owner + "/" + label);
      }
    }
  }
});