feat(frontend): production-ready chat UX with markdown, scroll-to-bot… - #27
Conversation
…tom, and layout fixes - Rewrite Markdown.tsx with remark-gfm, remark-math, rehype-katex, rehype-highlight - Rewrite ChatMessage.tsx with user/assistant/system bubble layouts, copy button, typing indicator - Overhaul chat case in App.tsx: CSS Grid layout, agent picker, empty state, input area with attach/search/commands buttons - Add scroll-to-bottom arrow button with scroll detection - Fix textarea auto-resize reset on send - Add comprehensive prose/markdown/code/math CSS in index.css - Add remark-gfm, remark-math, rehype-katex, rehype-highlight dependencies - Use h-dvh for mobile viewport, hide MobileNav on chat tab
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: ecbb7ef8cf
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| {activeTab !== "chat" && ( | ||
| <MobileNav activeTab={activeTab} setActiveTab={setActiveTab} /> | ||
| )} |
There was a problem hiding this comment.
Conditionally removing MobileNav when activeTab === "chat" traps mobile users in the chat screen. In this codebase the sidebar is desktop-only (Sidebar uses hidden md:flex), so on screens below md there is no remaining control to switch to Agents/Memory/Settings once chat is active. Please keep a mobile tab switcher available in chat (or provide an equivalent escape path).
Useful? React with 👍 / 👎.
| <path d="M7 9l3 3-3 3M13 15h4" /> | ||
| <rect x="3" y="4" width="18" height="16" rx="2" /> | ||
| </svg> | ||
| <span>{msg.content}</span> |
There was a problem hiding this comment.
Rendering system messages as a plain inline <span> collapses newline formatting, which makes command outputs hard to read. This matters for built-in chat commands like /help and /status that return multi-line responses; they are now shown as a single wrapped flow instead of preserving line breaks (the previous UI used whitespace-pre-wrap).
Useful? React with 👍 / 👎.
1 participant
…tom, and layout fixes
Summary
Changes
Test Plan
make test)make lint)Related Issues