feat: add SessionLifecycleStatus component with bottom-overlay layout

- New SessionLifecycleStatus.vue: shows current hook lifecycle event
  with color-coded dot, event name, and detail text. Auto-detects
  mock vs real mode (falls back to demo cycle when no real data).
- Wrap lifecycle + UserInput + status-bar in .bottom-overlay container
  to eliminate fragile hardcoded pixel offsets in FloatingTranscriptDebug.
- Remove old agent-status-indicator square dot from status bar.
- Add lastHookEvent/lastHookDetail to client AgentSessionState type.
- Simplify idle-mode CSS: single .bottom-overlay rule replaces three
  separate show/hide rules for user-input, status-bar, lifecycle-ribbon.
This commit is contained in:
2026-02-21 03:29:15 -06:00
parent 2aec892f62
commit 07783f2aea
4 changed files with 285 additions and 89 deletions

View File

@@ -71,6 +71,8 @@ export interface AgentSessionState {
pendingApprovals: PendingApproval[]
terminal: AgentTerminalInfo
notifications: SessionNotification[]
lastHookEvent: string | null
lastHookDetail: string | null
}
// WS message types