refactor: Split AgentBar into modular components with PromptBar chat flow

Browse Source

Extract 1226-line monolithic AgentBar.vue into focused components:
- types/agent.ts: shared types (Agent, AgentStatusState, ClaudeStatus, ConversationEntry)
- agent/FloatBubble.vue: bubble with all status/ejecutor animations, hold detection, recording audio bars
- agent/PromptBar.vue: floating panel with chat conversation, transcript, history
- agent/ChatInput.vue: reusable input row (text, mic, send, history buttons)
- agent/TranscriptCard.vue: typewriter transcription simulation
- agent/ResponseCard.vue: thinking dots + mock response
- agent/ConversationHistory.vue: scrollable mock history entries
- AgentBar.vue: thin orchestrator (~290 lines) keeping WebSocket + status logic

New interaction: click bubble opens PromptBar in text mode, hold opens in
recording mode with audio bar animation on the bubble. Spring enter/blur
exit animations on PromptBar. Text submit shows chat bubbles with mock
agent responses.

...

This commit is contained in:

josedario87

2026-02-15 19:33:29 -06:00

parent ffceb2efc2

commit 68edc01d44

8 changed files with 1741 additions and 1013 deletions

Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL

Download Patch File Download Diff File Expand all files Collapse all files

1091

frontend/src/components/AgentBar.vue

File diff suppressed because it is too large Load Diff