Create TaskProgressWidget showing live agent task execution progress: - Fetches from orchestrator /agents API with 15s auto-refresh - Shows stats (total/active/done/stopped), sorted task list - Agent type badges (worker/reviewer/tester) - Elapsed time tracking, error display - Dark mode support, PDA-friendly language - Registered in WidgetRegistry for dashboard use Includes 7 unit tests covering all states. Fixes #101 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
120 lines
2.9 KiB
TypeScript
120 lines
2.9 KiB
TypeScript
/**
|
|
* Widget Registry - Central registry for all available widgets
|
|
*/
|
|
|
|
import type { ComponentType } from "react";
|
|
import type { WidgetProps } from "@mosaic/shared";
|
|
import { TasksWidget } from "./TasksWidget";
|
|
import { CalendarWidget } from "./CalendarWidget";
|
|
import { QuickCaptureWidget } from "./QuickCaptureWidget";
|
|
import { AgentStatusWidget } from "./AgentStatusWidget";
|
|
import { ActiveProjectsWidget } from "./ActiveProjectsWidget";
|
|
import { TaskProgressWidget } from "./TaskProgressWidget";
|
|
|
|
export interface WidgetDefinition {
|
|
name: string;
|
|
displayName: string;
|
|
description: string;
|
|
component: ComponentType<WidgetProps>;
|
|
defaultWidth: number;
|
|
defaultHeight: number;
|
|
minWidth: number;
|
|
minHeight: number;
|
|
maxWidth?: number;
|
|
maxHeight?: number;
|
|
}
|
|
|
|
/**
|
|
* Registry of all available widgets
|
|
*/
|
|
export const widgetRegistry: Record<string, WidgetDefinition> = {
|
|
TasksWidget: {
|
|
name: "TasksWidget",
|
|
displayName: "Tasks",
|
|
description: "View and manage your tasks",
|
|
component: TasksWidget,
|
|
defaultWidth: 2,
|
|
defaultHeight: 2,
|
|
minWidth: 1,
|
|
minHeight: 2,
|
|
maxWidth: 4,
|
|
},
|
|
CalendarWidget: {
|
|
name: "CalendarWidget",
|
|
displayName: "Calendar",
|
|
description: "View upcoming events and schedule",
|
|
component: CalendarWidget,
|
|
defaultWidth: 2,
|
|
defaultHeight: 2,
|
|
minWidth: 2,
|
|
minHeight: 2,
|
|
maxWidth: 4,
|
|
},
|
|
QuickCaptureWidget: {
|
|
name: "QuickCaptureWidget",
|
|
displayName: "Quick Capture",
|
|
description: "Quickly capture notes and tasks",
|
|
component: QuickCaptureWidget,
|
|
defaultWidth: 2,
|
|
defaultHeight: 1,
|
|
minWidth: 2,
|
|
minHeight: 1,
|
|
maxWidth: 4,
|
|
maxHeight: 2,
|
|
},
|
|
AgentStatusWidget: {
|
|
name: "AgentStatusWidget",
|
|
displayName: "Agent Status",
|
|
description: "Monitor agent activity and status",
|
|
component: AgentStatusWidget,
|
|
defaultWidth: 2,
|
|
defaultHeight: 2,
|
|
minWidth: 1,
|
|
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,
|
|
},
|
|
TaskProgressWidget: {
|
|
name: "TaskProgressWidget",
|
|
displayName: "Task Progress",
|
|
description: "Live progress of orchestrator agent tasks",
|
|
component: TaskProgressWidget,
|
|
defaultWidth: 2,
|
|
defaultHeight: 2,
|
|
minWidth: 1,
|
|
minHeight: 2,
|
|
maxWidth: 3,
|
|
},
|
|
};
|
|
|
|
/**
|
|
* Get widget definition by name
|
|
*/
|
|
export function getWidgetByName(name: string): WidgetDefinition | undefined {
|
|
return widgetRegistry[name];
|
|
}
|
|
|
|
/**
|
|
* Get all available widgets as an array
|
|
*/
|
|
export function getAllWidgets(): WidgetDefinition[] {
|
|
return Object.values(widgetRegistry);
|
|
}
|
|
|
|
/**
|
|
* Check if a widget name is valid
|
|
*/
|
|
export function isValidWidget(name: string): boolean {
|
|
return name in widgetRegistry;
|
|
}
|