Update web/src/components/ChatArea.tsx

web/src/components/ChatArea.tsx

@@ -1,5 +1,5 @@
 // web/src/components/ChatArea.tsx
-import React, { useState, useRef, useEffect } from 'react';
+import React, { useState, useRef, useEffect, useMemo } from 'react';
 import { Button } from './ui/button';
 import { Textarea } from './ui/textarea';
 import { Send, ArrowDown, Trash2, Share2 } from 'lucide-react';
@@ -13,14 +13,18 @@ import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigge
 interface ChatAreaProps {
   messages: MessageType[];
   onSendMessage: (content: string) => void;
+
   uploadedFiles: UploadedFile[];
   onFileUpload: (files: File[]) => void;
   onRemoveFile: (index: number) => void;
   onFileTypeChange: (index: number, type: FileType) => void;
 
-  // ✅ 新增：feedback 需要 userId
+  // ✅ feedback 需要 userId
   userId?: string;
 
+  // ✅ 由 App.tsx 传入 currentDocTypeForChat
+  docType?: string;
+
   memoryProgress: number;
   isLoggedIn: boolean;
   learningMode: LearningMode;
@@ -37,6 +41,7 @@ export function ChatArea({
   onRemoveFile,
   onFileTypeChange,
   userId,
+  docType = 'Other',
   memoryProgress,
   isLoggedIn,
   learningMode,
@@ -50,6 +55,13 @@ export function ChatArea({
   const messagesEndRef = useRef<HTMLDivElement>(null);
   const scrollContainerRef = useRef<HTMLDivElement>(null);
 
+  const lastUserMessageContent = useMemo(() => {
+    for (let i = messages.length - 1; i >= 0; i--) {
+      if (messages[i].role === 'user' && messages[i].content?.trim()) return messages[i].content;
+    }
+    return '';
+  }, [messages]);
+
   const scrollToBottom = () => {
     messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });
   };
@@ -60,10 +72,9 @@ export function ChatArea({
 
   useEffect(() => {
     const handleScroll = () => {
-      if (scrollContainerRef.current) {
-        const { scrollTop, scrollHeight, clientHeight } = scrollContainerRef.current;
-        setShowScrollButton(scrollHeight - scrollTop - clientHeight > 100);
-      }
+      if (!scrollContainerRef.current) return;
+      const { scrollTop, scrollHeight, clientHeight } = scrollContainerRef.current;
+      setShowScrollButton(scrollHeight - scrollTop - clientHeight > 100);
     };
 
     const container = scrollContainerRef.current;
@@ -152,7 +163,7 @@ export function ChatArea({
 
         <div ref={scrollContainerRef} className="h-full max-h-[600px] overflow-y-auto px-4 py-6 pb-36">
           <div className="max-w-4xl mx-auto space-y-6">
-            {messages.map((message) => (
+            {messages.map((m) => (
               <Message
                 key={m.id}
                 message={m}
@@ -160,10 +171,9 @@ export function ChatArea({
                 userId={userId}
                 isLoggedIn={isLoggedIn}
                 learningMode={learningMode}
-                docType={currentDocTypeForChat}
+                docType={docType}
                 lastUserText={lastUserMessageContent}
               />
-
             ))}
 
             {isTyping && (
@@ -218,13 +228,13 @@ export function ChatArea({
                     </Button>
                   </DropdownMenuTrigger>
                   <DropdownMenuContent align="start" className="w-56">
-                    {(['concept', 'socratic', 'exam', 'assignment', 'summary'] as LearningMode[]).map((m) => (
+                    {(['concept', 'socratic', 'exam', 'assignment', 'summary'] as LearningMode[]).map((mode) => (
                       <DropdownMenuItem
-                        key={m}
-                        onClick={() => onLearningModeChange(m)}
-                        className={learningMode === m ? 'bg-accent' : ''}
+                        key={mode}
+                        onClick={() => onLearningModeChange(mode)}
+                        className={learningMode === mode ? 'bg-accent' : ''}
                       >
-                        <span className="font-medium">{modeLabels[m]}</span>
+                        <span className="font-medium">{modeLabels[mode]}</span>
                       </DropdownMenuItem>
                     ))}
                   </DropdownMenuContent>