refactor(ui): reduce app renderer prop assembly

apps/ui/src/App.tsx

@@ -1355,10 +1355,13 @@ export default function App() {
   const conversationWorkspaceProps = {
     viewMode,
     workspaceRef: conversationWorkspaceRef,
-    messageListRef,
-    attachmentInputRef,
-    skillMenuRef,
+    status: {
       panelActions,
+      showInlineStartupNotice,
+      chatLaunchState,
+      startupCurtainStatus
+    },
+    emptyState: {
       selectedSkillBadge,
       selectedSkillIsDefault: selectedSkillId === DEFAULT_SKILL.id,
       homeLeadIcon: <LobsterClawIcon />,
@@ -1367,10 +1370,6 @@ export default function App() {
       activeExpertVisualKey,
       activeExpertGuide,
       expertWorkspaceLogo,
-    renderExpertIcon,
-    showInlineStartupNotice,
-    chatLaunchState,
-    startupCurtainStatus,
       homeIntentSuggestion: pendingHomeIntentSuggestion?.suggestion ?? null,
       homeIntentDecisionPending,
       homeIntentLabels: {
@@ -1380,9 +1379,6 @@ export default function App() {
         continue: ui.suggestionContinue,
         switchAction: ui.suggestionSwitchAction
       },
-    renderIntentIcon: getIntentSuggestionIcon,
-    onContinueHomeIntent: continuePendingHomePromptInHome,
-    onSwitchHomeIntent: switchExpertAndContinuePendingHomePrompt,
       showBindEntry,
       bindEntry: {
         lobsterKeyDraft,
@@ -1396,8 +1392,10 @@ export default function App() {
       noExpertsLabel: expertsPageCopy.noExperts,
       starterQuestionsHint: ui.starterQuestionsHint,
       homeEmptyTitle: homeChatCopy.emptyTitle,
-    homePrompts: homeChatCopy.prompts,
-    onStarterPrompt: applyStarterPrompt,
+      homePrompts: homeChatCopy.prompts
+    },
+    messages: {
+      messageListRef,
       messages,
       showEmptyState,
       messageTraces,
@@ -1412,17 +1410,11 @@ export default function App() {
       copyIcon: <CopyIcon />,
       copiedIcon: <CheckIcon />,
       deleteIcon: <TrashIcon />,
-    regenerateIcon: <RefreshIcon />,
-    renderThumbIcon: (direction) => <ThumbIcon direction={direction} />,
-    renderMarkdownContent,
-    buildDouyinVideoStatusCard,
-    formatMessageTimestamp,
-    onMessageListScroll: handleMessageListScroll,
-    onCopyText: handleCopyText,
-    onDeleteMessage: deleteMessage,
-    onTraceExpandedChange: setMessageTraceExpanded,
-    onRegenerateAssistantMessage: regenerateAssistantMessage,
-    onToggleMessageReaction: toggleMessageReaction,
+      regenerateIcon: <RefreshIcon />
+    },
+    composer: {
+      attachmentInputRef,
+      skillMenuRef,
       prompt,
       isBound,
       canSend,
@@ -1441,7 +1433,24 @@ export default function App() {
       skills: effectiveSkills,
       skillMenuOpen,
       attachmentIcon: <AttachmentIcon />,
-    submitIcon: sendPhase !== "idle" ? <StopIcon /> : <ArrowUpIcon />,
+      submitIcon: sendPhase !== "idle" ? <StopIcon /> : <ArrowUpIcon />
+    },
+    actions: {
+      renderExpertIcon,
+      renderIntentIcon: getIntentSuggestionIcon,
+      onContinueHomeIntent: continuePendingHomePromptInHome,
+      onSwitchHomeIntent: switchExpertAndContinuePendingHomePrompt,
+      onStarterPrompt: applyStarterPrompt,
+      renderThumbIcon: (direction) => <ThumbIcon direction={direction} />,
+      renderMarkdownContent,
+      buildDouyinVideoStatusCard,
+      formatMessageTimestamp,
+      onMessageListScroll: handleMessageListScroll,
+      onCopyText: handleCopyText,
+      onDeleteMessage: deleteMessage,
+      onTraceExpandedChange: setMessageTraceExpanded,
+      onRegenerateAssistantMessage: regenerateAssistantMessage,
+      onToggleMessageReaction: toggleMessageReaction,
       onSubmit: sendPrompt,
       onCancel: cancelActiveStream,
       onPromptChange: setPrompt,
@@ -1459,6 +1468,7 @@ export default function App() {
       onResizePointerDown: handleComposerResizePointerDown,
       onResizePointerMove: handleComposerResizePointerMove,
       onResizePointerEnd: handleComposerResizePointerEnd
+    }
   } satisfies ComponentProps<typeof ConversationWorkspaceView>;
   const settingsStatusHint = showSettingsStatusHint
     ? <div className={"inline-hint settings-runtime-hint" + (chatLaunchState === "error" ? " error" : "")}>{startupMessage}</div>

docs/2026-05-25-client-ui-ux-execution-plan.md

@@ -258,7 +258,7 @@
 - Modify: `apps/ui/src/features/settings/SettingsPanels.tsx`
 - Create or modify focused hooks only under existing `apps/ui/src/features/*`
 
-- [ ] **Step 1: 拆出纯 props 组装**
+- [x] **Step 1: 拆出纯 props 组装**
 
   Move only pure prop-building logic from `App.tsx` into focused helpers or hooks when all inputs are already available.
 
@@ -274,7 +274,12 @@
   - No IPC calls move across ownership boundaries in this step.
   - `App.tsx` line count decreases, but line count is not the success metric; clearer ownership is.
 
-- [ ] **Step 2: Keep high-risk flows in place**
+  Progress note:
+
+  - Completed on 2026-05-25 by grouping `ConversationWorkspaceView` props into focused `status`, `emptyState`, `messages`, `composer`, and `actions` objects.
+  - IPC calls, stream lifecycle, composer submit/cancel, session actions, startup overlay actions, and smoke hooks remain in `App.tsx`.
+
+- [x] **Step 2: Keep high-risk flows in place**
 
   Do not move these during this phase:
 
@@ -289,7 +294,11 @@
 
   - Existing smoke tests do not need selector or action rewrites.
 
-- [ ] **Step 3: Reduce oversized component props**
+  Progress note:
+
+  - Confirmed during the prop grouping pass; no smoke contract or high-risk flow was moved.
+
+- [x] **Step 3: Reduce oversized component props**
 
   For `ConversationWorkspaceView`, group related props into typed objects only when ownership is obvious:
 
@@ -304,7 +313,11 @@
   - Component call site becomes easier to read.
   - Existing child component props stay unchanged unless required.
 
-- [ ] **Step 4: Validate App.tsx encoding and tests**
+  Progress note:
+
+  - `ConversationWorkspaceView` now receives typed grouped props; child components still receive their existing prop shapes.
+
+- [x] **Step 4: Validate App.tsx encoding and tests**
 
   Run:
 
@@ -320,6 +333,12 @@
   - Diff contains no mojibake and no unrelated Chinese copy changes.
   - UI typecheck passes.
 
+  Progress note:
+
+  - Passed on 2026-05-25: BOM check printed `b'imp'`.
+  - Inspected `git diff -- apps/ui/src/App.tsx apps/ui/src/features/chat/ConversationWorkspaceView.tsx`; no mojibake or unrelated Chinese copy changes.
+  - Passed on 2026-05-25: `corepack pnpm --filter @qjclaw/ui typecheck`; `corepack pnpm build`.
+
 ## 6. Phase 4 - 修正核心工作流 UI/UX
 
 **目标:** 优先改善用户每天会反复使用的界面：聊天、任务、自动化、设置。