## ADDED Requirements ### Requirement: Session card displays session information The system SHALL display each session in a card format showing: - Tool type name and icon - Session display name or generated name - Project and repository name - Current status with visual indicator - Clone mode indicator (if clone mode) - Port number (if applicable) - Created time #### Scenario: View active session card - **WHEN** user views the sessions list - **THEN** each running session card shows a green status indicator - **AND** the card displays the tool type name - **AND** the card displays the project and repository names - **AND** the card displays the port number #### Scenario: View stopped session card - **WHEN** user views the sessions list - **THEN** each stopped session card shows a gray status indicator - **AND** the card does not display a port number - **AND** the card shows when it was last active #### Scenario: View clone mode session card - **WHEN** user views a clone-mode session - **THEN** the card displays a clone indicator - **AND** the card shows the branch name (if applicable) ### Requirement: Session card provides control actions The system SHALL provide action buttons on each session card: - Running sessions: Open (primary), Stop, Delete - Stopped sessions: Start (primary), Delete - Building/Starting sessions: Show progress indicator, no actions - Error sessions: Show error state, Delete #### Scenario: Open running session - **WHEN** user clicks the "Open" button on a running session card - **THEN** the session opens in the appropriate interface (web, terminal, IDE) #### Scenario: Stop running session - **WHEN** user clicks the "Stop" button on a running session card - **THEN** a confirmation dialog appears - **AND** upon confirmation, the session stops #### Scenario: Start stopped session - **WHEN** user clicks the "Start" button on a stopped session card - **THEN** the session starts - **AND** the card updates to show building/starting status #### Scenario: Delete session - **WHEN** user clicks the "Delete" button on any session card - **THEN** a confirmation dialog appears - **AND** upon confirmation, the session is deleted - **AND** the card is removed from the list immediately ### Requirement: Session list supports grouping and filtering The system SHALL group sessions by status category: - Active: running, building, starting, probing - Recent: stopped, error (limited to last 5) - The list SHALL support filtering by status #### Scenario: View grouped sessions - **WHEN** user views the sessions page - **THEN** active sessions appear in an "Active" section - **AND** recent stopped sessions appear in a "Recent" section - **AND** each section has a clear heading with count ### Requirement: Unified components across pages The system SHALL use the same SessionCard and SessionList components on both the dashboard and sessions pages. #### Scenario: Dashboard uses unified components - **WHEN** user views the dashboard home page - **THEN** the session grid uses SessionCard components - **AND** the visual style matches the sessions page #### Scenario: Sessions page uses unified components - **WHEN** user views the sessions page - **THEN** the session list uses SessionList and SessionCard components - **AND** the visual style matches the dashboard ## MODIFIED Requirements ### Requirement: Sessions page layout **FROM:** Sessions page renders sessions with page-specific layout and styling **TO:** Sessions page uses SessionList component with consistent layout and styling #### Scenario: Sessions page renders unified list - **WHEN** user navigates to the sessions page - **THEN** the page uses the SessionList component - **AND** sessions are displayed in a card grid - **AND** each card has consistent control actions