kandev/apps/web/lib/state/dockview-panel-actions.test.ts

import { describe, it, expect, beforeEach } from "vitest";
import type { DockviewApi, AddPanelOptions } from "dockview-react";
import { buildPanelActions } from "./dockview-panel-actions";
import { CENTER_GROUP } from "./layout-manager";

// ---------------------------------------------------------------------------
// Minimal DockviewApi mock
// ---------------------------------------------------------------------------

type MockPanel = {
  id: string;
  title: string;
  params: Record<string, unknown>;
  group: { id: string };
  isActive: boolean;
  api: {
    setActive: () => void;
    updateParameters: (p: Record<string, unknown>) => void;
  };
  setTitle: (t: string) => void;
};

function makeApi(options: { centerGroupId?: string } = {}): DockviewApi {
  const centerId = options.centerGroupId ?? CENTER_GROUP;
  const panels: MockPanel[] = [];
  const groups = [{ id: centerId }];

  function makePanel(add: AddPanelOptions & { id: string }): MockPanel {
    const groupId =
      (add.position as { referenceGroup?: string } | undefined)?.referenceGroup ?? centerId;
    if (!groups.some((g) => g.id === groupId)) groups.push({ id: groupId });
    const panel: MockPanel = {
      id: add.id,
      title: (add.title as string) ?? "",
      params: { ...(add.params ?? {}) },
      group: { id: groupId },
      isActive: false,
      setTitle(t: string) {
        this.title = t;
      },
      api: {
        setActive() {
          for (const p of panels) p.isActive = false;
          panel.isActive = true;
        },
        updateParameters(p: Record<string, unknown>) {
          Object.assign(panel.params, p);
        },
      },
    };
    return panel;
  }

  const api = {
    get groups() {
      return groups;
    },
    get panels() {
      return panels;
    },
    getPanel(id: string) {
      return panels.find((p) => p.id === id);
    },
    addPanel(opts: AddPanelOptions & { id: string }) {
      const p = makePanel(opts);
      panels.push(p);
      if (!opts.inactive) p.api.setActive();
      return p;
    },
    removePanel(panel: { id: string }) {
      const i = panels.findIndex((p) => p.id === panel.id);
      if (i >= 0) panels.splice(i, 1);
    },
    get activePanel() {
      return panels.find((p) => p.isActive);
    },
  } as unknown as DockviewApi;
  return api;
}

// ---------------------------------------------------------------------------
// Store adapter: panel actions take (set, get) closures
// ---------------------------------------------------------------------------

type StoreShape = {
  api: DockviewApi | null;
  centerGroupId: string;
  rightTopGroupId: string;
  rightBottomGroupId: string;
  selectedDiff: { path: string; content?: string } | null;
};

function makeStore(api: DockviewApi) {
  const state: StoreShape = {
    api,
    centerGroupId: CENTER_GROUP,
    rightTopGroupId: "group-right-top",
    rightBottomGroupId: "group-right-bottom",
    selectedDiff: null,
  };
  return {
    get: () => state,
    set: (partial: Partial<StoreShape>) => Object.assign(state, partial),
    state,
  };
}

function build(api: DockviewApi) {
  const store = makeStore(api);
  const actions = buildPanelActions(store.set, store.get);
  return { api, actions, store };
}

// ---------------------------------------------------------------------------
// Test fixtures
// ---------------------------------------------------------------------------

const PATH_A = "src/a.ts";
const PATH_B = "src/b.ts";
const PATH_NESTED_B = "src/nested/b.ts";
const NAME_A = "a.ts";
const NAME_B = "b.ts";
const PINNED_FILE_A_ID = "file:src/a.ts";
const PREVIEW_FILE_ID = "preview:file-editor";
const PREVIEW_DIFF_ID = "preview:file-diff";
const PREVIEW_COMMIT_ID = "preview:commit-detail";
const SHA_A = "abcdef1234567890";
const SHA_B = "fedcba0987654321";
const DIFF_FILE_PREFIX = "diff:file:";
const FILE_PREFIX_ID = "file:";
const COMMIT_PREFIX_ID = "commit:";
const TYPE_FILE_EDITOR = "file-editor" as const;

// ---------------------------------------------------------------------------
// Tests
// ---------------------------------------------------------------------------

describe("addFileEditorPanel — preview behavior", () => {
  let api: DockviewApi;
  let actions: ReturnType<typeof buildPanelActions>;
  beforeEach(() => {
    ({ api, actions } = build(makeApi()));
  });

  it("first open creates a preview panel with the stable preview id", () => {
    actions.addFileEditorPanel(PATH_A, NAME_A);

    expect(api.getPanel(PREVIEW_FILE_ID)).toBeDefined();
    expect(api.getPanel(PINNED_FILE_A_ID)).toBeUndefined();
    const preview = api.getPanel(PREVIEW_FILE_ID) as unknown as MockPanel;
    expect(preview.title).toBe(NAME_A);
    expect(preview.params.path).toBe(PATH_A);
  });

  it("second open (different file) replaces the preview in place", () => {
    actions.addFileEditorPanel(PATH_A, NAME_A);
    actions.addFileEditorPanel(PATH_B, NAME_B);

    // Still exactly one file panel (preview), now showing b
    const filePanels = api.panels.filter(
      (p) => p.id === PREVIEW_FILE_ID || p.id.startsWith(FILE_PREFIX_ID),
    );
    expect(filePanels).toHaveLength(1);

    const preview = api.getPanel(PREVIEW_FILE_ID) as unknown as MockPanel;
    expect(preview.title).toBe(NAME_B);
    expect(preview.params.path).toBe(PATH_B);
  });

  it("focuses the pinned panel instead of touching preview when pinned exists", () => {
    actions.addFileEditorPanel(PATH_A, NAME_A, { pin: true });
    actions.addFileEditorPanel(PATH_B, NAME_B); // preview for b
    expect(api.getPanel(PINNED_FILE_A_ID)).toBeDefined();
    expect(api.getPanel(PREVIEW_FILE_ID)).toBeDefined();

    // Re-open a: should activate the pinned panel and leave preview alone
    actions.addFileEditorPanel(PATH_A, NAME_A);

    const pinned = api.getPanel(PINNED_FILE_A_ID) as unknown as MockPanel;
    const preview = api.getPanel(PREVIEW_FILE_ID) as unknown as MockPanel;
    expect(pinned.isActive).toBe(true);
    expect(preview.title).toBe(NAME_B); // unchanged
    expect(preview.params.path).toBe(PATH_B); // unchanged
  });

  it("opens directly pinned when pin option is true", () => {
    actions.addFileEditorPanel(PATH_A, NAME_A, { pin: true });

    expect(api.getPanel(PINNED_FILE_A_ID)).toBeDefined();
    expect(api.getPanel(PREVIEW_FILE_ID)).toBeUndefined();
  });

  it("promotePreviewToPinned sets promoted flag without swapping panels", () => {
    actions.addFileEditorPanel(PATH_A, NAME_A);
    actions.promotePreviewToPinned(TYPE_FILE_EDITOR);

    // Preview panel still exists with promoted flag
    const preview = api.getPanel(PREVIEW_FILE_ID) as unknown as MockPanel;
    expect(preview).toBeDefined();
    expect(preview.params.promoted).toBe(true);
    expect(preview.title).toBe(NAME_A);
    // No pinned panel created yet
    expect(api.getPanel(PINNED_FILE_A_ID)).toBeUndefined();
  });

  it("opening a new file materializes the promoted preview as a pinned panel", () => {
    actions.addFileEditorPanel(PATH_A, NAME_A);
    actions.promotePreviewToPinned(TYPE_FILE_EDITOR);
    actions.addFileEditorPanel(PATH_B, NAME_B);

    // Promoted file A was materialized as pinned
    expect(api.getPanel(PINNED_FILE_A_ID)).toBeDefined();
    const pinned = api.getPanel(PINNED_FILE_A_ID) as unknown as MockPanel;
    expect(pinned.params.path).toBe(PATH_A);
    expect(pinned.params.promoted).toBeUndefined();
    expect(pinned.params.previewItemId).toBeUndefined();
    // Preview now shows file B
    const preview = api.getPanel(PREVIEW_FILE_ID) as unknown as MockPanel;
    expect(preview.params.path).toBe(PATH_B);
    expect(preview.params.promoted).toBeUndefined();
  });

  it("re-opening the same promoted preview just focuses without materializing", () => {
    actions.addFileEditorPanel(PATH_A, NAME_A);
    actions.promotePreviewToPinned(TYPE_FILE_EDITOR);
    actions.addFileEditorPanel(PATH_A, NAME_A);

    // No pinned panel created — same item, no materialization
    expect(api.getPanel(PINNED_FILE_A_ID)).toBeUndefined();
    const preview = api.getPanel(PREVIEW_FILE_ID) as unknown as MockPanel;
    expect(preview.params.promoted).toBe(true);
    expect(preview.isActive).toBe(true);
  });

  it("promotePreviewToPinned is a no-op when no preview exists", () => {
    actions.promotePreviewToPinned(TYPE_FILE_EDITOR);
    expect(api.panels).toHaveLength(0);
  });

  it("promotePreviewToPinned is a no-op when already promoted", () => {
    actions.addFileEditorPanel(PATH_A, NAME_A);
    actions.promotePreviewToPinned(TYPE_FILE_EDITOR);
    const preview = api.getPanel(PREVIEW_FILE_ID) as unknown as MockPanel;
    const paramsRef = preview.params;

    actions.promotePreviewToPinned(TYPE_FILE_EDITOR);
    // params reference unchanged (no second updateParameters call)
    expect(preview.params).toBe(paramsRef);
  });

  it("re-opening the same preview target just focuses without churning params", () => {
    actions.addFileEditorPanel(PATH_A, NAME_A);
    const preview = api.getPanel(PREVIEW_FILE_ID) as unknown as MockPanel;
    const originalParamsRef = preview.params;

    actions.addFileEditorPanel(PATH_A, NAME_A);

    // Same preview panel — updateParameters mutates params in-place (Object.assign),
    // so the reference is unchanged even after the call.
    expect(api.getPanel(PREVIEW_FILE_ID)).toBe(preview as unknown);
    expect(preview.params).toBe(originalParamsRef);
    expect(preview.isActive).toBe(true);
  });
});

describe("addFileDiffPanel — preview behavior", () => {
  let api: DockviewApi;
  let actions: ReturnType<typeof buildPanelActions>;
  beforeEach(() => {
    ({ api, actions } = build(makeApi()));
  });

  it("first open creates a preview diff panel with the stable preview id", () => {
    actions.addFileDiffPanel(PATH_A);

    expect(api.getPanel(PREVIEW_DIFF_ID)).toBeDefined();
    expect(api.getPanel(`${DIFF_FILE_PREFIX}${PATH_A}`)).toBeUndefined();
    const preview = api.getPanel(PREVIEW_DIFF_ID) as unknown as MockPanel;
    expect(preview.title).toBe("Diff [a.ts]");
    expect(preview.params.path).toBe(PATH_A);
    expect(preview.params.kind).toBe("file");
  });

  it("second diff open replaces the preview in place", () => {
    actions.addFileDiffPanel(PATH_A);
    actions.addFileDiffPanel(PATH_NESTED_B);

    const diffPanels = api.panels.filter(
      (p) => p.id === PREVIEW_DIFF_ID || p.id.startsWith(DIFF_FILE_PREFIX),
    );
    expect(diffPanels).toHaveLength(1);
    const preview = api.getPanel(PREVIEW_DIFF_ID) as unknown as MockPanel;
    expect(preview.title).toBe("Diff [b.ts]");
    expect(preview.params.path).toBe(PATH_NESTED_B);
  });

  it("focuses pinned diff when present instead of touching preview", () => {
    actions.addFileDiffPanel(PATH_A, { pin: true });
    actions.addFileDiffPanel(PATH_B); // preview
    actions.addFileDiffPanel(PATH_A);

    const pinned = api.getPanel(`${DIFF_FILE_PREFIX}${PATH_A}`) as unknown as MockPanel;
    const preview = api.getPanel(PREVIEW_DIFF_ID) as unknown as MockPanel;
    expect(pinned.isActive).toBe(true);
    expect(preview.params.path).toBe(PATH_B);
  });

  it("promotePreviewToPinned sets promoted flag on the preview diff", () => {
    actions.addFileDiffPanel(PATH_A);
    actions.promotePreviewToPinned("file-diff");

    const preview = api.getPanel(PREVIEW_DIFF_ID) as unknown as MockPanel;
    expect(preview).toBeDefined();
    expect(preview.params.promoted).toBe(true);
    expect(api.getPanel(`${DIFF_FILE_PREFIX}${PATH_A}`)).toBeUndefined();
  });

  it("opening a new diff materializes the promoted diff as a pinned panel", () => {
    actions.addFileDiffPanel(PATH_A);
    actions.promotePreviewToPinned("file-diff");
    actions.addFileDiffPanel(PATH_B);

    expect(api.getPanel(`${DIFF_FILE_PREFIX}${PATH_A}`)).toBeDefined();
    const preview = api.getPanel(PREVIEW_DIFF_ID) as unknown as MockPanel;
    expect(preview.params.path).toBe(PATH_B);
    expect(preview.params.promoted).toBeUndefined();
  });
});

describe("addCommitDetailPanel — preview behavior", () => {
  let api: DockviewApi;
  let actions: ReturnType<typeof buildPanelActions>;
  beforeEach(() => {
    ({ api, actions } = build(makeApi()));
  });

  it("first open creates a preview commit panel with the stable preview id", () => {
    actions.addCommitDetailPanel(SHA_A);

    expect(api.getPanel(PREVIEW_COMMIT_ID)).toBeDefined();
    expect(api.getPanel(`${COMMIT_PREFIX_ID}${SHA_A}`)).toBeUndefined();
    const preview = api.getPanel(PREVIEW_COMMIT_ID) as unknown as MockPanel;
    expect(preview.title).toBe("abcdef1");
    expect(preview.params.commitSha).toBe(SHA_A);
  });

  it("second commit open replaces the preview in place", () => {
    actions.addCommitDetailPanel(SHA_A);
    actions.addCommitDetailPanel(SHA_B);

    const commitPanels = api.panels.filter(
      (p) => p.id === PREVIEW_COMMIT_ID || p.id.startsWith(COMMIT_PREFIX_ID),
    );
    expect(commitPanels).toHaveLength(1);
    const preview = api.getPanel(PREVIEW_COMMIT_ID) as unknown as MockPanel;
    expect(preview.title).toBe("fedcba0");
    expect(preview.params.commitSha).toBe(SHA_B);
  });

  it("promotePreviewToPinned sets promoted flag on the preview commit", () => {
    actions.addCommitDetailPanel(SHA_A);
    actions.promotePreviewToPinned("commit-detail");

    const preview = api.getPanel(PREVIEW_COMMIT_ID) as unknown as MockPanel;
    expect(preview).toBeDefined();
    expect(preview.params.promoted).toBe(true);
    expect(api.getPanel(`${COMMIT_PREFIX_ID}${SHA_A}`)).toBeUndefined();
  });

  it("opening a new commit materializes the promoted commit as a pinned panel", () => {
    actions.addCommitDetailPanel(SHA_A);
    actions.promotePreviewToPinned("commit-detail");
    actions.addCommitDetailPanel(SHA_B);

    expect(api.getPanel(`${COMMIT_PREFIX_ID}${SHA_A}`)).toBeDefined();
    const preview = api.getPanel(PREVIEW_COMMIT_ID) as unknown as MockPanel;
    expect(preview.params.commitSha).toBe(SHA_B);
    expect(preview.params.promoted).toBeUndefined();
  });
});

describe("preview slots are independent across types", () => {
  it("file, diff, and commit previews coexist", () => {
    const { api, actions } = build(makeApi());

    actions.addFileEditorPanel(PATH_A, NAME_A);
    actions.addFileDiffPanel(PATH_B);
    actions.addCommitDetailPanel(SHA_A);

    expect(api.getPanel(PREVIEW_FILE_ID)).toBeDefined();
    expect(api.getPanel(PREVIEW_DIFF_ID)).toBeDefined();
    expect(api.getPanel(PREVIEW_COMMIT_ID)).toBeDefined();
  });
});