import assert from "node:assert/strict";
import { test } from "node:test";
import { renderGpuGraph, renderInflight, svgDataUrl } from "../src/lib/render";

test("svgDataUrl wraps an SVG as a base64 data URL", () => {
  const url = svgDataUrl("<svg></svg>");
  assert.match(url, /^data:image\/svg\+xml;base64,/);
});

test("renderInflight: ready + count renders IDLE in green", () => {
  const svg = renderInflight({ modelName: "Qwen3.8-27B-NVFP4", state: "ready", count: 0, offline: false });
  assert.match(svg, /IDLE/);
  assert.match(svg, /#1e6b34/);
  assert.doesNotMatch(svg, /ACTIVE/);
});

test("renderInflight: ready + count>0 renders the count number on red", () => {
  const svg = renderInflight({ modelName: "Qwen3.8-27B-NVFP4", state: "ready", count: 2, offline: false });
  assert.match(svg, /2/);
  assert.match(svg, /#8b2626/);
  assert.doesNotMatch(svg, /ACTIVE/);
  assert.doesNotMatch(svg, /IDLE/);
});

test("renderInflight: idle state does not show a count number", () => {
  const svg = renderInflight({ modelName: "A", state: "ready", count: 0, offline: false });
  assert.match(svg, /IDLE/);
  assert.doesNotMatch(svg, /font-size="24"/);
});

test("renderInflight: draws a count-trend spark when history has 2+ samples", () => {
  const svg = renderInflight({ modelName: "A", state: "ready", count: 1, offline: false, history: [0, 1, 2, 1] });
  assert.match(svg, /<polyline/);
  assert.match(svg, /<path/);
});

test("renderInflight: no spark with fewer than 2 history samples", () => {
  const svg = renderInflight({ modelName: "A", state: "ready", count: 1, offline: false, history: [1] });
  assert.doesNotMatch(svg, /<polyline/);
  const none = renderInflight({ modelName: "A", state: "ready", count: 1, offline: false });
  assert.doesNotMatch(none, /<polyline/);
});

test("renderInflight: active count is static white (no blink opacity)", () => {
  const svg = renderInflight({ modelName: "A", state: "ready", count: 1, offline: false });
  assert.match(svg, />1</);
  assert.doesNotMatch(svg, /opacity="0.55"/);
});

test("renderInflight: offline and no-model states", () => {
  const offline = renderInflight({ modelName: "A", state: "ready", count: 0, offline: true });
  assert.match(offline, /OFFLINE/);
  const noModel = renderInflight({ modelName: "unset", state: undefined, count: 0, offline: false });
  assert.match(noModel, /NO MODEL/);
});

test("renderInflight: loading renders LOADING in amber", () => {
  const svg = renderInflight({ modelName: "A", state: "loading", count: 0, offline: false });
  assert.match(svg, /LOADING/);
  assert.match(svg, /#8a6d1d/);
});

test("renderGpuGraph: draws a polyline, value, and metric label", () => {
  const svg = renderGpuGraph({
    gpuName: "GPU 2 · RTX 5090",
    metric: "util_percent",
    value: 67,
    history: [0, 20, 40, 67],
    offline: false,
  });
  assert.match(svg, /<polyline/);
  assert.match(svg, /67%/);
  assert.match(svg, /UTIL/);
  assert.match(svg, /GPU 2/);
});

test("renderGpuGraph: power draws a watts value", () => {
  const svg = renderGpuGraph({
    gpuName: "ALL GPUS",
    metric: "power",
    value: 1030,
    history: [900, 1000, 1030],
    offline: false,
  });
  assert.match(svg, /1030W/);
  assert.match(svg, /PWR/);
  assert.match(svg, /ALL GPUS/);
});

test("renderGpuGraph: offline frame", () => {
  const svg = renderGpuGraph({ gpuName: "ALL GPUS", metric: "util_percent", value: undefined, history: [], offline: true });
  assert.match(svg, /OFFLINE/);
});

test("renderGpuGraph: single-point history avoids divide-by-zero", () => {
  const svg = renderGpuGraph({ gpuName: "ALL GPUS", metric: "util_percent", value: 50, history: [50], offline: false });
  assert.match(svg, /<svg/);
});