feat: add chat page layout with message list and bubble components
- Create /chat route with scrollable message list - MessageBubble component with distinct user/assistant styles - MessageList with auto-scroll-to-bottom on new messages - Empty state display when no messages - ChatMessage type definition in src/lib/types.ts - Add browser globals to ESLint config for Svelte files Closes #5 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
25
implementation-plans/issue-005.md
Normal file
25
implementation-plans/issue-005.md
Normal file
@@ -0,0 +1,25 @@
|
||||
---
|
||||
---
|
||||
|
||||
# Issue #5: Chat page layout and message list component
|
||||
|
||||
**Status:** COMPLETED
|
||||
**Issue:** https://git.shahondin1624.de/llm-multiverse/llm-multiverse-ui/issues/5
|
||||
**Branch:** `feature/issue-5-chat-layout`
|
||||
|
||||
## Summary
|
||||
|
||||
Build the `/chat` route with scrollable message list, user/assistant message bubbles, auto-scroll, and empty state. Uses Svelte 5 runes.
|
||||
|
||||
## Acceptance Criteria
|
||||
|
||||
- [x] `/chat` route created
|
||||
- [x] Scrollable message list component
|
||||
- [x] Distinct user and assistant message bubble styles
|
||||
- [x] Auto-scroll to bottom on new messages
|
||||
- [x] Svelte 5 runes used for reactive message state (`$state`, `$derived`)
|
||||
- [x] Empty state shown when no messages
|
||||
|
||||
## Deviations
|
||||
|
||||
- Added `globals` package to ESLint config for browser globals in Svelte files (fixes `Element`/`HTMLDivElement` not defined errors).
|
||||
Reference in New Issue
Block a user