Files
fusion/packages/dashboard/app/hooks/__tests__/useModalManager.test.ts
gsxdsm 0a50e2142d FN-9143: inherit selected workflow in New Task dialog
Make every New Task entry point seed the dialog from the active Board or List workflow.

- Resolve implicit workflow selection through the modal manager while preserving explicit choices and All workflows behavior.
- Forward selected workflow IDs from List view and navigation-backed dialog entry points.
- Add cross-surface regression coverage, operator documentation, and a patch changeset.

Files changed:
 .changeset/fn-9143-new-task-selected-workflow.md   |  7 +++
 docs/dashboard-guide.md                            |  2 +-
 packages/dashboard/app/App.tsx                     |  4 +-
 packages/dashboard/app/components/AppModals.tsx    |  4 +-
 packages/dashboard/app/components/Column.tsx       |  4 +-
 .../dashboard/app/components/LeftSidebarNav.tsx    |  4 +-
 packages/dashboard/app/components/ListView.tsx     |  7 ++-
 .../components/__tests__/LeftSidebarNav.test.tsx   |  1 +
 .../app/components/__tests__/ListView.test.tsx     | 13 +++--
 .../new-task-dialog-selected-workflow.test.tsx     | 46 ++++++++++++++++++
 .../dashboard/app/components/dashboard/types.ts    |  2 +-
 .../app/hooks/__tests__/useModalManager.test.ts    | 55 ++++++++++++++++++++++
 packages/dashboard/app/hooks/useModalManager.ts    | 19 ++++++--
 13 files changed, 148 insertions(+), 20 deletions(-)

Fusion-Task-Id: FN-9143

Fusion-Task-Lineage: 43951c5d-24d2-4243-826a-c6f416607882

Co-authored-by: Fusion (runfusion.ai) <noreply@runfusion.ai>
2026-08-17 20:54:43 -07:00

635 lines
21 KiB
TypeScript

import { describe, it, expect, vi, beforeEach } from "vitest";
import { act, renderHook, waitFor } from "@testing-library/react";
import type { Task, TaskDetail } from "@fusion/core";
import { useModalManager } from "../useModalManager";
import { scopedKey } from "../../utils/projectStorage";
import {
ALL_WORKFLOWS_BOARD_VIEW_ID,
BOARD_WORKFLOW_SELECTION_STORAGE_KEY,
} from "../../utils/boardWorkflowSelection";
function createTaskDetail(id: string): TaskDetail {
return {
id,
title: `Task ${id}`,
description: "desc",
column: "todo",
createdAt: new Date().toISOString(),
updatedAt: new Date().toISOString(),
columnMovedAt: new Date().toISOString(),
dependencies: [],
steps: [],
currentStep: 0,
log: [],
attachments: [],
size: "M",
reviewLevel: 1,
steeringComments: [],
prompt: "# Task spec",
} as TaskDetail;
}
function createTask(id: string): Task {
return {
id,
title: `Task ${id}`,
description: "desc",
column: "todo",
createdAt: new Date().toISOString(),
updatedAt: new Date().toISOString(),
columnMovedAt: new Date().toISOString(),
dependencies: [],
steps: [],
currentStep: 0,
log: [],
attachments: [],
size: "M",
reviewLevel: 1,
steeringComments: [],
} as Task;
}
describe("useModalManager", () => {
beforeEach(() => {
vi.clearAllMocks();
localStorage.clear();
});
it("manages open/close state for basic modals", () => {
const { result } = renderHook(() =>
useModalManager({ projectId: "proj_1", planningSessions: [] }),
);
expect(result.current.newTaskModalOpen).toBe(false);
expect(result.current.newTaskInitialDescription).toBeNull();
expect(result.current.anyModalOpen).toBe(false);
act(() => {
result.current.openNewTask();
});
expect(result.current.newTaskModalOpen).toBe(true);
expect(result.current.newTaskInitialDescription).toBeNull();
expect(result.current.anyModalOpen).toBe(true);
act(() => {
result.current.closeNewTask();
});
expect(result.current.newTaskModalOpen).toBe(false);
expect(result.current.newTaskInitialDescription).toBeNull();
expect(result.current.anyModalOpen).toBe(false);
});
/*
FNXC:ProjectSwitchModalReset 2026-07-23-00:00:
Switching the active project must dismiss project-scoped modals and drop pending
planning payloads (so Planning does not reopen the previous project's session),
while cross-project modals like Settings stay open.
*/
it("closeProjectScopedModals dismisses project-scoped modals and clears planning payloads, keeping settings open", () => {
const { result } = renderHook(() =>
useModalManager({ projectId: "proj_1", planningSessions: [{ id: "plan-1" }] }),
);
act(() => {
result.current.openDetailTask(createTaskDetail("FN-1"));
result.current.openGroupModal("group-1");
result.current.openNewTaskWithDescription("draft");
result.current.openSubtaskBreakdown("subtask work");
result.current.openPlanningWithSession("plan-1");
result.current.openGitHubImport();
result.current.openFiles("project", "/README.md");
result.current.openActivityLog();
result.current.openGitManager();
result.current.openWorkflowEditor();
result.current.openScripts();
result.current.toggleTerminal();
result.current.openSettings("general");
});
act(() => {
result.current.closeProjectScopedModals();
});
expect(result.current.detailTask).toBeNull();
expect(result.current.groupModalGroupId).toBeNull();
expect(result.current.newTaskModalOpen).toBe(false);
expect(result.current.newTaskInitialDescription).toBeNull();
expect(result.current.isSubtaskOpen).toBe(false);
expect(result.current.subtaskInitialDescription).toBeNull();
expect(result.current.isPlanningOpen).toBe(false);
expect(result.current.planningResumeSessionId).toBeUndefined();
expect(result.current.planningInitialPlan).toBeNull();
expect(result.current.githubImportOpen).toBe(false);
expect(result.current.filesOpen).toBe(false);
expect(result.current.fileBrowserInitialFile).toBeNull();
expect(result.current.activityLogOpen).toBe(false);
expect(result.current.gitManagerOpen).toBe(false);
expect(result.current.workflowEditorOpen).toBe(false);
expect(result.current.scriptsOpen).toBe(false);
expect(result.current.terminalOpen).toBe(false);
// Cross-project surfaces survive the swap.
expect(result.current.settingsOpen).toBe(true);
});
it("inherits the selected board workflow for new task opens while preserving explicit choices", () => {
const projectId = "proj_1";
const selectionKey = scopedKey(BOARD_WORKFLOW_SELECTION_STORAGE_KEY, projectId);
const { result } = renderHook(() =>
useModalManager({ projectId, planningSessions: [] }),
);
act(() => {
result.current.openNewTask();
});
expect(result.current.newTaskInitialWorkflowId).toBeUndefined();
localStorage.setItem(selectionKey, "coding");
act(() => {
result.current.openNewTask();
});
expect(result.current.newTaskInitialWorkflowId).toBe("coding");
act(() => {
result.current.openNewTask("explicit");
});
expect(result.current.newTaskInitialWorkflowId).toBe("explicit");
act(() => {
result.current.openNewTask(null);
});
expect(result.current.newTaskInitialWorkflowId).toBeNull();
act(() => {
result.current.openNewTask({ type: "click" } as never);
});
expect(result.current.newTaskInitialWorkflowId).toBe("coding");
localStorage.setItem(selectionKey, ALL_WORKFLOWS_BOARD_VIEW_ID);
act(() => {
result.current.openNewTask();
});
expect(result.current.newTaskInitialWorkflowId).toBeUndefined();
localStorage.setItem(selectionKey, "coding");
act(() => {
result.current.openNewTaskWithDescription("draft");
});
expect(result.current.newTaskInitialWorkflowId).toBe("coding");
act(() => {
result.current.closeNewTask();
});
expect(result.current.newTaskInitialWorkflowId).toBeUndefined();
});
it("opens the new task modal with a seeded description and resets it on close", () => {
const { result } = renderHook(() =>
useModalManager({ projectId: "proj_1", planningSessions: [] }),
);
act(() => {
result.current.openNewTaskWithDescription("File: README.md\n\nComment:\nCreate a task");
});
expect(result.current.newTaskModalOpen).toBe(true);
expect(result.current.newTaskInitialDescription).toContain("README.md");
act(() => {
result.current.closeNewTask();
});
expect(result.current.newTaskModalOpen).toBe(false);
expect(result.current.newTaskInitialDescription).toBeNull();
act(() => {
result.current.openNewTask();
});
expect(result.current.newTaskInitialDescription).toBeNull();
});
it("handles planning open, resume, and close lifecycle without clearing quick-add drafts", () => {
const projectId = "proj_1";
const quickEntryKey = scopedKey("kb-quick-entry-text", projectId);
const inlineCreateKey = scopedKey("kb-inline-create-text", projectId);
localStorage.setItem(quickEntryKey, "quick draft");
localStorage.setItem(inlineCreateKey, "inline draft");
const { result } = renderHook(() =>
useModalManager({ projectId, planningSessions: [{ id: "plan-1" }] }),
);
const sourceIssue = {
provider: "github" as const,
repository: "owner/repo",
issueNumber: 42,
url: "https://github.com/owner/repo/issues/42",
title: "Seeded issue",
};
act(() => {
result.current.openPlanningWithInitialPlan("Build dashboard", undefined, sourceIssue);
});
expect(result.current.isPlanningOpen).toBe(true);
expect(result.current.planningInitialPlan).toBe("Build dashboard");
expect(result.current.planningSourceIssue).toEqual(sourceIssue);
act(() => {
result.current.clearPlanningInitialPlan();
});
expect(result.current.planningInitialPlan).toBeNull();
expect(result.current.planningSourceIssue).toBeUndefined();
act(() => {
result.current.closePlanning();
});
expect(result.current.isPlanningOpen).toBe(false);
expect(result.current.planningInitialPlan).toBeNull();
expect(result.current.planningResumeSessionId).toBeUndefined();
expect(result.current.planningSourceIssue).toBeUndefined();
expect(localStorage.getItem(quickEntryKey)).toBe("quick draft");
expect(localStorage.getItem(inlineCreateKey)).toBe("inline draft");
act(() => {
result.current.resumePlanning();
});
expect(result.current.isPlanningOpen).toBe(true);
expect(result.current.planningResumeSessionId).toBe("plan-1");
expect(result.current.planningSourceIssue).toBeUndefined();
act(() => {
result.current.openPlanningWithInitialPlan("Seed another issue", undefined, sourceIssue);
result.current.openPlanning();
});
expect(result.current.planningSourceIssue).toBeUndefined();
});
it("clears scoped quick-add drafts after single-task planning completion", () => {
const projectId = "proj_1";
const quickEntryKey = scopedKey("kb-quick-entry-text", projectId);
const inlineCreateKey = scopedKey("kb-inline-create-text", projectId);
localStorage.setItem(quickEntryKey, "quick draft");
localStorage.setItem(inlineCreateKey, "inline draft");
const addToast = vi.fn();
const { result } = renderHook(() =>
useModalManager({ projectId, planningSessions: [] }),
);
act(() => {
result.current.onPlanningTaskCreated(createTask("FN-101"), addToast);
});
expect(addToast).toHaveBeenCalledWith(expect.any(String), "success");
expect(localStorage.getItem(quickEntryKey)).toBeNull();
expect(localStorage.getItem(inlineCreateKey)).toBeNull();
});
it("clears scoped quick-add drafts after multi-task planning completion", () => {
const projectId = "proj_1";
const quickEntryKey = scopedKey("kb-quick-entry-text", projectId);
const inlineCreateKey = scopedKey("kb-inline-create-text", projectId);
localStorage.setItem(quickEntryKey, "quick draft");
localStorage.setItem(inlineCreateKey, "inline draft");
const addToast = vi.fn();
const { result } = renderHook(() =>
useModalManager({ projectId, planningSessions: [] }),
);
act(() => {
result.current.onPlanningTasksCreated([createTask("FN-201"), createTask("FN-202")], addToast);
});
expect(addToast).toHaveBeenCalledWith(expect.any(String), "success");
expect(localStorage.getItem(quickEntryKey)).toBeNull();
expect(localStorage.getItem(inlineCreateKey)).toBeNull();
});
it("runScript sets terminalInitialCommand and opens the terminal modal", async () => {
const { result } = renderHook(() =>
useModalManager({ projectId: "proj_1", planningSessions: [] }),
);
act(() => {
result.current.openScripts();
});
expect(result.current.scriptsOpen).toBe(true);
expect(result.current.terminalOpen).toBe(false);
expect(result.current.terminalInitialCommand).toBeUndefined();
expect(result.current.terminalInitialCommandGeneration).toBe(0);
await act(async () => {
await result.current.runScript("build", "pnpm build");
});
expect(result.current.scriptsOpen).toBe(false);
expect(result.current.terminalOpen).toBe(true);
expect(result.current.terminalInitialCommand).toBe("pnpm build");
expect(result.current.terminalInitialCommandGeneration).toBe(1);
await act(async () => {
await result.current.runScript("build", "pnpm build");
});
expect(result.current.terminalInitialCommand).toBe("pnpm build");
expect(result.current.terminalInitialCommandGeneration).toBe(2);
});
it("tracks detail task state and supports tab-specific opens", () => {
const task = createTaskDetail("FN-123");
const { result } = renderHook(() =>
useModalManager({ projectId: "proj_1", planningSessions: [] }),
);
act(() => {
result.current.openDetailTask(task);
});
expect(result.current.detailTask?.id).toBe("FN-123");
expect(result.current.detailTaskInitialTab).toBeUndefined();
act(() => {
result.current.openDetailWithChangesTab(task);
});
expect(result.current.detailTaskInitialTab).toBe("changes");
act(() => {
result.current.openDetailTask(task, "chat");
});
expect(result.current.detailTaskInitialTab).toBe("chat");
act(() => {
result.current.closeDetailTask();
});
expect(result.current.detailTask).toBeNull();
});
it("opens settings with an initial section and resets on close", () => {
const { result } = renderHook(() =>
useModalManager({ projectId: "proj_1", planningSessions: [] }),
);
act(() => {
result.current.openSettings("authentication");
});
expect(result.current.settingsOpen).toBe(true);
expect(result.current.settingsInitialSection).toBe("authentication");
act(() => {
result.current.closeSettings();
});
expect(result.current.settingsOpen).toBe(false);
expect(result.current.settingsInitialSection).toBeUndefined();
});
it("accepts plain Task object for optimistic modal opening", () => {
const task = createTask("FN-456");
const { result } = renderHook(() =>
useModalManager({ projectId: "proj_1", planningSessions: [] }),
);
act(() => {
result.current.openDetailTask(task);
});
expect(result.current.detailTask?.id).toBe("FN-456");
// Should not have prompt field (plain Task)
expect("prompt" in (result.current.detailTask as unknown as Record<string, unknown>)).toBe(false);
expect(result.current.detailTaskInitialTab).toBeUndefined();
});
it.each([
[undefined, undefined, null],
["worktree-FN-X", undefined, null],
[undefined, "packages/foo/bar.ts", "packages/foo/bar.ts"],
])("opens files modal with workspace %s and initial file %s", (workspace, initialFile, expectedInitialFile) => {
const { result } = renderHook(() =>
useModalManager({ projectId: "proj_1", planningSessions: [] }),
);
act(() => {
result.current.openFiles(workspace, initialFile);
});
expect(result.current.filesOpen).toBe(true);
expect(result.current.fileBrowserInitialFile).toBe(expectedInitialFile);
expect(result.current.fileBrowserWorkspace).toBe(workspace ?? "project");
act(() => {
result.current.closeFiles();
});
expect(result.current.filesOpen).toBe(false);
expect(result.current.fileBrowserInitialFile).toBeNull();
});
it("ignores non-string workspace values in openFiles and keeps existing workspace", () => {
const { result } = renderHook(() =>
useModalManager({ projectId: "proj_1", planningSessions: [] }),
);
act(() => {
result.current.openFiles("FN-123", "packages/dashboard/app/App.tsx");
});
act(() => {
result.current.openFiles({ type: "click" } as unknown as string, { path: "bad" } as unknown as string);
});
expect(result.current.fileBrowserWorkspace).toBe("FN-123");
expect(result.current.fileBrowserInitialFile).toBeNull();
expect(result.current.filesOpen).toBe(true);
});
it("accepts plain Task object in openDetailWithChangesTab", () => {
const task = createTask("FN-789");
const { result } = renderHook(() =>
useModalManager({ projectId: "proj_1", planningSessions: [] }),
);
act(() => {
result.current.openDetailWithChangesTab(task);
});
expect(result.current.detailTask?.id).toBe("FN-789");
expect(result.current.detailTaskInitialTab).toBe("changes");
});
it("holds Task object in detailTask state correctly", () => {
const task = createTask("FN-100");
const { result } = renderHook(() =>
useModalManager({ projectId: "proj_1", planningSessions: [] }),
);
act(() => {
result.current.openDetailTask(task);
});
// State should hold the Task object with all its fields
const detailTask = result.current.detailTask;
expect(detailTask).not.toBeNull();
expect(detailTask!.id).toBe("FN-100");
expect(detailTask!.title).toBe("Task FN-100");
expect(detailTask!.column).toBe("todo");
// Can be closed and state resets
act(() => {
result.current.closeDetailTask();
});
expect(result.current.detailTask).toBeNull();
});
it("does not merge updates targeted at a different task id (FN-5148)", () => {
const taskA = createTaskDetail("FN-A");
const taskB = createTaskDetail("FN-B");
const { result } = renderHook(() =>
useModalManager({ projectId: "proj_1", planningSessions: [] }),
);
act(() => {
result.current.openDetailTask(taskA);
});
act(() => {
result.current.updateDetailTask({
id: "FN-A",
githubTracking: {
enabled: true,
issue: {
owner: "o",
repo: "r",
number: 1,
url: "u",
title: "t",
state: "open",
},
},
});
});
expect(result.current.detailTask?.githubTracking?.enabled).toBe(true);
act(() => {
result.current.openDetailTask(taskB);
});
act(() => {
result.current.updateDetailTask({ id: "FN-A", title: "A (late)", githubTracking: { enabled: true } });
});
expect(result.current.detailTask?.id).toBe("FN-B");
expect(result.current.detailTask?.title).toBe("Task FN-B");
});
it("still merges detail task patches when no id is provided (FN-5148)", () => {
const taskB = createTaskDetail("FN-B");
const { result } = renderHook(() =>
useModalManager({ projectId: "proj_1", planningSessions: [] }),
);
act(() => {
result.current.openDetailTask(taskB);
});
act(() => {
result.current.updateDetailTask({ title: "renamed" });
});
expect(result.current.detailTask?.id).toBe("FN-B");
expect(result.current.detailTask?.title).toBe("renamed");
});
it("applies equal-clock derived and clock-less lifecycle detail patches", () => {
const task = createTaskDetail("FN-LOCAL");
const { result } = renderHook(() => useModalManager({ projectId: "proj_1", planningSessions: [] }));
act(() => { result.current.openDetailTask(task); });
act(() => {
result.current.updateDetailTask({ ...task, prInfo: { number: 42 } } as Partial<TaskDetail>);
result.current.updateDetailTask({ column: "done", status: "completed" });
});
expect(result.current.detailTask).toMatchObject({ column: "done", status: "completed", prInfo: { number: 42 } });
});
it("keeps lifecycle state for a present strictly older local patch", () => {
const task = { ...createTaskDetail("FN-STALE"), updatedAt: "2026-08-09T10:00:00.000Z", columnMovedAt: "2026-08-09T10:00:00.000Z", status: "executing" };
const { result } = renderHook(() => useModalManager({ projectId: "proj_1", planningSessions: [] }));
act(() => { result.current.openDetailTask(task); });
act(() => {
result.current.updateDetailTask({
title: "Fresh local metadata",
column: "done",
columnMovedAt: "2026-08-09T09:00:00.000Z",
status: "completed",
updatedAt: "2026-08-09T09:00:00.000Z",
});
});
expect(result.current.detailTask).toMatchObject({
title: "Fresh local metadata",
column: "todo",
columnMovedAt: task.columnMovedAt,
status: "executing",
updatedAt: task.updatedAt,
});
});
it("ignores a detail patch safely before a task is open", () => {
const { result } = renderHook(() => useModalManager({ projectId: "proj_1", planningSessions: [] }));
act(() => { result.current.updateDetailTask({ title: "No detail" }); });
expect(result.current.detailTask).toBeNull();
});
it("tracks a target workflow id for normal workflow editor opens and resets it on close", () => {
const { result } = renderHook(() =>
useModalManager({ projectId: "proj_1", planningSessions: [] }),
);
act(() => {
result.current.openWorkflowEditor(undefined, "WF-selected");
});
expect(result.current.workflowEditorOpen).toBe(true);
expect(result.current.workflowEditorInitialPanel).toBeUndefined();
expect(result.current.workflowEditorInitialAction).toBeUndefined();
expect(result.current.workflowEditorInitialWorkflowId).toBe("WF-selected");
act(() => {
result.current.closeWorkflowEditor();
});
expect(result.current.workflowEditorOpen).toBe(false);
expect(result.current.workflowEditorInitialWorkflowId).toBeUndefined();
});
it("keeps workflow editor settings and create modes distinct from target workflow opens", () => {
const { result } = renderHook(() =>
useModalManager({ projectId: "proj_1", planningSessions: [] }),
);
act(() => {
result.current.openWorkflowEditor("settings", "WF-ignored");
});
expect(result.current.workflowEditorInitialPanel).toBe("settings");
expect(result.current.workflowEditorInitialAction).toBeUndefined();
expect(result.current.workflowEditorInitialWorkflowId).toBeUndefined();
act(() => {
result.current.openWorkflowEditor("create", "WF-ignored");
});
expect(result.current.workflowEditorInitialPanel).toBeUndefined();
expect(result.current.workflowEditorInitialAction).toBe("create");
expect(result.current.workflowEditorInitialWorkflowId).toBeUndefined();
});
});