@grackle-ai/web-components 0.107.2

package/src/utils/breadcrumbs.test.ts

@@ -0,0 +1,285 @@
+import { describe, it, expect } from "vitest";
+import {
+  buildTaskAncestorChain,
+  buildHomeBreadcrumbs,
+  buildSettingsBreadcrumbs,
+  buildWorkspaceBreadcrumbs,
+  buildTaskBreadcrumbs,
+  buildNewTaskBreadcrumbs,
+  buildNewChatBreadcrumbs,
+  buildSessionBreadcrumbs,
+  buildFindingsBreadcrumbs,
+  buildFindingBreadcrumbs,
+  type BreadcrumbSegment,
+} from "./breadcrumbs.js";
+import type { Environment, TaskData, Workspace } from "../hooks/types.js";
+import { getStatusBadgeClassKey, getStatusStyle } from "./taskStatus.js";
+
+/** Creates a minimal Workspace for testing. */
+function makeWorkspace(id: string, name: string, environmentId: string = "env-1"): Workspace {
+  return {
+    id,
+    name,
+    description: "",
+    repoUrl: "",
+    linkedEnvironmentIds: environmentId ? [environmentId] : [],
+    status: "active",
+    workingDirectory: "",
+    useWorktrees: true,
+    defaultPersonaId: "",
+    tokenBudget: 0,
+    costBudgetMillicents: 0,
+    createdAt: "",
+    updatedAt: "",
+  };
+}
+
+/** Creates a minimal Environment for testing. */
+function makeEnvironment(id: string, displayName: string): Environment {
+  return {
+    id,
+    displayName,
+    adapterType: "local",
+    adapterConfig: "",
+    status: "connected",
+    bootstrapped: true,
+  };
+}
+
+/** Creates a minimal TaskData for testing. */
+function makeTask(overrides: Partial<TaskData> & { id: string; workspaceId: string }): TaskData {
+  return {
+    title: overrides.id,
+    description: "",
+    status: "not_started",
+    branch: "",
+    latestSessionId: "",
+    dependsOn: [],
+    sortOrder: 0,
+    createdAt: "",
+    parentTaskId: "",
+    depth: 0,
+    childTaskIds: [],
+    canDecompose: false,
+    defaultPersonaId: "",
+    workpad: "",
+    tokenBudget: 0,
+    costBudgetMillicents: 0,
+    ...overrides,
+  };
+}
+
+describe("buildTaskAncestorChain", () => {
+  it("returns single task when no parent", () => {
+    const task: TaskData = makeTask({ id: "t1", workspaceId: "p1", title: "Root" });
+    const byId: Map<string, TaskData> = new Map([["t1", task]]);
+
+    const chain: TaskData[] = buildTaskAncestorChain("t1", byId);
+    expect(chain).toHaveLength(1);
+    expect(chain[0].id).toBe("t1");
+  });
+
+  it("returns ancestor chain root-first", () => {
+    const root: TaskData = makeTask({ id: "t1", workspaceId: "p1", title: "Root" });
+    const child: TaskData = makeTask({ id: "t2", workspaceId: "p1", title: "Child", parentTaskId: "t1", depth: 1 });
+    const grandchild: TaskData = makeTask({ id: "t3", workspaceId: "p1", title: "Grandchild", parentTaskId: "t2", depth: 2 });
+    const byId: Map<string, TaskData> = new Map([["t1", root], ["t2", child], ["t3", grandchild]]);
+
+    const chain: TaskData[] = buildTaskAncestorChain("t3", byId);
+    expect(chain).toHaveLength(3);
+    expect(chain[0].title).toBe("Root");
+    expect(chain[1].title).toBe("Child");
+    expect(chain[2].title).toBe("Grandchild");
+  });
+
+  it("handles missing parent gracefully", () => {
+    const task: TaskData = makeTask({ id: "t1", workspaceId: "p1", title: "Orphan", parentTaskId: "missing" });
+    const byId: Map<string, TaskData> = new Map([["t1", task]]);
+
+    const chain: TaskData[] = buildTaskAncestorChain("t1", byId);
+    expect(chain).toHaveLength(1);
+    expect(chain[0].title).toBe("Orphan");
+  });
+
+  it("guards against cycles", () => {
+    const t1: TaskData = makeTask({ id: "t1", workspaceId: "p1", parentTaskId: "t2" });
+    const t2: TaskData = makeTask({ id: "t2", workspaceId: "p1", parentTaskId: "t1" });
+    const byId: Map<string, TaskData> = new Map([["t1", t1], ["t2", t2]]);
+
+    const chain: TaskData[] = buildTaskAncestorChain("t1", byId);
+    // Should not infinite-loop; returns at most the 2 tasks
+    expect(chain.length).toBeLessThanOrEqual(2);
+  });
+});
+
+describe("breadcrumb builders", () => {
+  it("home returns Home as non-clickable", () => {
+    const segments: BreadcrumbSegment[] = buildHomeBreadcrumbs();
+    expect(segments).toHaveLength(1);
+    expect(segments[0].label).toBe("Home");
+    expect(segments[0].url).toBeUndefined();
+  });
+
+  it("settings returns Home > Settings when no tab specified", () => {
+    const segments: BreadcrumbSegment[] = buildSettingsBreadcrumbs();
+    expect(segments).toHaveLength(2);
+    expect(segments[0].label).toBe("Home");
+    expect(segments[0].url).toBe("/");
+    expect(segments[1].label).toBe("Settings");
+    expect(segments[1].url).toBeUndefined();
+  });
+
+  it("settings with tab returns Home > Settings > TabLabel", () => {
+    const segments: BreadcrumbSegment[] = buildSettingsBreadcrumbs("Environments");
+    expect(segments).toHaveLength(3);
+    expect(segments[0].label).toBe("Home");
+    expect(segments[0].url).toBe("/");
+    expect(segments[1].label).toBe("Settings");
+    expect(segments[1].url).toBe("/settings");
+    expect(segments[2].label).toBe("Environments");
+    expect(segments[2].url).toBeUndefined();
+  });
+
+  it("workspace returns Home > Environments > Env > WorkspaceName", () => {
+    const workspaces: Workspace[] = [makeWorkspace("p1", "My Workspace", "env-1")];
+    const environments: Environment[] = [makeEnvironment("env-1", "Local Dev")];
+    const segments: BreadcrumbSegment[] = buildWorkspaceBreadcrumbs("p1", "env-1", workspaces, environments);
+    expect(segments).toHaveLength(4);
+    expect(segments[0].label).toBe("Home");
+    expect(segments[0].url).toBe("/");
+    expect(segments[1].label).toBe("Environments");
+    expect(segments[1].url).toBe("/environments");
+    expect(segments[2].label).toBe("Local Dev");
+    expect(segments[2].url).toBe("/environments/env-1");
+    expect(segments[3].label).toBe("My Workspace");
+    expect(segments[3].url).toBeUndefined();
+  });
+
+  it("task returns Home > Environments > Env > Workspace > Task", () => {
+    const workspaces: Workspace[] = [makeWorkspace("p1", "My Workspace", "env-1")];
+    const environments: Environment[] = [makeEnvironment("env-1", "Local Dev")];
+    const task: TaskData = makeTask({ id: "t1", workspaceId: "p1", title: "My Task" });
+    const byId: Map<string, TaskData> = new Map([["t1", task]]);
+
+    const segments: BreadcrumbSegment[] = buildTaskBreadcrumbs("t1", "env-1", workspaces, environments, byId);
+    expect(segments).toHaveLength(5);
+    expect(segments[0].label).toBe("Home");
+    expect(segments[0].url).toBe("/");
+    expect(segments[1].label).toBe("Environments");
+    expect(segments[1].url).toBe("/environments");
+    expect(segments[2].label).toBe("Local Dev");
+    expect(segments[2].url).toBe("/environments/env-1");
+    expect(segments[3].label).toBe("My Workspace");
+    expect(segments[3].url).toBe("/environments/env-1/workspaces/p1");
+    expect(segments[4].label).toBe("My Task");
+    expect(segments[4].url).toBeUndefined();
+  });
+
+  it("nested task includes ancestor chain", () => {
+    const workspaces: Workspace[] = [makeWorkspace("p1", "WS", "env-1")];
+    const environments: Environment[] = [makeEnvironment("env-1", "Local Dev")];
+    const root: TaskData = makeTask({ id: "t1", workspaceId: "p1", title: "Root" });
+    const child: TaskData = makeTask({ id: "t2", workspaceId: "p1", title: "Child", parentTaskId: "t1", depth: 1 });
+    const grandchild: TaskData = makeTask({ id: "t3", workspaceId: "p1", title: "Grandchild", parentTaskId: "t2", depth: 2 });
+    const byId: Map<string, TaskData> = new Map([["t1", root], ["t2", child], ["t3", grandchild]]);
+
+    const segments: BreadcrumbSegment[] = buildTaskBreadcrumbs("t3", "env-1", workspaces, environments, byId);
+    expect(segments).toHaveLength(7); // Home > Environments > Env > WS > Root > Child > Grandchild
+    expect(segments[0].label).toBe("Home");
+    expect(segments[1].label).toBe("Environments");
+    expect(segments[2].label).toBe("Local Dev");
+    expect(segments[3].label).toBe("WS");
+    expect(segments[3].url).toBe("/environments/env-1/workspaces/p1");
+    expect(segments[4].label).toBe("Root");
+    expect(segments[4].url).toBe("/environments/env-1/workspaces/p1/tasks/t1");
+    expect(segments[5].label).toBe("Child");
+    expect(segments[5].url).toBe("/environments/env-1/workspaces/p1/tasks/t2");
+    expect(segments[6].label).toBe("Grandchild");
+    expect(segments[6].url).toBeUndefined();
+  });
+
+  it("new task with parentTaskId shows ancestor chain", () => {
+    const workspaces: Workspace[] = [makeWorkspace("p1", "WS", "env-1")];
+    const environments: Environment[] = [makeEnvironment("env-1", "Local Dev")];
+    const parent: TaskData = makeTask({ id: "t1", workspaceId: "p1", title: "Parent" });
+    const byId: Map<string, TaskData> = new Map([["t1", parent]]);
+
+    const segments: BreadcrumbSegment[] = buildNewTaskBreadcrumbs("p1", "env-1", "t1", workspaces, environments, byId);
+    expect(segments).toHaveLength(6); // Home > Environments > Env > WS > Parent > New Task
+    expect(segments[1].label).toBe("Environments");
+    expect(segments[2].label).toBe("Local Dev");
+    expect(segments[3].label).toBe("WS");
+    expect(segments[4].label).toBe("Parent");
+    expect(segments[5].label).toBe("New Task");
+    expect(segments[5].url).toBeUndefined();
+  });
+
+  it("new chat returns Home > New Chat", () => {
+    const segments: BreadcrumbSegment[] = buildNewChatBreadcrumbs();
+    expect(segments).toHaveLength(2);
+    expect(segments[1].label).toBe("New Chat");
+  });
+
+  it("session returns Home > Session prefix", () => {
+    const segments: BreadcrumbSegment[] = buildSessionBreadcrumbs("abcdef1234567890");
+    expect(segments).toHaveLength(2);
+    expect(segments[1].label).toBe("Session abcdef12");
+  });
+});
+
+describe("findings breadcrumb builders", () => {
+  it("buildFindingsBreadcrumbs returns Home > Findings (non-clickable)", () => {
+    const segments: BreadcrumbSegment[] = buildFindingsBreadcrumbs();
+    expect(segments).toHaveLength(2);
+    expect(segments[0].label).toBe("Home");
+    expect(segments[0].url).toBe("/");
+    expect(segments[1].label).toBe("Findings");
+    expect(segments[1].url).toBeUndefined();
+  });
+
+  it("buildFindingBreadcrumbs without scope returns Home > Findings > Title", () => {
+    const segments: BreadcrumbSegment[] = buildFindingBreadcrumbs("My Finding", undefined, undefined, [], []);
+    expect(segments).toHaveLength(3);
+    expect(segments[0].label).toBe("Home");
+    expect(segments[0].url).toBe("/");
+    expect(segments[1].label).toBe("Findings");
+    expect(segments[1].url).toBe("/findings");
+    expect(segments[2].label).toBe("My Finding");
+    expect(segments[2].url).toBeUndefined();
+  });
+
+  it("buildFindingBreadcrumbs with workspace scope returns full chain", () => {
+    const workspaces: Workspace[] = [makeWorkspace("ws1", "My Workspace", "env1")];
+    const environments: Environment[] = [makeEnvironment("env1", "Local Dev")];
+    const segments: BreadcrumbSegment[] = buildFindingBreadcrumbs("My Finding", "ws1", "env1", workspaces, environments);
+    expect(segments).toHaveLength(6);
+    expect(segments[0].label).toBe("Home");
+    expect(segments[0].url).toBe("/");
+    expect(segments[1].label).toBe("Environments");
+    expect(segments[1].url).toBe("/environments");
+    expect(segments[2].label).toBe("Local Dev");
+    expect(segments[2].url).toBe("/environments/env1");
+    expect(segments[3].label).toBe("My Workspace");
+    expect(segments[3].url).toBe("/environments/env1/workspaces/ws1");
+    expect(segments[4].label).toBe("Findings");
+    expect(segments[4].url).toBe("/environments/env1/workspaces/ws1/findings");
+    expect(segments[5].label).toBe("My Finding");
+    expect(segments[5].url).toBeUndefined();
+  });
+});
+
+describe("task status helpers", () => {
+  it("maps legacy task statuses to canonical styles", () => {
+    expect(getStatusStyle("pending").label).toBe("Not Started");
+    expect(getStatusStyle("in_progress").label).toBe("Working");
+    expect(getStatusStyle("review").label).toBe("Paused");
+    expect(getStatusStyle("done").label).toBe("Complete");
+  });
+
+  it("maps legacy task statuses to canonical badge classes", () => {
+    expect(getStatusBadgeClassKey("pending")).toBe("statusPending");
+    expect(getStatusBadgeClassKey("in_progress")).toBe("statusInProgress");
+    expect(getStatusBadgeClassKey("waiting_input")).toBe("statusWaitingInput");
+    expect(getStatusBadgeClassKey("done")).toBe("statusDone");
+  });
+});

package/src/utils/breadcrumbs.ts

@@ -0,0 +1,222 @@
+import type { Environment, TaskData, Workspace } from "../hooks/types.js";
+import { ENVIRONMENTS_URL, environmentUrl, FINDINGS_URL, findingsUrl, HOME_URL, SETTINGS_URL, taskUrl, workspaceUrl } from "./navigation.js";
+
+/** A single segment in the breadcrumb trail. */
+export interface BreadcrumbSegment {
+  /** Display label for this segment. */
+  label: string;
+  /** URL to navigate to when clicked, or undefined for the current (non-clickable) segment. */
+  url: string | undefined;
+}
+
+/**
+ * Walks up the `parentTaskId` chain from a task to build an ordered list
+ * of ancestor tasks (root-first). Includes the task itself as the last element.
+ */
+export function buildTaskAncestorChain(
+  taskId: string,
+  tasksById: Map<string, TaskData>,
+): TaskData[] {
+  const ancestors: TaskData[] = [];
+  let currentId: string | undefined = taskId;
+  const visited = new Set<string>();
+
+  while (currentId && tasksById.has(currentId)) {
+    if (visited.has(currentId)) {
+      break; // guard against cycles
+    }
+    visited.add(currentId);
+    const ancestor: TaskData = tasksById.get(currentId)!;
+    ancestors.unshift(ancestor);
+    currentId = ancestor.parentTaskId || undefined;
+  }
+  return ancestors;
+}
+
+/** Home breadcrumb segment. */
+const HOME_SEGMENT: BreadcrumbSegment = { label: "Home", url: HOME_URL };
+
+/** Build breadcrumbs for the home page. */
+export function buildHomeBreadcrumbs(): BreadcrumbSegment[] {
+  return [{ label: "Home", url: undefined }];
+}
+
+/** Build breadcrumbs for the settings page, optionally showing the active tab. */
+export function buildSettingsBreadcrumbs(tabLabel?: string): BreadcrumbSegment[] {
+  if (tabLabel) {
+    return [HOME_SEGMENT, { label: "Settings", url: SETTINGS_URL }, { label: tabLabel, url: undefined }];
+  }
+  return [HOME_SEGMENT, { label: "Settings", url: undefined }];
+}
+
+/** Environments breadcrumb segment. */
+const ENVIRONMENTS_SEGMENT: BreadcrumbSegment = { label: "Environments", url: ENVIRONMENTS_URL };
+
+/** Build breadcrumbs for the environments landing page. */
+export function buildEnvironmentsBreadcrumbs(): BreadcrumbSegment[] {
+  return [HOME_SEGMENT, { label: "Environments", url: undefined }];
+}
+
+/** Build breadcrumbs for the new environment page. */
+export function buildNewEnvironmentBreadcrumbs(): BreadcrumbSegment[] {
+  return [HOME_SEGMENT, ENVIRONMENTS_SEGMENT, { label: "New Environment", url: undefined }];
+}
+
+/** Build breadcrumbs for the new chat page. */
+export function buildNewChatBreadcrumbs(): BreadcrumbSegment[] {
+  return [HOME_SEGMENT, { label: "New Chat", url: undefined }];
+}
+
+/** Build breadcrumbs for a session page. */
+export function buildSessionBreadcrumbs(sessionId: string): BreadcrumbSegment[] {
+  return [HOME_SEGMENT, { label: `Session ${sessionId.slice(0, 8)}`, url: undefined }];
+}
+
+/** Build breadcrumbs for a workspace page: Home > Environments > [Env] > [Workspace]. */
+export function buildWorkspaceBreadcrumbs(
+  workspaceId: string,
+  environmentId: string,
+  workspaces: Workspace[],
+  environments: Environment[],
+): BreadcrumbSegment[] {
+  const workspace = workspaces.find((p) => p.id === workspaceId);
+  const environment = environments.find((e) => e.id === environmentId);
+  return [
+    HOME_SEGMENT,
+    ENVIRONMENTS_SEGMENT,
+    { label: environment?.displayName ?? "Environment", url: environmentUrl(environmentId) },
+    { label: workspace?.name ?? "Workspace", url: undefined },
+  ];
+}
+
+/** Build breadcrumbs for a task page: Home > Environments > [Env] > [Workspace] > [ancestors...] > [Task]. */
+export function buildTaskBreadcrumbs(
+  taskId: string,
+  routeEnvironmentId: string | undefined,
+  workspaces: Workspace[],
+  environments: Environment[],
+  tasksById: Map<string, TaskData>,
+): BreadcrumbSegment[] {
+  const ancestors = buildTaskAncestorChain(taskId, tasksById);
+  const task = tasksById.get(taskId);
+  const taskWorkspaceId = task?.workspaceId;
+  const workspace = taskWorkspaceId ? workspaces.find((p) => p.id === taskWorkspaceId) : undefined;
+  const environmentId = routeEnvironmentId ?? workspace?.linkedEnvironmentIds[0];
+  const environment = environmentId ? environments.find((e) => e.id === environmentId) : undefined;
+
+  const segments: BreadcrumbSegment[] = [HOME_SEGMENT];
+
+  if (environment && environmentId) {
+    segments.push(ENVIRONMENTS_SEGMENT);
+    segments.push({ label: environment.displayName, url: environmentUrl(environmentId) });
+  }
+
+  if (workspace && environmentId) {
+    segments.push({
+      label: workspace.name,
+      url: workspaceUrl(workspace.id, environmentId),
+    });
+  }
+
+  // Add ancestor tasks (all except the last, which is the current task)
+  for (let i = 0; i < ancestors.length - 1; i++) {
+    segments.push({
+      label: ancestors[i].title,
+      url: taskUrl(ancestors[i].id, undefined, taskWorkspaceId, environmentId),
+    });
+  }
+
+  // Current task (non-clickable)
+  const currentTask = ancestors[ancestors.length - 1];
+  segments.push({
+    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- currentTask may be undefined if ancestors is empty
+    label: currentTask?.title ?? taskId,
+    url: undefined,
+  });
+
+  return segments;
+}
+
+/** Build breadcrumbs for the new task page. */
+export function buildNewTaskBreadcrumbs(
+  workspaceIdParam: string,
+  environmentId: string | undefined,
+  parentTaskId: string | undefined,
+  workspaces: Workspace[],
+  environments: Environment[],
+  tasksById: Map<string, TaskData>,
+): BreadcrumbSegment[] {
+  const workspace = workspaces.find((p) => p.id === workspaceIdParam);
+  const envId = environmentId ?? workspace?.linkedEnvironmentIds[0];
+  const environment = envId ? environments.find((e) => e.id === envId) : undefined;
+
+  const segments: BreadcrumbSegment[] = [HOME_SEGMENT];
+
+  if (environment && envId) {
+    segments.push(ENVIRONMENTS_SEGMENT);
+    segments.push({ label: environment.displayName, url: environmentUrl(envId) });
+  }
+
+  if (envId) {
+    segments.push({
+      label: workspace?.name ?? "Workspace",
+      url: workspaceUrl(workspaceIdParam, envId),
+    });
+  } else {
+    segments.push({
+      label: workspace?.name ?? "Workspace",
+      url: undefined,
+    });
+  }
+
+  // If creating a child task, show parent ancestors
+  if (parentTaskId) {
+    const ancestors = buildTaskAncestorChain(parentTaskId, tasksById);
+    for (const ancestor of ancestors) {
+      segments.push({
+        label: ancestor.title,
+        url: taskUrl(ancestor.id, undefined, workspaceIdParam, envId),
+      });
+    }
+  }
+
+  segments.push({ label: "New Task", url: undefined });
+  return segments;
+}
+
+/** Findings breadcrumb segment. */
+const FINDINGS_SEGMENT: BreadcrumbSegment = { label: "Findings", url: FINDINGS_URL };
+
+/** Build breadcrumbs for the findings landing page. */
+export function buildFindingsBreadcrumbs(): BreadcrumbSegment[] {
+  return [HOME_SEGMENT, { label: "Findings", url: undefined }];
+}
+
+/** Build breadcrumbs for a finding detail page, optionally scoped to a workspace. */
+export function buildFindingBreadcrumbs(
+  findingTitle: string,
+  workspaceId: string | undefined,
+  environmentId: string | undefined,
+  workspaces: Workspace[],
+  environments: Environment[],
+): BreadcrumbSegment[] {
+  const segments: BreadcrumbSegment[] = [HOME_SEGMENT];
+
+  if (workspaceId && environmentId) {
+    const workspace = workspaces.find((p) => p.id === workspaceId);
+    const environment = environments.find((e) => e.id === environmentId);
+    segments.push(ENVIRONMENTS_SEGMENT);
+    if (environment) {
+      segments.push({ label: environment.displayName, url: environmentUrl(environmentId) });
+    }
+    if (workspace) {
+      segments.push({ label: workspace.name, url: workspaceUrl(workspaceId, environmentId) });
+    }
+    segments.push({ label: "Findings", url: findingsUrl(workspaceId, environmentId) });
+  } else {
+    segments.push(FINDINGS_SEGMENT);
+  }
+
+  segments.push({ label: findingTitle, url: undefined });
+  return segments;
+}

package/src/utils/dashboard.test.ts

@@ -0,0 +1,156 @@
+import { describe, expect, it } from "vitest";
+import type { Environment, Session, TaskData, Workspace } from "../hooks/types.js";
+import { computeKpis, getAttentionTasks, getWorkspaceSnapshots } from "./dashboard.js";
+
+function makeWorkspace(id: string, name: string, environmentId: string = "env-1"): Workspace {
+  return {
+    id,
+    name,
+    description: "",
+    repoUrl: "",
+    linkedEnvironmentIds: environmentId ? [environmentId] : [],
+    status: "active",
+    workingDirectory: "",
+    useWorktrees: true,
+    defaultPersonaId: "",
+    tokenBudget: 0,
+    costBudgetMillicents: 0,
+    createdAt: "",
+    updatedAt: "",
+  };
+}
+
+function makeTask(overrides: Partial<TaskData> & { id: string }): TaskData {
+  const { id, ...rest } = overrides;
+  return {
+    id,
+    workspaceId: "ws-1",
+    title: id,
+    description: "",
+    status: "not_started",
+    branch: "",
+    latestSessionId: "",
+    dependsOn: [],
+    sortOrder: 0,
+    createdAt: "",
+    parentTaskId: "",
+    depth: 0,
+    childTaskIds: [],
+    canDecompose: false,
+    defaultPersonaId: "",
+    workpad: "",
+    tokenBudget: 0,
+    costBudgetMillicents: 0,
+    ...rest,
+  };
+}
+
+function makeSession(overrides: Partial<Session> & { id: string }): Session {
+  const { id, ...rest } = overrides;
+  return {
+    id,
+    environmentId: "env-1",
+    runtime: "stub",
+    status: "idle",
+    prompt: "prompt",
+    startedAt: "",
+    ...rest,
+  };
+}
+
+function makeEnvironment(id: string, displayName: string, status: string): Environment {
+  return {
+    id,
+    displayName,
+    adapterType: "local",
+    adapterConfig: "{}",
+    status,
+    bootstrapped: true,
+  };
+}
+
+describe("dashboard selectors", () => {
+  it("treats missing dependency tasks as blocked in KPI counts", () => {
+    const tasks: TaskData[] = [makeTask({ id: "task-1", dependsOn: ["missing-task"] })];
+
+    const kpis = computeKpis([], tasks, []);
+
+    expect(kpis.blockedTasks).toBe(1);
+    expect(kpis.attentionTasks).toBe(1);
+  });
+
+  it("orders attention tasks as failed, blocked, then paused", () => {
+    const workspaces: Workspace[] = [makeWorkspace("ws-1", "Alpha")];
+    const tasks: TaskData[] = [
+      makeTask({ id: "paused-task", title: "Paused task", status: "paused" }),
+      makeTask({ id: "dependency-source", title: "Dependency source", status: "working" }),
+      makeTask({ id: "blocked-task", title: "Blocked task", dependsOn: ["dependency-source"] }),
+      makeTask({ id: "failed-task", title: "Failed task", status: "failed" }),
+    ];
+
+    const attentionTasks = getAttentionTasks(tasks, workspaces);
+
+    expect(attentionTasks.map((entry) => entry.reason)).toEqual(["failed", "blocked", "paused"]);
+    expect(attentionTasks.map((entry) => entry.task.title)).toEqual([
+      "Failed task",
+      "Blocked task",
+      "Paused task",
+    ]);
+  });
+
+  it("builds workspace snapshots from grouped task stats", () => {
+    const workspaces: Workspace[] = [
+      makeWorkspace("ws-1", "Alpha", "env-1"),
+      makeWorkspace("ws-2", "Beta", "env-2"),
+    ];
+    const tasks: TaskData[] = [
+      makeTask({ id: "a-1", workspaceId: "ws-1", status: "complete" }),
+      makeTask({ id: "a-2", workspaceId: "ws-1", status: "working" }),
+      makeTask({ id: "a-3", workspaceId: "ws-1", status: "failed" }),
+      makeTask({ id: "b-1", workspaceId: "ws-2", status: "not_started" }),
+      makeTask({ id: "root-task", workspaceId: undefined, status: "working" }),
+    ];
+    const environments: Environment[] = [
+      makeEnvironment("env-1", "test-local", "connected"),
+      makeEnvironment("env-2", "backup", "connected"),
+    ];
+
+    const snapshots = getWorkspaceSnapshots(workspaces, tasks, environments);
+
+    expect(snapshots).toEqual([
+      {
+        workspace: workspaces[0],
+        totalTasks: 3,
+        completedTasks: 1,
+        workingTasks: 1,
+        failedTasks: 1,
+      },
+      {
+        workspace: workspaces[1],
+        totalTasks: 1,
+        completedTasks: 0,
+        workingTasks: 0,
+        failedTasks: 0,
+      },
+    ]);
+  });
+
+  it("counts active sessions and unhealthy environments", () => {
+    const sessions: Session[] = [
+      makeSession({ id: "session-1", status: "running" }),
+      makeSession({ id: "session-2", status: "idle" }),
+      makeSession({ id: "session-3", status: "waiting" }),
+      makeSession({ id: "session-4", status: "stopped" }),
+    ];
+    const environments: Environment[] = [
+      makeEnvironment("env-1", "primary", "connected"),
+      makeEnvironment("env-2", "secondary", "disconnected"),
+      makeEnvironment("env-3", "tertiary", "error"),
+    ];
+
+    const kpis = computeKpis(sessions, [], environments);
+
+    expect(kpis.activeSessions).toBe(3);
+    expect(kpis.unhealthyEnvironments).toBe(2);
+  });
+});