feat(kanban): Interactive Kanban board with real-time task tracking (#83)

* feat(kanban): add Kanban board with task-manager skill, modal UI, and desk clutter Implement a full Kanban board system for tracking agent tasks: - Add task-manager skill with shared JSON task store for persistence - Render board as a floating modal over the live 3D office (not immersive) - Auto-create tasks from actionable user messages with heuristic filtering - Sync task status through OpenClaw agent lifecycle events - Collapse task details panel by default, expand on card click - Add dynamic desk clutter (papers, folders, etc.) reflecting active task count - Exclude done tasks from desk clutter count - Extract KANBAN_CLUTTER_OFFSET for easy positioning adjustment - Add install flow with progress bar for the task-manager skill - Include unit and e2e test coverage Made-with: Cursor * feat(kanban): production-harden task board with AI-free classification, resilient persistence, and modal UX - Harden shared task store with atomic writes, payload size limits, and server-side enum validation - Add client resilience: request timeouts (AbortController), exponential backoff retries, poll deduplication - Implement optimistic UI with rollback on all card mutations (update, move, archive) - Add modal accessibility: focus trap, Escape to close, aria-modal, keyboard card navigation - Trust OpenClaw agent lifecycle phase=start as task classification signal instead of regex heuristics - Keep regex heuristic only as lightweight filter for direct chat events (conversational noise) - Expand verb recognition with typo tolerance and broader action vocabulary - Create tasks from agent runs even when no chat event is received (external channel support) - Merge dual header bars into single bar; reposition close button outside modal corner - Exclude done tasks from desk clutter count; make clutter position configurable via KANBAN_CLUTTER_OFFSET - Update default furniture layout to match user configuration - Ensure kanban_board furniture persists in local storage across sessions - Add comprehensive test coverage for store, API route, and controller logic Made-with: Cursor --------- Co-authored-by: iamlukethedev <lucas.guilherme@smartwayslfl.com>
2026-03-30 22:58:18 -05:00
parent 464a49bb6d
commit a997f13601
46 changed files with 5950 additions and 143 deletions
@@ -0,0 +1,60 @@
+"use client";
+
+import type { ComponentProps } from "react";
+import type { AgentState } from "@/features/agents/state/store";
+import { TaskBoardView } from "@/features/office/tasks/TaskBoardView";
+import type { TaskBoardCard, TaskBoardStatus } from "@/features/office/tasks/types";
+import type { CronJobSummary } from "@/lib/cron/types";
+
+export function TaskBoardPanel({
+  agents,
+  cardsByStatus,
+  selectedCard,
+  activeRuns,
+  cronJobs,
+  cronLoading,
+  cronError,
+  taskCaptureDebug,
+  onCreateCard,
+  onMoveCard,
+  onSelectCard,
+  onUpdateCard,
+  onDeleteCard,
+  onRefreshCronJobs,
+}: {
+  agents: AgentState[];
+  cardsByStatus: Record<TaskBoardStatus, TaskBoardCard[]>;
+  selectedCard: TaskBoardCard | null;
+  activeRuns: Array<{ runId: string; agentId: string; label: string }>;
+  cronJobs: CronJobSummary[];
+  cronLoading: boolean;
+  cronError: string | null;
+  taskCaptureDebug?: ComponentProps<typeof TaskBoardView>["taskCaptureDebug"];
+  onCreateCard: () => void;
+  onMoveCard: (cardId: string, status: TaskBoardStatus) => void;
+  onSelectCard: (cardId: string | null) => void;
+  onUpdateCard: (cardId: string, patch: Partial<TaskBoardCard>) => void;
+  onDeleteCard: (cardId: string) => void;
+  onRefreshCronJobs: () => void;
+}) {
+  return (
+    <TaskBoardView
+      title="Kanban"
+      subtitle="Manual tasks, inferred requests, and scheduled playbooks."
+      agents={agents}
+      cardsByStatus={cardsByStatus}
+      selectedCard={selectedCard}
+      activeRuns={activeRuns}
+      cronJobs={cronJobs}
+      cronLoading={cronLoading}
+      cronError={cronError}
+      taskCaptureDebug={taskCaptureDebug}
+      onCreateCard={onCreateCard}
+      onMoveCard={onMoveCard}
+      onSelectCard={onSelectCard}
+      onUpdateCard={onUpdateCard}
+      onDeleteCard={onDeleteCard}
+      onRefreshCronJobs={onRefreshCronJobs}
+    />
+  );
+}