import { beforeEach, describe, expect, it, vi } from "vitest"; import { act, renderHook } from "@testing-library/react"; import { computeDialogDefaultStepId } from "./task-create-dialog-defaults"; import type { WorkflowSnapshotData } from "@/lib/state/slices/kanban/types"; import { useDialogFormState } from "./task-create-dialog-state"; import { buildRepositoriesPayload } from "./task-create-dialog-helpers"; // `useBranchesByURL` triggers a real network ensure() when given a URL — stub // it so the dialog state hook can mount in JSDOM without hitting fetch. The // stubbed shape mirrors the production hook (branches/loading/ensure). vi.mock("@/hooks/domains/github/use-branches-by-url", () => ({ useBranchesByURL: () => ({ branches: () => [], loading: () => false, ensure: () => undefined, }), })); // `usePRInfoByURL` also touches the network on ensure(); stub it to a // per-test-controlled cache so the title-autofill effect can be exercised // without an actual fetch. Each test that needs a specific PR-info value // writes into `prInfoMap` before calling `setUseRemote(true)`. const prInfoMap = new Map< string, { prHeadBranch: string; prBaseBranch: string; prNumber: number; suggestedTitle: string } >(); vi.mock("@/hooks/domains/github/use-pr-info-by-url", async (importOriginal) => { const original = await importOriginal(); return { ...original, usePRInfoByURL: () => ({ info: (url: string) => prInfoMap.get(url), loading: () => false, ensure: () => undefined, clear: () => undefined, }), }; }); function snapshot(workflowId: string): WorkflowSnapshotData { return { workflowId, workflowName: workflowId, steps: [ { id: `${workflowId}-later`, title: "Later", color: "gray", position: 2, }, { id: `${workflowId}-start`, title: "Start", color: "green", position: 1, is_start_step: true, }, ], tasks: [], }; } describe("computeDialogDefaultStepId", () => { it("uses the resolved workflow when falling back to snapshot steps", () => { expect( computeDialogDefaultStepId({ selectedWorkflowId: null, workflowId: "provided", fetchedSteps: null, defaultStepId: null, effectiveWorkflowId: "provided", snapshots: { provided: snapshot("provided"), single: snapshot("single"), }, }), ).toBe("provided-start"); }); it("falls back to the lowest-position snapshot step when no start step exists", () => { expect( computeDialogDefaultStepId({ selectedWorkflowId: null, workflowId: "provided", fetchedSteps: null, defaultStepId: null, effectiveWorkflowId: "provided", snapshots: { provided: { workflowId: "provided", workflowName: "provided", steps: [ { id: "provided-2", title: "Two", color: "gray", position: 2 }, { id: "provided-1", title: "One", color: "green", position: 1 }, ], tasks: [], }, }, }), ).toBe("provided-1"); }); it("ignores a stale default step while a newly selected workflow loads", () => { expect( computeDialogDefaultStepId({ selectedWorkflowId: "selected", workflowId: "original", fetchedSteps: null, defaultStepId: "original-start", effectiveWorkflowId: "selected", snapshots: { original: snapshot("original"), selected: snapshot("selected"), }, }), ).toBe("selected-start"); }); }); describe("useDialogFormState — remoteRepos mode", () => { it("seeds one empty remoteRepos row when useRemote toggles on with an empty list", () => { const { result } = renderHook(() => useDialogFormState(true, "ws-1", null)); expect(result.current.remoteRepos).toHaveLength(0); act(() => { result.current.setUseRemote(true); }); expect(result.current.remoteRepos).toHaveLength(1); expect(result.current.remoteRepos[0]).toMatchObject({ url: "", branch: "", source: "paste" }); }); it("preserves the remoteRepos array when switching Remote → Repo → Remote", () => { const PASTED_URL = "github.com/owner/repo"; const { result } = renderHook(() => useDialogFormState(true, "ws-1", null)); // Enter Remote mode, fill in a URL. act(() => { result.current.setUseRemote(true); }); const seededKey = result.current.remoteRepos[0]?.key; act(() => { result.current.updateRemoteRepo(seededKey!, { url: PASTED_URL }); }); expect(result.current.remoteRepos[0]?.url).toBe(PASTED_URL); // Switch back to Repo mode (Remote off). The array must NOT be cleared. act(() => { result.current.setUseRemote(false); }); expect(result.current.remoteRepos[0]?.url).toBe(PASTED_URL); // Flip back to Remote mode — the prior rows are still there. act(() => { result.current.setUseRemote(true); }); expect(result.current.remoteRepos).toHaveLength(1); expect(result.current.remoteRepos[0]?.url).toBe(PASTED_URL); }); it("seeds remoteRepos from initialValues.githubUrl and sets useRemote=true on dialog open", () => { const initialValues = { title: "", githubUrl: "github.com/acme/site", branch: "main", }; const { result, rerender } = renderHook( ({ open }: { open: boolean }) => useDialogFormState(open, "ws-1", null, initialValues), { initialProps: { open: false } }, ); // Rising edge: dialog opens with a pre-filled URL. rerender({ open: true }); expect(result.current.useRemote).toBe(true); expect(result.current.remoteRepos).toHaveLength(1); expect(result.current.remoteRepos[0]).toMatchObject({ url: "github.com/acme/site", branch: "main", source: "paste", }); }); }); describe("useDialogFormState — remoteRepos key allocation", () => { // Regression: the per-hook counter starts at 0 and increments locally, so // a hydrated state that already contains `remote-1` (e.g. from the seed // effect or initialValues) would collide on the next addRemoteRepo() — // the new row would also be named `remote-1`, breaking React keys. it("addRemoteRepo skips keys already present in the rows array", () => { const { result } = renderHook(() => useDialogFormState(true, "ws-1", null)); // Flip into Remote mode so the seed effect injects `remote-0`. act(() => { result.current.setUseRemote(true); }); expect(result.current.remoteRepos).toHaveLength(1); expect(result.current.remoteRepos[0]?.key).toBe("remote-0"); // Manually hydrate with a row whose key matches what the local counter // is about to hand out (remote-1). act(() => { result.current.setRemoteRepos([ { key: "remote-1", url: "github.com/a/b", branch: "main", source: "paste" }, ]); }); act(() => { result.current.addRemoteRepo(); }); const keys = result.current.remoteRepos.map((r) => r.key); // No duplicates: hydrated `remote-1` still present, but the new row // skipped past it instead of colliding. expect(new Set(keys).size).toBe(keys.length); expect(result.current.remoteRepos).toHaveLength(2); expect(result.current.remoteRepos[0]?.key).toBe("remote-1"); expect(result.current.remoteRepos[1]?.key).not.toBe("remote-1"); }); }); describe("buildRepositoriesPayload — remoteRepos rows", () => { it("filters out rows with empty url before mapping to repos[]", () => { const payload = buildRepositoriesPayload({ useRemote: true, remoteRepos: [ { key: "remote-0", url: "github.com/owner/repo-a", branch: "main", source: "paste" }, { key: "remote-1", url: "", branch: "", source: "paste" }, { key: "remote-2", url: " ", branch: "", source: "paste" }, { key: "remote-3", url: "github.com/owner/repo-b", branch: "develop", source: "paste" }, ], repositories: [], discoveredRepositories: [], }); expect(payload).toHaveLength(2); expect(payload[0]).toMatchObject({ github_url: "github.com/owner/repo-a", }); expect(payload[1]).toMatchObject({ github_url: "github.com/owner/repo-b", base_branch: "develop", }); }); }); const PR_URL_42 = "https://github.com/acme/site/pull/42"; const PR_TITLE_42 = "PR #42: Test PR"; function seedPRInfo(url: string, prNumber: number, suggestedTitle: string) { prInfoMap.set(url, { prHeadBranch: "feature/x", prBaseBranch: "main", prNumber, suggestedTitle, }); } describe("useDialogFormState — title autofill from first row PR info", () => { beforeEach(() => { prInfoMap.clear(); }); it("seeds the task title from the first row's PR info when title is empty", () => { seedPRInfo(PR_URL_42, 42, PR_TITLE_42); const { result } = renderHook(() => useDialogFormState(true, "ws-1", null)); act(() => { result.current.setUseRemote(true); }); const key = result.current.remoteRepos[0]?.key; act(() => { result.current.updateRemoteRepo(key!, { url: PR_URL_42 }); }); expect(result.current.taskName).toBe(PR_TITLE_42); expect(result.current.hasTitle).toBe(true); }); it("does NOT overwrite a title the user typed themselves", () => { seedPRInfo(PR_URL_42, 42, PR_TITLE_42); const { result } = renderHook(() => useDialogFormState(true, "ws-1", null)); act(() => { result.current.setTaskName("my own title"); result.current.setUseRemote(true); }); const key = result.current.remoteRepos[0]?.key; act(() => { result.current.updateRemoteRepo(key!, { url: PR_URL_42 }); }); expect(result.current.taskName).toBe("my own title"); }); it("does NOT re-apply autofill after the user clears the title (user took ownership)", () => { // Regression: clearing an auto-filled title used to reset the ref to "" // and trigger a re-application on the next render, so the user could // never actually clear the field — every keystroke or render brought // the suggested title right back. seedPRInfo(PR_URL_42, 42, PR_TITLE_42); const { result } = renderHook(() => useDialogFormState(true, "ws-1", null)); act(() => { result.current.setUseRemote(true); }); const key = result.current.remoteRepos[0]?.key; act(() => { result.current.updateRemoteRepo(key!, { url: PR_URL_42 }); }); expect(result.current.taskName).toBe(PR_TITLE_42); act(() => { result.current.setTaskName(""); }); // Even after re-render, autofill MUST NOT reapply for this URL. expect(result.current.taskName).toBe(""); }); it("re-applies autofill when the user switches to a different PR URL", () => { // Once the user pastes a fresh PR URL, the previous "user-cleared" lock // for the earlier URL must lift — the fresh URL is a new autofill // opportunity. seedPRInfo(PR_URL_42, 42, PR_TITLE_42); const NEW_PR_URL = "https://github.com/acme/site/pull/99"; seedPRInfo(NEW_PR_URL, 99, "PR #99: Another PR"); const { result } = renderHook(() => useDialogFormState(true, "ws-1", null)); act(() => { result.current.setUseRemote(true); }); const key = result.current.remoteRepos[0]?.key; act(() => { result.current.updateRemoteRepo(key!, { url: PR_URL_42 }); }); expect(result.current.taskName).toBe(PR_TITLE_42); act(() => { result.current.setTaskName(""); }); expect(result.current.taskName).toBe(""); // Switch to a different PR URL → fresh autofill opportunity. act(() => { result.current.updateRemoteRepo(key!, { url: NEW_PR_URL }); }); expect(result.current.taskName).toBe("PR #99: Another PR"); }); it("does NOT autofill from a non-first row's PR info", () => { const SECOND_PR_URL = "https://github.com/acme/api/pull/99"; prInfoMap.set(SECOND_PR_URL, { prHeadBranch: "feature/y", prBaseBranch: "main", prNumber: 99, suggestedTitle: "PR #99: Second PR", }); const { result } = renderHook(() => useDialogFormState(true, "ws-1", null)); act(() => { result.current.setUseRemote(true); }); // Add a second row with a PR URL; row 0 stays empty. act(() => { result.current.addRemoteRepo(); }); const secondKey = result.current.remoteRepos[1]?.key; act(() => { result.current.updateRemoteRepo(secondKey!, { url: SECOND_PR_URL }); }); expect(result.current.taskName).toBe(""); }); });