## 1. Create SessionCard Component - [ ] 1.1 Create `apps/web/src/components/session-card.tsx` with 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.tsx` with 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