feat: integrate pinned teacher discussion workspace

src/pages/Chat/TeacherChatPanel.tsx

@@ -13,6 +13,8 @@ import type {
   TeacherTopic,
   TeacherTopicList,
 } from '../../../shared/coding-teacher';
+import { TeacherDiscussionPanel, DiscussionFocus } from './TeacherDiscussionPanel';
+import type { TeacherDiscussionAction } from '../../../shared/coding-teacher';
 import { getAgentAvatarSrc } from '@/lib/agent-avatars';
 
 export function TeacherChatPanel({
@@ -58,6 +60,7 @@ export function TeacherChatPanel({
   const label = role === 'friend' ? '朋友' : '老师';
   const studentTeacher = role === 'teacher' && !draftRevision;
   const [historyOpen, setHistoryOpen] = useState(false);
+  const [focus, setFocus] = useState<{ topicId: string; id: string; label: string } | null>(null);
   const [definition, setDefinition] = useState<TeacherDefinition | null>(null);
   const avatar = role === 'friend' ? friendAvatar : draftRevision && definition ? getAgentAvatarSrc(definition.avatar_id) : teacherAvatar;
   const externalTopicRef = useRef(externalTopic);
@@ -83,6 +86,12 @@ export function TeacherChatPanel({
   const topicRef = useRef(topic);
   topicRef.current = topic;
   const scrollRef = useRef<HTMLDivElement>(null);
+  const content = topic?.discussion?.content;
+  const activeFocus = focus && focus.topicId === topic?.id && content && topic?.discussion?.status === 'active' && (
+    content.kind === 'ideas' ? content.items.some(item => item.id === focus.id)
+      : content.kind === 'comparison' ? content.rows.some(row => content.columns.some(column => `${row.id}:${column.id}` === focus.id))
+        : content.nodes.some(node => node.id === focus.id)
+  ) ? focus : null;
   useEffect(() => {
     const pane = scrollRef.current;
     if (pane) pane.scrollTop = pane.scrollHeight;
@@ -232,7 +241,7 @@ export function TeacherChatPanel({
       if (version === generation.current) setBusy(false);
     }
   };
-  const send = async (action?: Pick<TeacherSend, 'text' | 'intent'>) => {
+  const send = async (action?: Pick<TeacherSend, 'text' | 'intent' | 'discussion'>) => {
     const question = action?.text ?? text;
     const questionReferences = action ? [] : references;
     if (!question.trim() || busy || !enabled || topicRef.current?.requests.some((request) => ['preparing', 'running'].includes(request.status))) return;
@@ -246,17 +255,24 @@ export function TeacherChatPanel({
         if (version !== generation.current) return;
         consume(current);
       }
+      const presentation = studentTeacher && (!action?.intent || action.intent === 'question' || action.intent === 'guided-help') ? 'discussion-v1' as const : undefined;
+      const discussion = presentation && current.discussion?.status === 'active'
+        ? action?.discussion ?? { toolId: current.discussion.id, revision: current.discussion.revision,
+          ...(activeFocus?.topicId === current.id ? { focusId: activeFocus.id } : {}) } : undefined;
       const previous = pending.current && !current.requests.some((request) => request.id === pending.current?.requestId)
         ? pending.current
         : null;
       const input =
         previous &&
         previous.text === question &&
+        previous.presentation === presentation &&
+        JSON.stringify(previous.discussion) === JSON.stringify(discussion) &&
         (previous.intent ?? 'question') === (action?.intent ?? 'question') &&
         JSON.stringify(previous.references) === JSON.stringify(questionReferences)
           ? previous
           : {
             requestId: crypto.randomUUID(), text: question, references: questionReferences,
+            ...(presentation ? { presentation } : {}), ...(discussion ? { discussion } : {}),
             ...(action?.intent ? { intent: action.intent } : {}),
             ...(role && sourceId ? { sourceConversationId: sourceId } : {}),
           };
@@ -285,6 +301,33 @@ export function TeacherChatPanel({
     (request) => request.status === 'preparing' || request.status === 'running'
   );
   const helpUnavailable = busy || !enabled || Boolean(running);
+  const updateDiscussion = async (action: TeacherDiscussionAction['action'], itemId?: string) => {
+    const current = topicRef.current;
+    if (!current?.discussion || helpUnavailable) return;
+    const version = generation.current;
+    setBusy(true);
+    setError('');
+    try {
+      const next = await teacherApi.updateDiscussion(base, current.id, {
+        toolId: current.discussion.id, revision: current.discussion.revision, action, ...(itemId ? { itemId } : {}),
+      });
+      if (version === generation.current) { consume(next); setFocus(null); }
+    } catch (e) {
+      if (version === generation.current) setError(e instanceof Error ? e.message : '内容还没更新，请再试一次。');
+    } finally { if (version === generation.current) setBusy(false); }
+  };
+  const focusItem = (id: string, label: string) => {
+    if (!topic) return;
+    setFocus({ topicId: topic.id, id, label });
+    inputRef.current?.focus();
+  };
+  const structureIdeas = () => {
+    if (!topic?.discussion) return;
+    setFocus(null);
+    void send({ text: '把我留下的想法理一理，看看它们怎么联系。', discussion: {
+      toolId: topic.discussion.id, revision: topic.discussion.revision, transition: 'structure',
+    } });
+  };
   const askForSuggestions = () => void send({ text: '老师帮我看看', intent: 'suggestions' });
   const askForGuidance = () => void send({ text: '我也说不清，你带我看看', intent: 'guided-help' });
   const changeText = (next: string) => { setText(next); persistDraft(next, references, pending.current); };
@@ -310,6 +353,13 @@ export function TeacherChatPanel({
           </select><button aria-label={`${label}新话题`} title="新话题" disabled={busy || !enabled} onClick={() => void newTopic()} className="consult-icon"><Plus className="h-4 w-4" /></button>
         </div>}
       </div>}
+      {studentTeacher && topic?.discussion && <TeacherDiscussionPanel key={topic.id} discussion={topic.discussion}
+        disabled={helpUnavailable} focusId={activeFocus?.id}
+        onAction={(action, itemId) => void updateDiscussion(action, itemId)} onFocus={focusItem} onStructure={structureIdeas}
+        onDiscuss={(id, question) => {
+          focusItem(id, question);
+          void send({ text: question, discussion: { toolId: topic.discussion!.id, revision: topic.discussion!.revision, focusId: id } });
+        }} />}
       <div ref={scrollRef} className="consultation-messages min-h-0 flex-1 overflow-y-auto px-5 py-6">
         {!topic?.requests.length && <div className="flex min-h-full flex-col items-center justify-center pb-5 text-center">
           <img className="mb-6 h-[68px] w-[68px] rounded-3xl [image-rendering:pixelated]" src={avatar} alt="" />
@@ -337,7 +387,11 @@ export function TeacherChatPanel({
                 <p className="text-[11px] leading-5 text-muted-foreground">也可以直接在下面说说你的想法。</p>
               </>}
             {['failed', 'cancelled', 'interrupted'].includes(request.status) && <button type="button" disabled={helpUnavailable} onClick={askForSuggestions} className="consultation-guided-help min-h-10 text-xs underline underline-offset-4 disabled:opacity-50">再请老师看看</button>}
-          </> : <div className="whitespace-pre-wrap break-words text-[13px] leading-7">{request.response || (['running', 'preparing'].includes(request.status) ? `${label}正在想…` : '')}</div>}
+          </> : <div className="whitespace-pre-wrap break-words text-[13px] leading-7">{request.response || (['running', 'preparing'].includes(request.status) ? <span role="status" className="inline-flex items-center gap-2 text-muted-foreground"><Loader2 className="h-3.5 w-3.5 animate-spin motion-reduce:animate-none" />{request.discussionContext ? '正在梳理你的新想法…' : `${label}正在想…`}</span> : ['cancelled', 'interrupted'].includes(request.status) ? '这次先停在这里。想继续时可以再说说。' : '')}</div>}
+          {studentTeacher && request.intent !== 'suggestions' && request.status === 'completed' && topic.discussion?.status !== 'active' && topic.discussion?.status !== 'offered' && Boolean(request.suggestedQuestions?.length) && <div className="flex flex-col gap-2" aria-label="接着聊">
+            {request.suggestedQuestions?.map(question => <button type="button" key={question} disabled={helpUnavailable} onClick={() => void send({ text: question })} className="consultation-suggestion rounded-xl border px-3 py-2 text-left text-xs leading-6">{question}<ChevronRight className="ml-1 inline h-3 w-3" /></button>)}
+          </div>}
+          {request.discussionError && <p className="text-xs leading-6 text-muted-foreground">{request.discussionError}</p>}
           {request.omittedMessages > 0 && <p className="text-[10px] text-muted-foreground">本轮参考了较近的讨论，省略了 {request.omittedMessages} 条较早内容。</p>}
           {request.error && <p className="text-xs text-destructive">{request.error}</p>}
           {!role && onBringBack && request.response && request.intent !== 'suggestions' && request.status === 'completed' && <div className="text-[11px] text-muted-foreground">
@@ -351,6 +405,7 @@ export function TeacherChatPanel({
       <form className="px-4 pb-4 pt-2" onSubmit={(e) => { e.preventDefault(); void send(); }}>
         {references.length > 0 && <div className="mb-2 rounded-lg bg-white p-3 text-xs"><p className="line-clamp-3 whitespace-pre-wrap">{references.map((ref) => ref.text).join('\n')}</p><button type="button" className="mt-1 underline" onClick={removeReferences}>移除引用</button></div>}
         <div className="consultation-composer rounded-2xl border bg-white p-3 focus-within:ring-2 focus-within:ring-black/5">
+          {activeFocus && <DiscussionFocus label={activeFocus.label} onClear={() => setFocus(null)} />}
           <textarea ref={inputRef} aria-label={`向${label}提问`} value={text} disabled={busy} maxLength={6000} onChange={(e) => changeText(e.target.value)} placeholder={`想和${label}聊些什么？`} rows={2}
             onKeyDown={(e) => { if (e.key === 'Enter' && !e.shiftKey && !e.nativeEvent.isComposing) { e.preventDefault(); void send(); } }}
             className="min-h-[60px] w-full resize-none border-0 bg-transparent text-[13px] leading-6 outline-none placeholder:text-muted-foreground/65" />