JintolChan · Tools-touch · Aug 23, 2025 · Aug 23, 2025
diff --git a/AI_React/index.html b/AI_React/index.html
@@ -2,6 +2,8 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
+      <link rel="icon" type="image/svg+xml" href="/logo.ico" />
+
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>ChainChat</title>
   </head>

diff --git a/AI_React/public/logo.ico b/AI_React/public/logo.ico
diff --git a/AI_React/src/App1.tsx b/AI_React/src/App1.tsx
diff --git a/AI_React/src/asset/logo.png b/AI_React/src/asset/logo.png
diff --git a/AI_React/src/components/Chat.tsx b/AI_React/src/components/Chat.tsx
@@ -1,4 +1,5 @@
 import MarkdownViewer from "@/components/MarkdownViewer.tsx";
+import {useStatusStore} from "@/stores/useStatusStore.ts";
 import { useState, useRef, useEffect } from "react";
 import { useChatStore } from "@/stores/chatStore";
 import { useAccount } from "wagmi";
@@ -14,17 +15,23 @@ export default function Chat() {
     const [loading, setLoading] = useState(false);
     const { address } = useAccount();
     const { t } = useTranslation();
+    const { setStatusInfo } = useStatusStore();
 
-    // Ref for textarea
     const textAreaRef = useRef<HTMLTextAreaElement | null>(null);
+    const messagesEndRef = useRef<HTMLDivElement | null>(null); // ⬅️ 新增：滚动定位点
 
-    // Adjust textarea height based on content
+    // 每次消息变化后自动滚动到底
     useEffect(() => {
-        if (textAreaRef.current) {
-            textAreaRef.current.style.height = "auto"; // Reset height
-            textAreaRef.current.style.height = `${textAreaRef.current.scrollHeight}px`; // Set to scrollHeight
+        if (messagesEndRef.current) {
+            messagesEndRef.current.scrollIntoView({ behavior: "smooth" });
         }
-    }, [input]);
+    }, [activeSession.messages]);
+
+    async function refreshStatus() {
+        if (!address) return;
+        const res = await API.accessGetStatus(address);
+        setStatusInfo(res.data);
+    }
 
     async function sendMessage() {
         if (!input.trim() || !address) return;
@@ -44,12 +51,13 @@ export default function Chat() {
             addMessage("assistant", `${t("chat.error")}: ${e}`);
         } finally {
             setLoading(false);
+            await refreshStatus();
         }
     }
 
     return (
         <div className="flex-1 flex flex-col h-full bg-white dark:bg-gray-900 transition-colors">
-            {/* 消息区（可滚动） */}
+            {/* 消息区 */}
             <div className="flex-1 overflow-y-auto p-4 space-y-3">
                 {activeSession.messages.length > 0 ? (
                     activeSession.messages.map((m) => (
@@ -73,12 +81,13 @@ export default function Chat() {
                         <h1 className="text-gray-500 dark:text-gray-300">{t("chat.introduce")}</h1>
                     </div>
                 )}
+                {/* ⬇️ 滚动定位点 */}
+                <div ref={messagesEndRef} />
             </div>
 
-            {/* 输入区（固定在底部） */}
+            {/* 输入区 */}
             <div className="border-t bg-gray-50 dark:bg-gray-800 dark:border-gray-600 p-4 transition-colors">
                 <div className="flex items-end gap-2">
-                    {/* 输入框 */}
                     <textarea
                         ref={textAreaRef}
                         className="flex-1 border rounded-2xl px-4 py-2 resize-none shadow-sm
@@ -97,8 +106,6 @@ export default function Chat() {
                         }}
                         placeholder={t("chat.inputPlaceholder")}
                     />
-
-                    {/* 发送按钮 */}
                     <button
                         onClick={sendMessage}
                         disabled={!address || loading}

diff --git a/AI_React/src/components/Sidebar.tsx b/AI_React/src/components/Sidebar.tsx
@@ -5,12 +5,15 @@ import { useChatStore } from "@/stores/chatStore";
 import { useState } from "react";
 import { Modal } from "antd";
 import { useSystemStore } from "@/stores/systemStore.ts";  // 引入切换主题的方法
+import { useTranslation } from "react-i18next";
 
 export default function Sidebar() {
     const { sessions, activeId, newSession, switchSession, renameSession, removeSession } = useChatStore();
     const [editingId, setEditingId] = useState<string | null>(null);
     const [tempTitle, setTempTitle] = useState("");
     const { toggleSidebar } = useUIStore();
+    const { t } = useTranslation();
+
     const { toggleTheme, theme } = useSystemStore();  // 获取切换主题的方法
     const isDark = usePrefersDark();
     console.log(isDark)
@@ -23,8 +26,10 @@ export default function Sidebar() {
 
     const handleDelete = (id: string) => {
         Modal.confirm({
-            title: "确定要删除此会话吗？",
-            content: "删除后无法恢复，请谨慎操作。",
+            title: `${t("sidebar.modalText.title")}`,
+            content: `${t("sidebar.modalText.content")}`,
+            okText: `${t("sidebar.modalText.ok")}`,
+            cancelText: `${t("sidebar.modalText.cancel")}`,
             onOk: () => {
                 // 删除会话
                 removeSession(id);
@@ -43,8 +48,9 @@ export default function Sidebar() {
     return (
         <div className="w-64 flex flex-col bg-gray-50 dark:bg-gray-900 border-r border-gray-200 dark:border-gray-700">
             {/* 顶部 */}
-            <div className="p-4 flex items-center justify-between border-b border-gray-200 dark:border-gray-700">
-                <h2 className="font-bold text-gray-800 dark:text-gray-100">ChainChat</h2>
+            <div className="p-3 flex items-center justify-between border-b border-gray-200 dark:border-gray-700">
+                <h2 className="font-bold text-blue-200 dark:text-gray-100">ChainChat</h2>
+
                 <div className="flex items-center space-x-2">
                     <button
                         onClick={toggleSidebar}
@@ -120,7 +126,7 @@ export default function Sidebar() {
                     onClick={toggleTheme}  // 点击切换主题
                     className="px-4 py-2 rounded-lg bg-blue-100 dark:bg-blue-800 text-blue-600 dark:text-blue-200 hover:bg-blue-200 dark:hover:bg-blue-700"
                 >
-                    {theme === "dark" ? "切换到浅色模式" : "切换到深色模式"}
+                    {theme === "dark" ? `${t("sidebar.switchLight")}` : `${t("sidebar.switchDark")}`}
                 </button>
             </div>
         </div>