feat(#52): implement Active Projects & Agent Chains widget

Add HUD widget for tracking active projects and running agent sessions.

Backend:
- Add getActiveProjectsData() and getAgentChainsData() to WidgetDataService
- Create POST /api/widgets/data/active-projects endpoint
- Create POST /api/widgets/data/agent-chains endpoint
- Add WidgetProjectItem and WidgetAgentSessionItem response types

Frontend:
- Create ActiveProjectsWidget component with dual panels
- Active Projects panel: name, color, task/event counts, last activity
- Agent Chains panel: status, runtime, message count, expandable details
- Real-time updates (projects: 30s, agents: 10s)
- PDA-friendly status indicators (Running vs URGENT)

Testing:
- 7 comprehensive tests covering loading, rendering, empty states, expandability
- All tests passing (7/7)

Refs #52

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

apps/web/src/components/widgets/WidgetRegistry.tsx

@@ -8,6 +8,7 @@ import { TasksWidget } from "./TasksWidget";
 import { CalendarWidget } from "./CalendarWidget";
 import { QuickCaptureWidget } from "./QuickCaptureWidget";
 import { AgentStatusWidget } from "./AgentStatusWidget";
+import { ActiveProjectsWidget } from "./ActiveProjectsWidget";
 
 export interface WidgetDefinition {
   name: string;
@@ -71,6 +72,17 @@ export const widgetRegistry: Record<string, WidgetDefinition> = {
     minHeight: 2,
     maxWidth: 3,
   },
+  ActiveProjectsWidget: {
+    name: "ActiveProjectsWidget",
+    displayName: "Active Projects & Agent Chains",
+    description: "View active projects and running agent sessions",
+    component: ActiveProjectsWidget,
+    defaultWidth: 2,
+    defaultHeight: 3,
+    minWidth: 2,
+    minHeight: 2,
+    maxWidth: 4,
+  },
 };
 
 /**