feat(FN-674): add multi-project dashboard support

- Add Project Overview page with responsive grid and health status cards
- Add Project Selector dropdown in header for quick context switching
- Add project drill-down navigation with task board/list views
- Add Setup Wizard components for first-run project registration
- Add global activity feed with project attribution and filtering
- Add project-aware task fetching to backend API
- Add project health polling and status badges
- Update ActivityLogModal with project filter and useActivityLog hook
This commit is contained in:
gsxdsm
2026-04-01 07:27:29 -07:00
parent d781a4f2f8
commit 31fbe031e7
14 changed files with 1042 additions and 191 deletions

View File

@@ -6,11 +6,11 @@ import type { ActivityLogEntry } from "@fusion/core";
// Mock the API module
vi.mock("../../api", () => ({
fetchActivityLog: vi.fn(),
fetchActivityFeed: vi.fn(),
clearActivityLog: vi.fn(),
}));
const mockFetchActivityLog = vi.mocked(apiModule.fetchActivityLog);
const mockFetchActivityFeed = vi.mocked(apiModule.fetchActivityFeed);
const mockClearActivityLog = vi.mocked(apiModule.clearActivityLog);
describe("ActivityLogModal", () => {
@@ -53,7 +53,7 @@ describe("ActivityLogModal", () => {
beforeEach(() => {
vi.clearAllMocks();
mockFetchActivityLog.mockResolvedValue(mockActivityEntries);
mockFetchActivityFeed.mockResolvedValue(mockActivityEntries);
mockClearActivityLog.mockResolvedValue({ success: true });
});
@@ -128,7 +128,7 @@ describe("ActivityLogModal", () => {
);
await waitFor(() => {
expect(mockFetchActivityLog).toHaveBeenCalled();
expect(mockFetchActivityFeed).toHaveBeenCalled();
});
});
@@ -146,7 +146,7 @@ describe("ActivityLogModal", () => {
fireEvent.change(filterSelect, { target: { value: "task:created" } });
await waitFor(() => {
expect(mockFetchActivityLog).toHaveBeenCalledWith(
expect(mockFetchActivityFeed).toHaveBeenCalledWith(
expect.objectContaining({ type: "task:created" })
);
});
@@ -164,19 +164,19 @@ describe("ActivityLogModal", () => {
// Wait for initial load
await waitFor(() => {
expect(mockFetchActivityLog).toHaveBeenCalledTimes(1);
expect(mockFetchActivityFeed).toHaveBeenCalledTimes(1);
});
const refreshButton = screen.getByTestId("activity-refresh");
fireEvent.click(refreshButton);
await waitFor(() => {
expect(mockFetchActivityLog).toHaveBeenCalledTimes(2);
expect(mockFetchActivityFeed).toHaveBeenCalledTimes(2);
});
});
it("shows empty state when no entries", async () => {
mockFetchActivityLog.mockResolvedValue([]);
mockFetchActivityFeed.mockResolvedValue([]);
render(
<ActivityLogModal
@@ -193,7 +193,7 @@ describe("ActivityLogModal", () => {
});
it("shows error state when API fails", async () => {
mockFetchActivityLog.mockRejectedValue(new Error("API Error"));
mockFetchActivityFeed.mockRejectedValue(new Error("API Error"));
render(
<ActivityLogModal
@@ -250,4 +250,100 @@ describe("ActivityLogModal", () => {
// Check that confirmation dialog appears
expect(screen.getByText(/Clear Activity Log/i)).toBeTruthy();
});
// ── Project Filter Tests ─────────────────────────────────────────
it("shows project filter when projects provided", async () => {
const mockProjects = [
{ id: "proj_1", name: "Project One", path: "/path/1", status: "active" as const, isolationMode: "in-process" as const, createdAt: "", updatedAt: "" },
{ id: "proj_2", name: "Project Two", path: "/path/2", status: "active" as const, isolationMode: "in-process" as const, createdAt: "", updatedAt: "" },
];
render(
<ActivityLogModal
isOpen={true}
onClose={mockOnClose}
tasks={mockTasks}
projects={mockProjects}
/>
);
const projectFilter = await screen.findByTestId("activity-project-filter");
expect(projectFilter).toBeTruthy();
// Should have "All Projects" option
expect(screen.getByText("All Projects")).toBeDefined();
// Should have project options
expect(screen.getByText("Project One")).toBeDefined();
expect(screen.getByText("Project Two")).toBeDefined();
});
it("does not show project filter when no projects provided", async () => {
render(
<ActivityLogModal
isOpen={true}
onClose={mockOnClose}
tasks={mockTasks}
/>
);
await waitFor(() => {
expect(screen.getByTestId("activity-filter")).toBeTruthy();
});
// Project filter should not exist
expect(screen.queryByTestId("activity-project-filter")).toBeNull();
});
it("calls onProjectFilterChange when project filter changed", async () => {
const mockProjects = [
{ id: "proj_1", name: "Project One", path: "/path/1", status: "active" as const, isolationMode: "in-process" as const, createdAt: "", updatedAt: "" },
];
const onProjectFilterChange = vi.fn();
render(
<ActivityLogModal
isOpen={true}
onClose={mockOnClose}
tasks={mockTasks}
projects={mockProjects}
onProjectFilterChange={onProjectFilterChange}
/>
);
const projectFilter = await screen.findByTestId("activity-project-filter");
fireEvent.change(projectFilter, { target: { value: "proj_1" } });
expect(onProjectFilterChange).toHaveBeenCalledWith("proj_1");
});
it("shows empty state message mentioning filters when filter is active", async () => {
mockFetchActivityFeed.mockResolvedValue([]);
const mockProjects = [
{ id: "proj_1", name: "Project One", path: "/path/1", status: "active" as const, isolationMode: "in-process" as const, createdAt: "", updatedAt: "" },
];
render(
<ActivityLogModal
isOpen={true}
onClose={mockOnClose}
tasks={mockTasks}
projects={mockProjects}
/>
);
// Wait for initial load
await waitFor(() => {
expect(screen.getByTestId("activity-empty")).toBeTruthy();
});
// Change the filter to trigger filtered empty state
const projectFilter = screen.getByTestId("activity-project-filter");
fireEvent.change(projectFilter, { target: { value: "proj_1" } });
// Should show filter-specific message
await waitFor(() => {
expect(screen.getByText(/No activity matches the current filters/)).toBeTruthy();
});
});
});