import assert from "node:assert/strict";
import { test } from "node:test";

import { inventoryKeys } from "@metis/assets/client";
import { catalogKeys, inventoryKeys as resourceKeys } from "@metis/resources/client";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { createInstance } from "i18next";
import type { ReactNode } from "react";
import { renderToStaticMarkup } from "react-dom/server";
import { I18nextProvider } from "react-i18next";

import { companiesEnglish, companiesSpanish } from "../../shared";
import { profileKeys } from "../../work-profiles/shared/api";
import { CertificateConfigurationsPage } from "../list";

import { certificateKeys } from "./api";
import { CertificateConfigurationForm } from "./ui";

const company = {
  id: "0199b200-0000-7000-8000-000000000001",
  name: "Empresa test",
  active: true,
  people: [],
  contacts: [],
  sites: [],
  departments: [],
  assignments: [],
};

async function render(language: string, node: ReactNode) {
  const i18n = createInstance();

  await i18n.init({
    lng: language,
    resources: { es: { companies: companiesSpanish }, en: { companies: companiesEnglish } },
  });
  const client = new QueryClient({
    defaultOptions: { queries: { retry: false, staleTime: Number.POSITIVE_INFINITY } },
  });

  client.setQueryData(profileKeys.company(company.id), { profiles: [] });
  client.setQueryData(inventoryKeys.company(company.id), {
    assets: [],
    relationships: [],
    workstations: [],
  });
  client.setQueryData(resourceKeys.company(company.id), { resources: [] });
  client.setQueryData(catalogKeys.scope(company.id), { items: [] });
  client.setQueryData(certificateKeys.company(company.id), { configurations: [] });
  try {
    return renderToStaticMarkup(
      <I18nextProvider i18n={i18n}>
        <QueryClientProvider client={client}>{node}</QueryClientProvider>
      </I18nextProvider>
    );
  } finally {
    client.clear();
  }
}

test("certificados: listado sin formularios, alta en cabecera y traducciones", async () => {
  for (const [language, title, action] of [
    ["es", "Certificados del perfil", "Configurar certificado"],
    ["en", "Profile certificates", "Configure certificate"],
  ]) {
    const html = await render(
      language ?? "es",
      <CertificateConfigurationsPage company={company} />
    );

    assert.ok(html.includes(title ?? ""));
    assert.ok(html.includes(action ?? ""));
    assert.ok(!html.includes("<form"));
    const headers = html.match(/<thead\b[^>]*>[\s\S]*?<\/thead>/)?.[0] ?? "";

    assert.ok(headers.includes(language === "es" ? "Revisión" : "Review"));
    assert.equal(
      headers.includes(
        language === "es" ? companiesSpanish.profiles.review : companiesEnglish.profiles.review
      ),
      false
    );
    assert.ok(!html.includes("certificates.help"));
  }
});
test("certificados: selectores con alta rápida y ayuda inferior antes de guardar", async () => {
  for (const language of ["es", "en"]) {
    const html = await render(
      language,
      <CertificateConfigurationForm company={company} onSaved={() => undefined} />
    );
    const text = language === "es" ? companiesSpanish : companiesEnglish;

    assert.ok(html.includes(text.certificates.resource));
    assert.ok(html.includes(text.certificates.location));
    assert.ok(html.includes(text.certificates.newResource));
    assert.ok(html.indexOf(text.certificates.help) > html.indexOf(text.certificates.location));
    assert.ok(html.indexOf(text.save) > html.indexOf(text.certificates.help));
    assert.ok(!html.includes("certificates.help"));
  }
});