import { renderToString } from "react-dom/server";
import { describe, expect, test } from "vitest";
import { genericDashboardFixture } from "@dimensionlab/dashboard-model/fixtures";
import { AppStateView, resolveDocumentMetadata } from "./App";

describe("home page model renderer", () => {
  test("renders the active dashboard model from the runtime state", () => {
    const body = renderToString(
      <AppStateView
        dashboard={{
          state: "ready",
          document: genericDashboardFixture,
          schemaVersion: "dashboard.v1",
          currentRevisionId: "revision-1234567890",
        }}
      />,
    );

    expect(body).toContain("Operations Console");
    expect(body).toContain("Service Uptime");
    expect(body).toContain("Identity");
    expect(body).toContain("data-model-id=\"service-uptime\"");
    expect(body).not.toContain("primary");
    expect(body).not.toContain("secondary");
  });

  test("renders invalid model state without crashing", () => {
    const body = renderToString(
      <AppStateView
        dashboard={{
          state: "invalid",
          title: "Invalid Dashboard",
          subtitle: "Validation failed",
          message: "Dashboard document is invalid.",
          errors: ["/metadata/title is required"],
        }}
      />,
    );

    expect(body).toContain("Invalid Dashboard");
    expect(body).toContain("Validation failed");
    expect(body).toContain("Dashboard document is invalid.");
    expect(body).toContain("/metadata/title is required");
  });

  test("derives browser metadata from ready and fallback runtime states", () => {
    const ready = resolveDocumentMetadata({
      state: "ready",
      document: genericDashboardFixture,
      schemaVersion: "dashboard.v1",
      currentRevisionId: "revision-1234567890",
    });
    const empty = resolveDocumentMetadata({
      state: "empty",
      title: "No Dashboard Model",
      subtitle: "No active document",
      message: "No validated dashboard document is active yet.",
    });

    expect(ready).toEqual({
      title: "Operations Console",
      description: "Generic environment",
    });
    expect(empty).toEqual({
      title: "No Dashboard Model",
      description: "No active document",
    });
  });

  test("renders empty and loading model states without crashing", () => {
    const empty = renderToString(
      <AppStateView
        dashboard={{
          state: "empty",
          title: "No Dashboard Model",
          subtitle: "No active document",
          message: "No validated dashboard document is active yet.",
        }}
      />,
    );
    const loading = renderToString(
      <AppStateView
        dashboard={{
          state: "loading",
          title: "Loading Dashboard",
          subtitle: "Fetching active model",
          message: "Waiting for the active dashboard document.",
        }}
      />,
    );

    expect(empty).toContain("No Dashboard Model");
    expect(empty).toContain("No active document");
    expect(loading).toContain("Loading Dashboard");
    expect(loading).toContain("Fetching active model");
  });
});