feat(ui): desktop Command Center layout#317
Conversation
dimakis
left a comment
There was a problem hiding this comment.
Centaur Review
Found 7 issue(s) (3 warning).
frontend/src/components/ActiveSessionsList.tsx
Solid layout refactor moving Inbox/Telos/Tasks into a right-panel Command Center. Main issues: double navigation bug in ActiveSessionsList, missing tests for all new components (TDD required), and intentional(?) removal of context blocks feature deserves confirmation.
- 🟡 bugs (L80): Double navigation:
onSelectSession(sessionId)already callsnavigate('/chat/${id}')in the parentDesktopChatView.handleSelectSession. Callingnavigateagain here triggers a redundant React Router transition. Remove the localnavigatecall (and theuseNavigateimport) since the parent handles routing.[fixable]
frontend/src/pages/DesktopChatView.tsx
Solid layout refactor moving Inbox/Telos/Tasks into a right-panel Command Center. Main issues: double navigation bug in ActiveSessionsList, missing tests for all new components (TDD required), and intentional(?) removal of context blocks feature deserves confirmation.
- 🟡 regressions: Context blocks feature removed without replacement. The old DesktopChatView maintained
contextBlocksstate, wired toContextPanel, and passed asexternalContextBlockstoChatInput. The new CommandCenter does not surface context block selection anywhere, so desktop users lose the ability to attach context blocks to chat messages. Verify this is intentional.
frontend/src/components/CommandCenter.tsx
Solid layout refactor moving Inbox/Telos/Tasks into a right-panel Command Center. Main issues: double navigation bug in ActiveSessionsList, missing tests for all new components (TDD required), and intentional(?) removal of context blocks feature deserves confirmation.
- 🟡 missing_tests: No tests for any of the 6 new components (CommandCenter, ActiveSessionsList, CollapsibleSection, InboxSection, TelosSection, TaskBoardSection) or the modified SessionPanel. The project requires TDD per CLAUDE.md. At minimum, CollapsibleSection (localStorage persistence logic), InboxSection (optimistic removal pattern), and the ActiveSessionsList (filtering logic) should have unit tests.
[fixable]
frontend/src/components/TaskBoardSection.tsx
Solid layout refactor moving Inbox/Telos/Tasks into a right-panel Command Center. Main issues: double navigation bug in ActiveSessionsList, missing tests for all new components (TDD required), and intentional(?) removal of context blocks feature deserves confirmation.
- 🔵 style (L25): Prop
activeSessionIdis immediately aliased to_activeSessionIdand never used. Either remove the prop fromTaskBoardSectionPropsand the parent, or use it (e.g., to highlight the active session's tasks). Unused underscore-prefixed props suggest an incomplete implementation.[fixable] - 🔵 style (L58):
handleAddChildis a no-op callback (() => {}). TaskNode's add-child button will render but do nothing on click — a silent failure. Consider either hiding the add-child affordance via a prop (e.g.,showAddChild={false}) or navigating to the full task board page.[fixable]
frontend/src/components/DesktopNav.tsx
Solid layout refactor moving Inbox/Telos/Tasks into a right-panel Command Center. Main issues: double navigation bug in ActiveSessionsList, missing tests for all new components (TDD required), and intentional(?) removal of context blocks feature deserves confirmation.
- 🔵 style (L14): Comment
// Inbox, Telos, and Tasks now live in the right-panel Command Center.describes the current task rather than a non-obvious constraint. Per project conventions, default to no comments — this context belongs in the PR description.[fixable]
frontend/src/components/InboxSection.tsx
Solid layout refactor moving Inbox/Telos/Tasks into a right-panel Command Center. Main issues: double navigation bug in ActiveSessionsList, missing tests for all new components (TDD required), and intentional(?) removal of context blocks feature deserves confirmation.
- 🔵 unsafe_assumptions (L37): The
useEffectcallssetPendingRemovals(scheduling a state update) then immediately reads the stalependingRemovalsclosure value to filteritems. On the first render after store changes, items may briefly include entries that should be hidden by pending removals. The effect self-corrects on the next cycle (sincependingRemovalsis a dependency), but the intermediate state is visible. Consider computing the filtered list inside thesetPendingRemovalsupdater or using a ref for pending removals.[fixable]
| const handleTap = useCallback( | ||
| (sessionId: string) => { | ||
| onSelectSession(sessionId); | ||
| navigate(`/chat/${sessionId}`); |
There was a problem hiding this comment.
🟡 bugs: Double navigation: onSelectSession(sessionId) already calls navigate('/chat/${id}') in the parent DesktopChatView.handleSelectSession. Calling navigate again here triggers a redundant React Router transition. Remove the local navigate call (and the useNavigate import) since the parent handles routing. [fixable]
|
|
||
| export function TaskBoardSection({ activeSessionId: _activeSessionId }: TaskBoardSectionProps) { | ||
| const { | ||
| loading, |
There was a problem hiding this comment.
🔵 style: Prop activeSessionId is immediately aliased to _activeSessionId and never used. Either remove the prop from TaskBoardSectionProps and the parent, or use it (e.g., to highlight the active session's tasks). Unused underscore-prefixed props suggest an incomplete implementation. [fixable]
| const handleAddChild = useCallback(() => { | ||
| // Not supported in sidebar compact view | ||
| }, []); | ||
|
|
There was a problem hiding this comment.
🔵 style: handleAddChild is a no-op callback (() => {}). TaskNode's add-child button will render but do nothing on click — a silent failure. Consider either hiding the add-child affordance via a prop (e.g., showAddChild={false}) or navigating to the full task board page. [fixable]
| const { inboxCount, todoCount } = useTabBadges(); | ||
|
|
||
| // Inbox, Telos, and Tasks now live in the right-panel Command Center. | ||
| // Only Chat, Calendar, and Files remain as nav-routed pages. |
There was a problem hiding this comment.
🔵 style: Comment // Inbox, Telos, and Tasks now live in the right-panel Command Center. describes the current task rather than a non-obvious constraint. Per project conventions, default to no comments — this context belongs in the PR description. [fixable]
| const pruned = new Set<string>(); | ||
| for (const f of prev) { | ||
| if (serverFilenames.has(f)) pruned.add(f); | ||
| } |
There was a problem hiding this comment.
🔵 unsafe_assumptions: The useEffect calls setPendingRemovals (scheduling a state update) then immediately reads the stale pendingRemovals closure value to filter items. On the first render after store changes, items may briefly include entries that should be hidden by pending removals. The effect self-corrects on the next cycle (since pendingRemovals is a dependency), but the intermediate state is visible. Consider computing the filtered list inside the setPendingRemovals updater or using a ref for pending removals. [fixable]
Replace ContextPanel + FileBrowserPanel with a three-section Command Center (Inbox, Telos, TaskBoard) that stays visible alongside chat. Left panel: add Active/All session view toggle with attention-tiered session cards ported from the iOS SessionOverview component. Right panel: collapsible Inbox (agent proposals), Telos (strategic tasks with tier grouping), and TaskBoard (session-scoped execution) sections replace the old context blocks and file browser. DesktopNav: remove Inbox/Telos/Tasks nav items (now in right panel), keep Chat/Calendar/Files as route-navigated pages. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Remove double navigation in ActiveSessionsList (onSelectSession already navigates) - Remove unused activeSessionId prop from TaskBoardSection and CommandCenter - Make onAddChild optional on TaskNode; hide add-child button when no handler - Replace what-comment in DesktopNav with why-comment - Fix stale closure in InboxSection useEffect by splitting into two effects Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
e4a060e to
01059e3
Compare
Summary
@picker in ChatInput (service unchanged)New Components
CommandCenter.tsx— container for the three right-panel sectionsCollapsibleSection.tsx— reusable collapsible header with badgeInboxSection.tsx— compact inbox with approve/dismiss/start-sessionTelosSection.tsx— tier-grouped tasks (Focus/Active/Seen) with profile filterTaskBoardSection.tsx— session-scoped task tree with compact loop controlsActiveSessionsList.tsx— attention-tiered session cards for left panelModified
SessionPanel.tsx— view mode toggle + active sessions listDesktopChatView.tsx— swap right panel, remove ContextPanel/FileBrowserPanelDesktopNav.tsx— trim to Chat/Calendar/Filesdesktop.css— command center + active sessions styling (~460 new lines)Test plan
@picker in chat input still works🤖 Generated with Claude Code