add header

package-lock.json

@@ -25,6 +25,7 @@
         "openai": "^4.83.0",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
+        "react-github-btn": "^1.4.0",
         "react-markdown": "^9.0.3",
         "rehype-katex": "^7.0.1",
         "remark-gfm": "^4.0.1",
@@ -1315,11 +1316,7 @@
     },
     "node_modules/@radix-ui/react-switch": {
       "version": "1.1.3",
-<<<<<<< HEAD
       "resolved": "https://registry.npmmirror.com/@radix-ui/react-switch/-/react-switch-1.1.3.tgz",
-=======
-      "resolved": "https://registry.npmjs.org/@radix-ui/react-switch/-/react-switch-1.1.3.tgz",
->>>>>>> develop
       "integrity": "sha512-1nc+vjEOQkJVsJtWPSiISGT6OKm4SiOdjMo+/icLxo2G4vxz1GntC5MzfL4v8ey9OEfw787QCD1y3mUv0NiFEQ==",
       "dependencies": {
         "@radix-ui/primitive": "1.1.1",
@@ -1442,11 +1439,7 @@
     },
     "node_modules/@radix-ui/react-use-previous": {
       "version": "1.1.0",
-<<<<<<< HEAD
       "resolved": "https://registry.npmmirror.com/@radix-ui/react-use-previous/-/react-use-previous-1.1.0.tgz",
-=======
-      "resolved": "https://registry.npmjs.org/@radix-ui/react-use-previous/-/react-use-previous-1.1.0.tgz",
->>>>>>> develop
       "integrity": "sha512-Z/e78qg2YFnnXcW88A4JmTtm4ADckLno6F7OXotmkQfeuCVaKuYzqAATPhVzl3delXE7CxIV8shofPn3jPc5Og==",
       "peerDependencies": {
         "@types/react": "*",
@@ -3037,6 +3030,11 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/github-buttons": {
+      "version": "2.29.1",
+      "resolved": "https://registry.npmjs.org/github-buttons/-/github-buttons-2.29.1.tgz",
+      "integrity": "sha512-TV3YgAKda5hPz75n7QXmGCsSzgVya1vvmBieebg3EB5ScmashTZ0FldViG1aU2d4V5rcAGrtQ7k5uAaCo0A4PA=="
+    },
     "node_modules/glob": {
       "version": "10.4.5",
       "resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz",
@@ -5200,6 +5198,17 @@
         "react": "^18.3.1"
       }
     },
+    "node_modules/react-github-btn": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/react-github-btn/-/react-github-btn-1.4.0.tgz",
+      "integrity": "sha512-lV4FYClAfjWnBfv0iNlJUGhamDgIq6TayD0kPZED6VzHWdpcHmPfsYOZ/CFwLfPv4Zp+F4m8QKTj0oy2HjiGXg==",
+      "dependencies": {
+        "github-buttons": "^2.22.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.3.0"
+      }
+    },
     "node_modules/react-markdown": {
       "version": "9.0.3",
       "resolved": "https://registry.npmmirror.com/react-markdown/-/react-markdown-9.0.3.tgz",

package.json

@@ -25,6 +25,7 @@
     "openai": "^4.83.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-github-btn": "^1.4.0",
     "react-markdown": "^9.0.3",
     "rehype-katex": "^7.0.1",
     "remark-gfm": "^4.0.1",

src/App.tsx

@@ -1,11 +1,12 @@
 import ChatUI from './components/ChatUI'
 import './App.css'
+import Layout from './components/Layout'
 
 function App() {
   return (
-      <div className="app-container">
+    <Layout>
-        <ChatUI />
+      <ChatUI />
-      </div>
+    </Layout>
   )
 }
 

src/components/Header.tsx

@@ -0,0 +1,49 @@
+import React, { useEffect } from 'react';
+import GitHubButton from 'react-github-btn';
+
+const Header: React.FC = () => {
+  useEffect(() => {
+    const fetchGitHubStars = async () => {
+      try {
+        const response = await fetch('https://api.github.com/repos/maojindao55/botgroup.chat');
+        const data = await response.json();
+        const starsElement = document.getElementById('github-stars');
+        if (starsElement) {
+          starsElement.textContent = data.stargazers_count.toLocaleString();
+        }
+      } catch (error) {
+        console.error('Failed to fetch GitHub stars:', error);
+      }
+    };
+
+    fetchGitHubStars();
+  }, []);
+
+  return (
+    <header className="bg-transparent fixed top-0 left-0 right-0 z-50 hidden md:block">
+      <div className="w-full px-2 h-10 flex items-center">
+        {/* Logo */}
+        <div className="flex-1 flex items-center">
+          <a href="/" className="text-sm font-medium text-gray-700 hover:text-gray-500">
+            botgroup.chat
+          </a>
+        </div>
+
+        {/* GitHub Star Button */}
+        <div className="flex items-center justify-end">
+          <GitHubButton 
+            href="https://github.com/maojindao55/botgroup.chat"
+            data-color-scheme="no-preference: light; light: light; dark: dark;"
+            data-size="large"
+            data-show-count="true"
+            aria-label="Star maojindao55/botgroup.chat on GitHub"
+          >
+            Star
+          </GitHubButton>
+        </div>
+      </div>
+    </header>
+  );
+};
+
+export default Header; 

src/components/Layout.tsx

@@ -1,23 +1,15 @@
-interface LayoutProps {
+import React from 'react';
-  children: React.ReactNode
+import Header from './Header';
-}
 
-function Layout({ children }: LayoutProps) {
+const Layout: React.FC<{ children: React.ReactNode }> = ({ children }) => {
   return (
-    <div className="app-container">
+    <div className="flex flex-col min-h-screen">
-      <header className="app-header">
+      <Header />
-        {/* 这里可以放导航栏 */}
+      <main className="flex-1 pt-14">
-      </header>
-      
-      <main className="app-main">
         {children}
       </main>
-      
-      <footer className="app-footer">
-        {/* 这里可以放页脚信息 */}
-      </footer>
     </div>
-  )
+  );
-}
+};
 
-export default Layout 
+export default Layout; 

src/config/aiCharacters.ts

@@ -140,11 +140,11 @@ export function generateAICharacters(groupName: string): AICharacter[] {
     },
     { 
       id: 'ai8', 
-      name: "智普", 
+      name: "智谱", 
       personality: "glm",
       model: modelConfigs[5].model,
       avatar: "/img/glm.gif",
-      custom_prompt: `你是一个名叫"智普"的硅基生命体，你当前在一个叫"${groupName}" 的聊天群里`,
+      custom_prompt: `你是一个名叫"智谱"的硅基生命体，你当前在一个叫"${groupName}" 的聊天群里`,
       tags: ["新闻报道","分析数据","文字游戏","信息总结"]
     }
   ];