Fix SSE route dependency and align architecture docs

frontend/src/pages/RagChat/RagChatPage.tsx

@@ -1,5 +1,5 @@
-import React, { useState, useEffect } from 'react';
-import { useTheme } from '../../contexts/ThemeContext';
+import React, { useEffect, useRef, useState } from 'react';
+import { useTheme } from '../../contexts';
 import type { ChatMessage, RetrievalData } from '../../types';
 import { getQuickQuestions, ragChat } from '../../api/rag';
 
@@ -16,6 +16,7 @@ const ragQuickQuestionsDefault = [
 
 export const RagChatPage: React.FC = () => {
   const { theme } = useTheme();
+  const nextMessageIdRef = useRef(1);
   const [messages, setMessages] = useState<ChatMessage[]>([]);
   const [retrievals, setRetrievals] = useState<RetrievalData[]>([]);
   const [input, setInput] = useState<string>('');
@@ -24,23 +25,32 @@ export const RagChatPage: React.FC = () => {
   const [selectedRetrieval, setSelectedRetrieval] = useState<RetrievalData | null>(null);
   const [quickQuestions, setQuickQuestions] = useState<string[]>(ragQuickQuestionsDefault);
 
-  useEffect(() => {
-    void loadQuickQuestions();
-  }, []);
+  function nextMessageId() {
+    const currentId = nextMessageIdRef.current;
+    nextMessageIdRef.current += 1;
+    return currentId;
+  }
 
-  const loadQuickQuestions = async () => {
+  async function loadQuickQuestions() {
     try {
       const response = await getQuickQuestions();
       setQuickQuestions(response.questions.map(q => q.question));
     } catch (error) {
       console.error('Failed to load quick questions:', error);
     }
-  };
+  }
+
+  useEffect(() => {
+    const timerId = window.setTimeout(() => {
+      void loadQuickQuestions();
+    }, 0);
+    return () => window.clearTimeout(timerId);
+  }, []);
 
   const sendMessage = (text: string) => {
     if (!text.trim()) return;
 
-    const userMsg = { id: Date.now(), role: 'user' as const, content: text };
+    const userMsg = { id: nextMessageId(), role: 'user' as const, content: text };
     setMessages((prev) => [...prev, userMsg]);
     setInput('');
     setLoading(true);
@@ -84,7 +94,7 @@ export const RagChatPage: React.FC = () => {
             if (lastMsg?.role === 'assistant') {
               return [...prev.slice(0, -1), { ...lastMsg, content: currentResponse }];
             }
-            return [...prev, { id: Date.now() + 1, role: 'assistant' as const, content: currentResponse }];
+            return [...prev, { id: nextMessageId(), role: 'assistant' as const, content: currentResponse }];
           });
         } else if (sseData.type === 'done') {
           setLoading(false);
@@ -97,7 +107,7 @@ export const RagChatPage: React.FC = () => {
         setLoading(false);
         setMessages((prev) => [
           ...prev,
-          { id: Date.now() + 1, role: 'assistant' as const, content: '抱歉，连接服务器时出错，请稍后再试。' }
+          { id: nextMessageId(), role: 'assistant' as const, content: '抱歉，连接服务器时出错，请稍后再试。' }
         ]);
       },
       () => {
@@ -159,7 +169,7 @@ export const RagChatPage: React.FC = () => {
             if (lastMsg?.role === 'assistant') {
               return [...prev.slice(0, -1), { ...lastMsg, content: currentResponse }];
             }
-            return [...prev, { id: Date.now() + 1, role: 'assistant' as const, content: currentResponse }];
+            return [...prev, { id: nextMessageId(), role: 'assistant' as const, content: currentResponse }];
           });
         } else if (sseData.type === 'done') {
           setLoading(false);
@@ -170,7 +180,7 @@ export const RagChatPage: React.FC = () => {
         setLoading(false);
         setMessages((prev) => [
           ...prev,
-          { id: Date.now() + 1, role: 'assistant' as const, content: '抱歉，连接服务器时出错，请稍后再试。' }
+          { id: nextMessageId(), role: 'assistant' as const, content: '抱歉，连接服务器时出错，请稍后再试。' }
         ]);
       },
       () => {