Developer
caadd59441
Move the following audited-and-implemented changes into openspec/changes/archive/2026-06-12-completed-changes-archive/: - backend-frontend-refactoring - config-profile-git-mounts - config-profile-includes-ui - config-profile-multi-repo-mounts - container-monitoring-notifications - git-mount-url-validation - home-path-expansion - mobile-terminal-ux - mount-specificity-ordering - notification-center - persistent-terminal-sessions - session-list-overhaul - ssh-key-mounting - terminal-fullscreen-unified-header - tool-session-progress-and-updates Also regenerated .pi-map*.md files for openspec/changes so the remaining active changes (multi-session-terminal-ux, reorganize-long-files, working-copies, workspace-first-ui) reflect the new layout.
2.3 KiB
2.3 KiB
1. Create SessionCard Component
- 1.1 Create
apps/web/src/components/session-card.tsxwith session display and actions - 1.2 Implement status indicator with color coding (running=green, building=yellow, stopped=gray, error=red)
- 1.3 Display tool type name, session name, project/repo context
- 1.4 Add clone mode indicator and branch name when applicable
- 1.5 Implement action buttons: Open (running), Start (stopped), Stop (running), Delete (all)
- 1.6 Add confirmation dialogs for Stop and Delete actions
- 1.7 Handle loading states during actions
2. Create SessionList Component
- 2.1 Create
apps/web/src/components/session-list.tsxwith grouping logic - 2.2 Implement active sessions grouping (running, building, starting, probing)
- 2.3 Implement recent sessions grouping (stopped, error, limited to last 5)
- 2.4 Add section headers with counts
- 2.5 Handle empty states for each section
- 2.6 Support filtering by status
3. Update Dashboard Page
- 3.1 Import SessionCard and SessionList in dashboard.tsx
- 3.2 Replace existing session grid rendering with SessionList
- 3.3 Remove duplicated session rendering code
- 3.4 Ensure "Open sessions" section uses unified components
- 3.5 Ensure "Recent sessions" section uses unified components
4. Update Sessions Page
- 4.1 Import SessionCard and SessionList in sessions.tsx
- 4.2 Replace existing session list rendering with SessionList
- 4.3 Remove duplicated session rendering code
- 4.4 Keep page-level controls (create session button, filters)
- 4.5 Ensure "Last Session" section uses SessionCard
5. Styles and Polish
- 5.1 Add CSS styles for SessionCard layout (responsive grid)
- 5.2 Add CSS styles for action buttons (icon vs text based on viewport)
- 5.3 Style status indicators and badges
- 5.4 Ensure consistent spacing and typography
- 5.5 Test responsive layout on mobile viewport
6. Testing and Verification
- 6.1 Verify dashboard renders sessions correctly
- 6.2 Verify sessions page renders sessions correctly
- 6.3 Test action buttons (open, start, stop, delete)
- 6.4 Test confirmation dialogs
- 6.5 Test empty states
- 6.6 Test responsive layout
- 6.7 Run TypeScript compilation
- 6.8 Run ESLint