Skip to content

Server: Dashboard UI #13

Open
Open
Server: Dashboard UI#13
Labels
phase:serverPhase 4 — Server packagepriority:P1High priority

Description

@ggondim
ggondim
opened on Apr 10, 2026

Summary

Build the management dashboard UI: channel registration, visual route editor (ReactFlow), and threads/turns monitoring.

Tasks

Channel Registration

  • List registered channels with status (connected/disconnected)
  • Add channel wizard: select platform → enter credentials → test connection → save
  • Edit / delete channels
  • Show channel API key (masked by default, copy button)

Route Editor (ReactFlow)

  • Visual flow: channel nodes → criteria nodes → recipient nodes
  • Drag-and-drop route creation
  • Criteria configuration panel (channel, group, DM, thread, mention, sender, content pattern)
  • Priority ordering (drag to reorder)
  • Test route: simulate an inbound message → highlight matching routes

Threads & Turns Dashboard

  • List threads with filters (channel, target, date range, status)
  • Thread detail: chronological turn log with message content
  • Turn detail: raw envelope, A2H intent/response (if applicable), timestamps
  • Search across threads

Settings

  • Global configuration: default token TTL, trust layer toggle
  • Per-channel overrides

Acceptance Criteria

  • User can register a new Slack channel via the wizard and see it listed
  • User can create a route visually in ReactFlow and save it
  • Route test correctly highlights matching routes for a simulated message
  • Thread list is filterable and searchable
  • Thread detail shows full turn history
  • All CRUD operations reflect immediately in the UI

Dependencies

References

Activity

  1. ggondim
    added
    phase:serverPhase 4 — Server package
    priority:P1High priority
    on Apr 10, 2026

  2. claude commented on Apr 10, 2026

    @claude
    claudeBot
    on Apr 10, 2026 – with Claude

    @claude Implement this issue.

    • Base branch: meta/17
    • Target your PR to meta/17
    • Include fixes #13 in the PR body

  3. claude commented on Apr 10, 2026

    @claude
    claudeBot
    on Apr 10, 2026 – with Claude

    Claude finished @claude[bot]'s task in 13m 23s —— View job • claude/17-issue-13-20260410-2244 • Create PR ➔

    Implemented Dashboard UI

    • Gather context (read codebase, understand existing APIs and types)
    • Add dependencies (antd ^5.24, @ant-design/icons, @ant-design/nextjs-registry, @xyflow/react ^12)
    • Add settings API + update threads API (channelId now optional, added search)
    • Create typed API client helper (lib/api-client.ts)
    • Build dashboard layout (fixed sidebar with nav: Overview, Channels, Routes, Threads, Settings)
    • Build Channel Registration page (list, wizard, edit/delete, masked API key with copy button)
    • Build Route Editor page (ReactFlow canvas with channel/route/recipient nodes, criteria drawer, test route panel)
    • Build Threads & Turns dashboard (searchable list + thread detail with turn timeline)
    • Build Settings page (TTL presets, trust layer toggle, per-channel overrides)
    • Commit and push changes (17 files, +2738 lines)

    What was implemented

    New pages (/dashboard/*):

    Page Route Features
    Overview /dashboard Live stats: channel/route/thread counts
    Channels /dashboard/channels List + add wizard (platform → credentials → test → save), edit/delete, masked API key with eye/copy
    Routes /dashboard/routes ReactFlow visual flow + priority list + criteria drawer + test route matching
    Threads /dashboard/threads Filterable table (channel, search), click-to-detail
    Thread Detail /dashboard/threads/[id] Chronological turn timeline, A2H intent rendering, raw envelope collapse
    Settings /dashboard/settings Global TTL/trust-layer + per-channel overrides

    New API endpoints:

    • POST /api/routes/test — simulate inbound criteria → returns matching route IDs (used by "Test Route" panel)
    • GET /api/settings — read global settings from MongoDB
    • PUT /api/settings — update global settings

    Updated:

    • GET /api/threads — channelId is now optional; added search query param for full-text filtering
    • lib/db.ts — added listThreads(), getSettings(), updateSettings(), AppSettings, ChannelOverride types
    • Root page now redirects to /dashboard
    • Root layout wraps with AntdRegistry for proper Next.js SSR CSS handling

    |

  4. github-actions commented on Apr 10, 2026

    @github-actions
    github-actionsBot
    on Apr 10, 2026 – with GitHub Actions
    Contributor

    ⚠️ Task worker failed. View logs

    To retry with fix context, comment @claude fix on this issue.

  5. ggondim commented on Apr 10, 2026

    @ggondim
    ggondim
    on Apr 10, 2026
    ContributorAuthor

    @claude fix

  6. claude commented on Apr 10, 2026

    @claude
    claudeBot
    on Apr 10, 2026 – with Claude

    Claude finished @ggondim's task in 11m 54s —— View job • claude/17-issue-13-20260410-2321 • Create PR ➔

    Fixed Dashboard UI Implementation

    • Gather context (read CLAUDE.md, explore codebase, understand previous attempt)
    • Apply and fix implementation on current branch (17 files)
    • Key fixes vs. previous attempt:
      • Defined AppSettings/ChannelOverride types directly in api-client.ts (avoids importing from server-only lib/db.ts in client components)
      • Removed unused onConnect parameter from buildGraph in RouteFlowCanvas.tsx
      • Used proper HTML entity encoding (…, →) instead of JS string literals in JSX
    • Commit and push (17 files, +2755 lines)

    What was implemented

    New pages (/dashboard/*):

    Page Route Features
    Overview /dashboard Live stats: channel/route/thread counts
    Channels /dashboard/channels List + add wizard (platform → credentials → test → save), edit/delete, masked API key with eye/copy
    Routes /dashboard/routes ReactFlow visual flow + priority list + criteria drawer + test route matching
    Threads /dashboard/threads Filterable table (channel, search), click-to-detail
    Thread Detail /dashboard/threads/[id] Chronological turn timeline, A2H intent rendering, raw envelope collapse
    Settings /dashboard/settings Global TTL/trust-layer + per-channel overrides

    New API endpoints:

    • POST /api/routes/test — simulate inbound criteria → returns matching route IDs
    • GET /api/settings — read global settings from MongoDB
    • PUT /api/settings — update global settings

    Updated:

    • GET /api/threads — channelId now optional; added search query param
    • lib/db.ts — added listThreads(), AppSettings, ChannelOverride, getSettings(), updateSettings()
    • Root page redirects to /dashboard
    • Root layout wraps with AntdRegistry for proper Next.js SSR CSS handling

    • claude/17-issue-13-20260410-2321

  7. github-actions commented on Apr 10, 2026

    @github-actions
    github-actionsBot
    on Apr 10, 2026 – with GitHub Actions
    Contributor

    ❌ Fix agent also failed. View run — Manual intervention may be needed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    phase:serverPhase 4 — Server packagepriority:P1High priority

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions