import { expect, test } from "@playwright/test";
import {
  CANVAS_ARRANGE_COMPONENT_GAP,
  CANVAS_ARRANGE_NODE_GAP,
  CANVAS_ARRANGE_SNAP_GRID_SIZE,
  applyCanvasArrangeUpdates,
  arrangeCanvasNodes,
  getArrangeCanvasViewport,
} from "@/lib/canvas/arrange";

const nodes = [
  { height: 350, id: "source", width: 350, x: 13, y: 17 },
  { height: 350, id: "target", width: 350, x: 20, y: 500 },
  { height: 350, id: "isolated", width: 350, x: 2000, y: 1000 },
];

test.describe("video canvas arrange", () => {
  test("uses the competitor's ELK spacing, rightward layering, and twelve-unit grid", async () => {
    expect(CANVAS_ARRANGE_NODE_GAP).toBe(100);
    expect(CANVAS_ARRANGE_COMPONENT_GAP).toBe(150);
    expect(CANVAS_ARRANGE_SNAP_GRID_SIZE).toBe(12);

    await expect(
      arrangeCanvasNodes(nodes, [{ source: "source", target: "target" }])
    ).resolves.toEqual([
      { id: "source", position: { x: 12, y: 12 } },
      { id: "target", position: { x: 564, y: 12 } },
      { id: "isolated", position: { x: 1068, y: 12 } },
    ]);
  });

  test("deduplicates repeated root edges before laying out a connected component", async () => {
    const singleEdgeResult = await arrangeCanvasNodes(nodes, [
      { source: "source", target: "target" },
    ]);
    const duplicateEdgeResult = await arrangeCanvasNodes(nodes, [
      { source: "source", target: "target" },
      { source: "source", target: "target" },
    ]);

    expect(duplicateEdgeResult).toEqual(singleEdgeResult);
  });

  test("does not create a confirmation update for zero or one root node", async () => {
    await expect(arrangeCanvasNodes([], [])).resolves.toEqual([]);
    await expect(arrangeCanvasNodes([nodes[0]], [])).resolves.toEqual([]);
  });

  test("applies only changed positions and preserves the rest of each node", () => {
    expect(
      applyCanvasArrangeUpdates(
        nodes.map((node) => ({ ...node, title: node.id })),
        [{ id: "target", position: { x: 564, y: 12 } }]
      )
    ).toEqual([
      { ...nodes[0], title: "source" },
      { ...nodes[1], title: "target", x: 564, y: 12 },
      { ...nodes[2], title: "isolated" },
    ]);
  });

  test("fits arranged bounds from a fixed 48-pixel origin with twelve-percent padding", () => {
    expect(
      getArrangeCanvasViewport({
        canvasHeight: 805,
        canvasWidth: 1512,
        maxZoom: 8,
        minZoom: 0.1,
        nodes,
      })
    ).toEqual({
      x: 40.987996999249816,
      y: 38.8304576144036,
      zoom: 0.5393848462115529,
    });
  });
});