feat(web): 前端收敛为「共享消息流 + 按消息 mode 渲染」,并补全 emoji→MD3 图标
架构变更(主人要求,design/07 §1/§2 已改定稿):把「9 个行为模式 = 9 个独立页面」改为 「一个共享页面 + 每条消息绑 mode,消息框按对应 mode 渲染」。 - ChatMessage 增 mode?(types.ts);useAppStore addUserMessage/beginAssistant 带 mode; useSendChat.send(text, mode) / chatStream body 带 mode(通知后端按 mode 回复)。 - MessageBubble 按 message.mode 分发到 components/messages/ 各形态渲染器 (chat 气泡 / code 等宽代码块 / home 设备卡 / docs 文档卡 / work 任务卡 / vision 视觉卡)。 - ChatInput 顶部加「行为模式」chip 切换下一条消息的 mode(默认 chat);输入框上方显示当前模式。 - ModeRouter 收敛为只渲染 ChatShell;删除 9 个旧独立 mode 页面;Nav/TopBar 的 mode 改为 「输入模式」语义;settings 归管理面板(design/10)。 同时补全上一轮 emoji→MD3 图标(约 23 文件):新增 Icon.tsx(MD3 SVG、IconName、零依赖、 离线优先),全部界面 emoji 替换为 <Icon name=... />;正文说明箭头保留。 npm run build 绿(tsc 0 错,79→71 模块,JS 284KB/gzip 86KB)。
This commit is contained in:
1 parent
265b207699
commit
4aab0f501a
28 files changed
+539
-950
No files matched your search
@@ -1,38 +1,12 @@
|
||||
import { useModeStore } from "../store/useModeStore";
|
||||
import { ChatMode } from "./ChatMode";
|
||||
import { CodeMode } from "./CodeMode";
|
||||
import { HomeMode } from "./HomeMode";
|
||||
import { WorkMode } from "./WorkMode";
|
||||
import { DocsMode } from "./DocsMode";
|
||||
import { VoiceMode } from "./VoiceMode";
|
||||
import { VisionMode } from "./VisionMode";
|
||||
import { AgentsMode } from "./AgentsMode";
|
||||
import { SettingsMode } from "./SettingsMode";
|
||||
import { ChatShell } from "./ChatShell";
|
||||
|
||||
/** Renders the active mode's presentation layer. The session context / messages
|
||||
* / memory live in useAppStore and are untouched by these switches. */
|
||||
/**
|
||||
* User frontend is ONE shared page (design/07 §1): behavior modes no longer
|
||||
* switch between nine distinct pages. Instead there is a single message stream
|
||||
* and each message carries its own mode, so its bubble renders per that mode.
|
||||
* Switching the input mode only shapes the next message. Settings live in the
|
||||
* admin panel (design/10); agent progress follows the message stream.
|
||||
*/
|
||||
export function ModeRouter(): React.ReactNode {
|
||||
const mode = useModeStore((s) => s.mode);
|
||||
switch (mode) {
|
||||
case "chat":
|
||||
return <ChatMode />;
|
||||
case "code":
|
||||
return <CodeMode />;
|
||||
case "home":
|
||||
return <HomeMode />;
|
||||
case "work":
|
||||
return <WorkMode />;
|
||||
case "docs":
|
||||
return <DocsMode />;
|
||||
case "voice":
|
||||
return <VoiceMode />;
|
||||
case "vision":
|
||||
return <VisionMode />;
|
||||
case "agents":
|
||||
return <AgentsMode />;
|
||||
case "settings":
|
||||
return <SettingsMode />;
|
||||
default:
|
||||
return <ChatMode />;
|
||||
}
|
||||
return <ChatShell />;
|
||||
}
|
||||
Reference in new issue
Block a user