Conversation
## Context Refactoring the core navigation and dashboard UI to introduce a unified sidebar layout for sessions, eliminating the disjointed `session-list` component. Additionally, enhancing the topology nodes and empty states with premium UI effects and proper typography. ## Changes ### Layout & Navigation - **`src/app/sessions/layout.tsx`**: Added global session layout with `SessionSidebar` support. - **`src/components/sessions/session-sidebar.tsx`**: Created sliding/collapsible sidebar for persistent chat switching. - **`src/app/sessions/page.tsx`**: Updated to match the new sidebar navigation structure. - **`src/components/sessions/session-list.tsx`** (DELETED): Subsumed by the new sidebar architecture. - **`src/components/sessions/new-session-dialog.tsx`** (DELETED): Logic integrated directly into the sidebar flow. ### Premium UI Enhancements - **`src/components/topology/agent-node.tsx` & `cron-node.tsx`**: Enhanced with glassmorphism, responsive hover states, and dynamic status-based visual rings. - **`src/components/ui/empty-state.tsx`**: Upgraded empty states with premium gradients, subtle scaling animations, and better typographic hierarchy. - **`src/components/ui/textarea.tsx`**: Integrated standard textarea component for text inputs. - **`src/app/page.tsx`, `activity/page.tsx`, `system/page.tsx`**: Applied updated page container wrappers for better padding and aesthetic consistency. - **`src/components/activity/event-card.tsx`**: Styling refinements for event log readability. - **`src/components/sessions/controls-bar.tsx`**: Refined input controls and gated button styling for the chat interface.
## Context Implemented the core Agent Orchestration UI to cleanly render complex agent interactions. The UI now intelligently maps raw tRPC gateway messages into specific semantic components (tools, delegations, reasoning, and human-in-the-loop approvals) instead of dumping them as monolithic string blocks. ## Changes ### Core Rendering - **`src/lib/normalize-content.ts`**: Introduced `ParsedEvent` domain models and regex/AST logic to parse raw `Message` blocks into structured `ParsedEvent` arrays. - **`src/components/sessions/transcript.tsx`**: Refactored the main message loops to iterate over `ParsedEvent`s, branching gracefully via `EventRenderer`. ### Component Library - **`src/components/sessions/orchestration/sub-agent-delegation-block.tsx`**: Visually bounds recursive agent handoffs. - **`src/components/sessions/orchestration/deep-thought-block.tsx`**: Accordions extensive agent reasoning. - **`src/components/sessions/orchestration/tool-execution-card.tsx`**: Formats functional tool execution arguments and results. - **`src/components/sessions/orchestration/hitl-approval-card.tsx`**: Prepares interactive UI mapping for gateway human-in-the-loop approval workflows. ### Layout State - **`src/components/sessions/session-workspace.tsx`**: Embedded the `ActiveContextPanel` to statically derive the currently executing tool or uncompleted delegation event directly from recent transcript streaming data. - **`src/app/sessions/[key]/page.tsx`**: Refactored data fetching and workspace prop passing to support Active Context states. ## Documentation - **`specs/003-agent-orchestration-ui.md`**: Spec summary documentation. - **`specs/003-agent-orchestration-ui/`**: All feature design artifacts (plan, spec, model, tasks).
## Context Checking in the local agent configuration, skills, rules, MCP settings, and initial design documents for the OpenClaw architecture to ensure environment consistency across development setups. ## Changes ### Tools & Configuration - ** & **: Checked in skill definitions for crawl, extract, research, and search capabilities. - ** & **: Additional system rules and agentic instructions for consistent AI interactions. - ****: Checked in Model Context Protocol configuration for tool server integration. - ****: Lockfile for maintaining deterministic skill versions. ### Documentation - ****: Added technical design plan for the OpenClaw fresh installation schema.
Role & ContextYou are an expert Next.js, React, and OpenClaw engineer conducting a strict Pull Request review for the 003-agent-orchestration-ui branch. Pull Request BackgroundThis PR upgrades the Claw Dash application from a linear text chatbot to an orchestration-aware command center capable of handling specialized payload types (agent delegations, reasoning, tool execution, and human-in-the-loop approvals). Raw tRPC string streams are now parsed into typed arrays and dispatched through an EventRenderer inside the transcript. An ActiveContextPanel statically derives the currently running background operations. Core Implementation Files to AuditReview the diff of the following source files modified or created in this PR:
Review Directives
Output FormatPlease provide a structured PR review outputting immediately actionable feedback. If you find architectural flaws, type safety bugs, or unfinished specification requirements, flag them under a Blocking Issues header. For minor improvements or nitpicks (like CSS refactoring), group them under Suggestions. Finally, append a conclusive Ready for Merge? (Yes/No) verdict. |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: bdc6cc8657
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
Agent Orchestration UI
Overview
This PR implements the core orchestration UI features defined in
specs/003-agent-orchestration-ui. It upgrades the Claw Dash application from a linear text interface to a robust, orchestration-aware command center capable of tracing tool executions, delegation, deep reasoning, and approval states.Key Additions
Orchestration Components
<SubAgentDelegationBlock>: Visually tracks and scopes recursive agent handoffs.<DeepThoughtBlock>: Formats extended agent reasoning streams in an accordion component.<ToolExecutionCard>: Surfaces tool executions, inputs, and results.<HitlApprovalCard>: Provides interactivity mapping for gateway human-in-the-loop approvals.Core Logistics & State
ParsedEventdomain models and AST/regex payload mappers insidenormalize-content.ts.transcript.tsxmessage loop to renderParsedEventarrays.ActiveContextPanelto natively derive executing operations and active sub-agents directly from streaming history inputs.Refactors
session-listpane in favor of a cohesive, slide-out globalSessionSidebarnavigation architecture.