rasimme/FlowBoard

This system is a React-based dashboard for managing AI agent projects, featuring a Kanban task board, a Markdown canvas for ideas, and a customizable overview with live widgets. It enforces security through agent identity validation and strict file access controls, while integrating with Telegram WebApps for authentication and haptic feedback. The platform supports project context injection for agents and provides tooling for release validation and visual regression testing.

Two new Node.js scripts have been added to the dashboard tools to automate quality checks for the overview layout. The \ov-audit.mjs\ script renders all widget types at specified dimensions and uses Puppeteer to detect visual regressions such as content overflow, hard-clipped elements, and excessive empty space. The \ov-resize-probe.mjs\ script simulates user interaction by dragging a widget's resize handle in edit mode, capturing DOM state snapshots to verify that the underlying grid library correctly updates item dimensions and cell containment during resizing.

dashboard/tools · high confidence

The dashboard now includes a set of new core modules that establish the application's identity, security, and data integrity foundations. Agent identity validation is enforced via \agent-identity.js\, which validates agent IDs against a known list and rejects ephemeral or reserved identifiers. Security is hardened with \audit-log.js\ for append-only logging of destructive actions and \file-visibility.js\ to restrict the file editor to a knowledge-layer allowlist (Markdown files only). Data integrity is improved with \bundle-freshness.js\ to warn when the served UI is stale, \dashboard-snapshot.js\ to build a consistent read model, and \content-hygiene-doctor.js\ to detect mojibake and transliteration errors. Additionally, \canvas-placement.js\ provides collision-free auto-placement for canvas notes, and \flowboard-metadata.js\ initializes the SQLite tables for projects, agents, and migrations.

dashboard · high confidence

The templates directory is updated to support the new project-mode v2.0, shifting from local file-based state to an API-first architecture. A new PROJECT-RULES.md template enforces that all task and project state mutations occur via the FlowBoard API (e.g., /api/projects, /api/status) rather than direct file edits, establishing the API as the single source of truth. This includes mandatory workflows for task management (open → in-progress → review → done), subtask handling, and the 'Canvas to Task' promotion flow via the Specify Stepper. Supporting templates have been added or updated: spec.md defines the new spec file structure; PROJECT.md is refactored to include Scope and Operational State sections while removing the legacy Session Log; and legacy files like todo.md are removed. Additionally, new deployment templates are provided for Cloudflare Tunnel configuration (cloudflare-config.yml, cloudflared-tunnel.service) and systemd service management (flowboard-dashboard.service, systemd-auth.conf.example), alongside an updated env.example that reflects new authentication and webhook requirements.

templates · high confidence

The Tasks, Files, Canvas, and Overview pages have been rewritten in React, replacing the previous vanilla JavaScript implementations. This migration introduces persistent Kanban view state (scroll position and expanded subtasks) per project, a new drag-and-drop interface for task reordering with custom sorting modes, a master-detail file browser with an allowlist for editable files, a canvas with per-project viewport persistence and a minimap, and a customizable Overview landing page with a drag-and-resize grid layout and a catalog of live widgets.

dashboard/src/pages · high confidence

A new FlowBoard plugin has been added to OpenClaw that registers a 'project-context' hook during agent bootstrap. This hook live-injects the active FlowBoard project context before every agent run, enabling agents to access project-specific workspace and dashboard information dynamically.

openclaw · high confidence

The Overview page now serves as the default landing view, featuring a registry of 27 live widgets including Active Agents, Task Stats, Milestones, GitHub CI/PRs, and File Viewer. These widgets provide real-time project insights, support drag-and-resize layout editing, and allow inline configuration such as GitHub token entry and milestone management.

dashboard/src/components/overview · high confidence

The dashboard now uses a unified design system defined in the new \dashboard.css\, introducing a comprehensive palette of CSS variables (including hue tokens for agents, canvas, and charts) and a consistent dark theme. The Idea Canvas (\canvas.css\) has been restyled with outline-only note cards, a dot-pattern background, and a floating toolbar, while the Overview (\overview.css\) implements a 12-col widget grid with specific styles for task stats and active agents.

dashboard/styles · high confidence

The dashboard now includes a suite of new utility modules in src/utils to support recent feature work. activeAgents.js provides logic to group, deduplicate, and display active agent claims and lease health in the UI. adaptivePoll.mjs introduces a dependency-injected scheduler for polling loops with visibility-aware backoff. apiFetch.js centralizes API calls, adding Telegram WebApp auth support, request timeouts, and strict validation to reject external URLs. appUpdate.mjs and canvasMigration.mjs handle in-dashboard self-updates and canvas data migration respectively. Canvas-related modules (canvasConstants, canvasGeometry, canvasGraph, canvasMarkdown, canvasTextFormat) extract and harden vanilla canvas logic, including a secure markdown renderer that prevents XSS. contextSort.js adds sorting for the Context Index widget, and dashboardApi.js introduces robust validation for API payloads.

dashboard/src/utils · high confidence

This update introduces a suite of new React components that form the foundation of the updated dashboard interface. It adds core UI atoms and molecules including Button, Card, Alert, Badge, Checkbox, DataList, and Spinner, alongside specialized elements like AgentChip for agent identity visualization and BlockedChip for task status. The ActiveAgentsBar component provides a new way to monitor agent activity, displaying lease health, task progress, and relative timestamps. Additionally, the ClaimStateLine component visualizes task claim states and lease health, while the AttentionWarning banner consolidates stale lease notifications. The CreateProjectModal now supports folder selection and dashboard preset suggestions, and the DeletedProjectsTrash component introduces a sidebar trash bin for restoring hard-deleted projects.

dashboard/src/components · high confidence

The dashboard now uses a dedicated React-owned store (appStore) with a Proxy-backed window.appState to ensure consistent state updates and notifications. A new appStateBridge centralizes task data access and refresh logic, while dedicated modules (taskMutations, canvasMutations, authState, connectionState) provide robust, race-condition-resistant handling for task and canvas operations, authentication circuit breaking, and connection status tracking.

dashboard/src/state · high confidence

The dashboard now includes three new React hooks to enhance user interaction and state management. The \useCustomScroll\ hook provides a custom, draggable scrollbar UI for scrollable elements, replacing native scrollbars. The \useHaptic\ hook integrates Telegram WebApp haptic feedback (vibrations for light, medium, heavy impacts and notifications) into the app, providing tactile feedback on supported devices while remaining a no-op elsewhere. Additionally, the \useTaskActions\ hook centralizes task coordination primitives (claim, release, complete, route, update status/priority, and work state updates) by wrapping the underlying mutation logic, ensuring stable callbacks for components like the DetailPanel.

dashboard/src/hooks · high confidence

A new \project-context\ hook has been added to live-inject the active project's bootstrap data (identity, rules manifest, task state, and PROJECT.md) into the agent's context on every run via the \agent:bootstrap\ event. The hook derives the canonical agent ID from the workspace directory, resolves the active project from the FlowBoard API (\flowboard\_agents\ DB), and builds the document in memory without writing to disk. It includes resilience features like retry logic for transient API failures and an opt-in legacy file fallback for migration windows, ensuring the agent always sees the current project state.

hooks · high confidence

This change introduces a suite of new scripts in the \scripts/\ directory to support the v5 release. \capture-v5-gif.mjs\ and \capture-v5-screenshots.mjs\ automate the generation of demo media by launching a headless browser, navigating the v5 dashboard, and capturing frames; the GIF script specifically anonymizes the sidebar to prevent real project names from leaking. Release integrity is enforced by \clawpack-gate.mjs\ (validating the ClawHub package), \plugin-lint.mjs\ (checking plugin structure and forbidden patterns), \privacy-scan.mjs\ (scanning for secrets and private data), and \release-check.mjs\ (orchestrating these checks and enforcing a main-branch-only release workflow). Finally, \release-install-canary.mjs\ validates that the packaged plugin installs and registers correctly in a clean environment.

scripts · high confidence

The canvas UI components (minimap, toolbar, connection layer, note card, and sidebar) have been rewritten in React. This introduces a floating toolbar for formatting and note properties, a minimap with zoom controls, and a CodeMirror-based MarkdownEditor for both inline card editing and the full-text sidebar. The migration also fixes a bug where sidebar edits were lost on outside-click by deduplicating save events.

dashboard/src/components/canvas · high confidence

The dashboard now uses a single source of truth for top-level navigation views, defined in the new \views.js\ configuration file. This registry explicitly maps four views—Overview, Ideas, Tasks, and Files—to their respective React components (OverviewView, CanvasView, TasksView, FilesView) using lazy loading. This change consolidates view definition and removes the previous legacy ownership split, ensuring that the ViewShell renders these specific React components into the main content area.

dashboard/src/config · high confidence

The dashboard application has been rebuilt using React, introducing a new component hierarchy (App, DashboardShell, Header, Sidebar, TabBar, ViewShell, DetailPanel) and a context-based state management system (AppStateProvider, DashboardProvider, NavigationProvider, SpecifyProvider). A new bootstrap process initializes the application by installing a Proxy-based state store, resolving agent identity, and handling Telegram WebApp authentication before the React tree mounts. This migration includes a unified CSS theme contract, a preflight reset for consistent styling, and a dedicated connection state UI to handle API failures and retries, replacing the previous legacy implementation.

dashboard/src · high confidence

The dashboard now uses dedicated React context providers to manage application state and user interactions. AppStateContext bridges the global app store into React using useSyncExternalStore for efficient re-renders. DashboardContext centralizes API fetching, connection state, and polling logic with rate-limit resilience. NavigationContext replaces imperative global window objects with deterministic cross-view navigation intents (e.g., scrolling to tasks or notes). SpecifyContext manages the task specification stepper flow, handling session state and post-completion data refreshes.

dashboard/src/context · high confidence

The dashboard and root project manifests have been updated to version 5.2.1, establishing a new dependency baseline. Key upgrades include React 19.2.4, Express 5.2.1, and Vite 8.1.0, alongside the addition of the hzl-core package (3.2.0) and the @codemirror suite for editor functionality. The dashboard package.json also introduces overrides for body-parser, qs, and other transitive dependencies to ensure compatibility.

(dependencies) · high confidence

Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.

• CAI 39 → 44 (+5.3)
• Rubric changed (rubric-2026.08.19 → rubric-2026.09.15) — scores are not directly comparable.

• Code Health 37 → 34 (-2.2)
• Architecture 97 → 98 (+1.3)
• Maturity 73 → 78 (+5.6)
• Readiness 23 → 39 (+15.6)
• Security 77 → 80 (+2.9)
• Accessibility 49 → 48 (-1.4)

• (anonymous) (cognitive 21) (dashboard/server.js)
• (anonymous) (cognitive 22) (dashboard/server.js)
• (anonymous) (cognitive 25) (dashboard/hzl-service.js)
• (anonymous) (cognitive 29) (dashboard/overview.js)
• (anonymous) (cognitive 31) (dashboard/server.js)
• (anonymous) (cognitive 36) (dashboard/server.js)
• (anonymous) (cognitive 38) (dashboard/overview.js)
• (anonymous) (cognitive 92) (dashboard/server.js)
• (anonymous) (cyclomatic 18) (dashboard/server.js)
• (anonymous) (cyclomatic 21) (dashboard/hzl-service.js)
• (anonymous) (cyclomatic 22) (dashboard/overview.js)
• (anonymous) (cyclomatic 23) (dashboard/server.js)
• (anonymous) (cyclomatic 33) (dashboard/server.js)
• (anonymous) (cyclomatic 36) (dashboard/overview.js)
• (anonymous) (cyclomatic 68) (dashboard/server.js)
• ADR not followed: ADR-0002: /api/status requires an explicit agentId (docs/adr/0002-api-status-requires-agent-id.md)
• Change coupling: Button.jsx ↔ Input.jsx (dashboard/src/components/Button.jsx)
• Change coupling: overview.js ↔ test-overview-api.js (dashboard/overview.js)
• Dependency hygiene not measured — dependency manifest found but not parsed for hygiene
• FileTooLong: dashboard/test-dashboard-shell.js (dashboard/test-dashboard-shell.js)
• …and 156 more

• (anonymous) (cognitive 118) (dashboard/server.js)
• (anonymous) (cognitive 131) (dashboard/server.js)
• (anonymous) (cognitive 16) (dashboard/server.js)
• (anonymous) (cognitive 16) (dashboard/server.js)
• (anonymous) (cognitive 18) (dashboard/server.js)
• (anonymous) (cognitive 23) (dashboard/server.js)
• (anonymous) (cognitive 27) (dashboard/server.js)
• (anonymous) (cognitive 32) (dashboard/server.js)
• (anonymous) (cognitive 35) (dashboard/server.js)
• (anonymous) (cognitive 38) (dashboard/server.js)
• (anonymous) (cyclomatic 16) (dashboard/server.js)
• (anonymous) (cyclomatic 17) (dashboard/server.js)
• (anonymous) (cyclomatic 24) (dashboard/server.js)
• (anonymous) (cyclomatic 24) (dashboard/server.js)
• (anonymous) (cyclomatic 26) (dashboard/server.js)
• (anonymous) (cyclomatic 28) (dashboard/server.js)
• (anonymous) (cyclomatic 34) (dashboard/server.js)
• (anonymous) (cyclomatic 83) (dashboard/server.js)
• (anonymous) (cyclomatic 93) (dashboard/server.js)
• ActiveAgentsBar.ActiveAgentPill (cognitive 19) (dashboard/src/components/ActiveAgentsBar.jsx)
• …and 521 more

• 177 commits — 93 feature/other, 84 fixes

• dashboard/src — 53 commits
• (root) — 16 commits
• docs/reference — 11 commits
• dashboard/hzl-service.js — 10 commits
• dashboard/server.js — 9 commits
• (repo) — 7 commits
• dashboard/package.json — 6 commits
• docs/concepts — 6 commits
• dashboard/test-setup-linux-systemd.mjs — 5 commits
• dashboard/package-lock.json — 4 commits
• dashboard/project-bundle-import-preview.js — 3 commits
• .github/workflows — 2 commits
• dashboard/governance.js — 2 commits
• dashboard/host-utils.js — 2 commits
• dashboard/project-bundle-export.js — 2 commits
• dashboard/rate-limiter.js — 2 commits
• dashboard/styles — 2 commits
• dashboard/test-t447-3-policy-exceptions.js — 2 commits
• dashboard/test-work-state-poll-race-e2e.js — 2 commits
• docs/adr — 2 commits

• fix: Revert "docs: compile unreleased changelog"
• fix: T-440: Fix fatal auth Retry and add E2E assertion
• fix: fix(T-441): close auth security review gaps
• fix: fix(T-441): close final security review findings
• fix: fix(T-441): install privacy filter and validate agentId on /api/auth
• fix: fix(T-441): verify trusted proxy before CF rate keys
• fix: fix(T-443): close backend work-state review findings
• fix: fix(T-443): reject invalid scheduler datetimes
• fix: fix(T-443): scope stuck routing to active claims
• fix: fix(T-443-3): add transient stuck indicator actions
• fix: fix(T-443-4): close frontend high re-review findings
• fix: fix(T-443-4): close frontend work-state review findings
• fix: fix(T-443-5): close final no-go gaps
• fix: fix(T-443-5): finish integration threshold and coverage docs
• fix: fix(T-445): close auth and files lane review gaps
• fix: fix(T-445): close stale Files and auth race gaps
• fix: fix(T-445): ignore domain 403s in auth breaker
• fix: fix(T-446): close active agents review gaps
• fix: fix(T-447-2): route exported task creation through policy
• fix: fix(T-447-3): harden policy exception boundaries
• …and 157 more

Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.

rasimme/FlowBoard was measured the same way every project in this corpus was: the same rubric, at a pinned commit, with the result published in full. Point a surveyor at a repository you know and see whether you agree with it.