import { readFileSync } from "node:fs";
import { resolve } from "node:path";
import { expect, test } from "@playwright/test";
import {
  createCanvasTemplateReplaceSlots,
  MAX_CANVAS_TEMPLATE_REPLACE_SOURCES,
  replaceCanvasTemplateSourceSlot,
  type CanvasTemplateReplaceSource,
} from "@/lib/canvas/template-replace-batch";

function readSource(path: string) {
  return readFileSync(resolve(process.cwd(), path), "utf8");
}

function source(id: string): CanvasTemplateReplaceSource {
  return {
    id,
    imageUrl: `https://example.com/${id}.png`,
    title: id,
    origin: "canvas",
    sourceNodeId: id,
  };
}

test.describe("canvas template replacement entry", () => {
  test("keeps the selected-image toolbar action wired to the in-canvas batch dialog", () => {
    const imageNode = readSource("components/canvas/nodes/ImageNode.tsx");
    const workspace = readSource("components/canvas/CanvasWorkspace.tsx");
    const dialog = readSource("components/canvas/CanvasTemplateReplaceDialog.tsx");

    expect(imageNode).toContain(
      'getCanvasToolbarItem(\n    canvasToolbarConfig,\n    "imageTemplateReplace"'
    );
    expect(imageNode).toContain('isSelectedImageActionInline("templateReplace")');
    expect(imageNode).toContain('isSelectedImageActionInMore("templateReplace")');
    expect(imageNode).toContain('handleAction("template-replace")');
    expect(imageNode).toContain("<CanvasTemplateReplaceDialog");
    expect(imageNode).not.toContain("/psd-template?launch=");
    expect(imageNode).not.toContain("/api/psd-templates?summary=1");
    expect(workspace).toContain(
      'requestImageNodeAction(selectedImageNodes[0].id, "template-replace")'
    );

    expect(dialog).toContain("MAX_CANVAS_TEMPLATE_REPLACE_SOURCES");
    expect(dialog).toContain("imageGenerationService.layoutReplace");
    expect(dialog).toContain("for (const resultId of orderedIds)");
    expect(dialog).toContain('return "等待上一张"');
    expect(dialog).toContain("排队中（前方");
    expect(dialog).toContain("全部添加到画布");
    expect(dialog).toContain("canvas-template-replace:");
    expect(dialog).toContain("max-h-[calc(100dvh-1rem)]");
    expect(dialog).toContain("min-h-0 flex-1 overflow-y-auto");
    expect(dialog).toContain("shrink-0 gap-2 border-t");
    expect(dialog).not.toContain("PSD");
  });

  test("keeps five fixed slots and deduplicates a source moved between slots", () => {
    const slots = createCanvasTemplateReplaceSlots([
      source("a"),
      source("b"),
      source("c"),
      source("d"),
      source("e"),
      source("f"),
    ]);
    expect(slots).toHaveLength(MAX_CANVAS_TEMPLATE_REPLACE_SOURCES);
    expect(slots.map((item) => item?.id)).toEqual(["a", "b", "c", "d", "e"]);

    const moved = replaceCanvasTemplateSourceSlot(slots, 4, source("a"));
    expect(moved[0]).toBeNull();
    expect(moved[4]?.id).toBe("a");
  });
});