| 1 | # Chat Components DOX |
| 2 | |
| 3 | ## Purpose |
| 4 | |
| 5 | - Own chat composer, attachments, message queue, navigation, and top-section component groups. |
| 6 | |
| 7 | ## Ownership |
| 8 | |
| 9 | - `input/` owns composer input, progress, banners, and bottom action bars. |
| 10 | - `attachments/` owns drag/drop and attachment preview UI. |
| 11 | - `message-queue/` owns queued message display and store state. |
| 12 | - `navigation/` owns chat navigation state. |
| 13 | - `top-section/` owns chat header/top area. |
| 14 | - `model-gate-store.js` and `model-setup-gate.html` own the deferred in-thread model setup gate. |
| 15 | |
| 16 | ## Local Contracts |
| 17 | |
| 18 | - Preserve Store Gating for all store-backed chat components. |
| 19 | - Use shared API, WebSocket, notification, and attachment helpers where available. |
| 20 | - Do not bypass CSRF or WebSocket state-sync expectations. |
| 21 | - The shared composer can be mounted on the Welcome screen with no selected chat; sending from that state must create and select a chat context before dispatch. |
| 22 | - Text-only and attachment sends must render the first user turn immediately with the request message ID so the backend log merges into the same row. |
| 23 | - Unsent composer text is kept as a separate browser-session draft for each selected chat and restored when switching contexts; a Welcome-screen prompt must follow the chat created for its first send. |
| 24 | - Composer text uses the main UI font by default; typing a triple-backtick fence and pressing Enter turns that line into a visual code block that serializes back to fenced Markdown, while pasted fenced Markdown stays plain text. |
| 25 | - Missing model setup is gated at send intent: the first unconfigured send renders an in-thread setup card, keeps the pending prompt in browser session storage for refresh recovery, and must not call `/message_async` until a chat model is configured. |
| 26 | - While the setup gate is open, the composer remains typeable but send is blocked until setup succeeds. |
| 27 | - The setup gate must delegate Cloud/Local setup, account connections, and advanced model configuration to the existing onboarding and model-preset editor modals; do not duplicate provider/model/key forms inline. |
| 28 | - A connected OAuth account without Main/Utility model selection is its own gate state; route to model configuration and do not select models automatically. |
| 29 | - Model setup surfaces that change readiness must notify the gate with `model-setup-changed`, `model-configured`, or an existing modal/onboarding completion signal so the pending prompt can retry automatically. |
| 30 | - The top-section project selector, clock, and connection indicator must respect the instance-level mobile/desktop visibility preferences. |
| 31 | - While the selected context is running, an empty composer makes the primary button stop the active run; typed text still adds to the queue, and Enter with an empty composer still sends queued messages. |
| 32 | - Chat navigation controls must cross virtual message-window boundaries; top and bottom target the full cached history rather than only the mounted DOM slice. |
| 33 | - The page-wide attachment drop overlay must activate only for external file drags so internal WebUI drag interactions keep their own targets. |
| 34 | |
| 35 | ## Work Guidance |
| 36 | |
| 37 | - Keep composer and attachment changes responsive across desktop and mobile. |
| 38 | - Coordinate payload changes with backend chat, upload, and WebSocket handlers. |
| 39 | |
| 40 | ## Verification |
| 41 | |
| 42 | - Smoke-test sending, queued messages, attachments, drag/drop, and navigation after visible changes. |
| 43 | - Smoke-test the unconfigured first-send gate and automatic dispatch after model setup when touching model setup or send interception. |
| 44 | |
| 45 | ## Child DOX Index |
| 46 | |
| 47 | No child DOX files. |