feat(sidebar): add SIDEBAR_TITLE and SIDEBAR_SUBTITLE config for custom sidebar information

.env.template

@@ -61,3 +61,10 @@ ANTHROPIC_URL=
 
 ### (optional)
 WHITE_WEBDEV_ENDPOINTS=
+
+### custom sidebar title.(optional)
+SIDEBAR_TITLE=
+
+### custom sidebar subtitle.(optional)
+SIDEBAR_SUBTITLE=
+

app/components/sidebar.tsx

@@ -30,6 +30,7 @@ import { Link, useNavigate } from "react-router-dom";
 import { isIOS, useMobileScreen } from "../utils";
 import dynamic from "next/dynamic";
 import { showConfirm, showToast } from "./ui-lib";
+import { getServerSideConfig } from "../config/server";
 
 const ChatList = dynamic(async () => (await import("./chat-list")).ChatList, {
   loading: () => null,
@@ -130,7 +131,6 @@ function useDragSideBar() {
 
 export function SideBar(props: { className?: string }) {
   const chatStore = useChatStore();
-
   // drag side bar
   const { onDragStart, shouldNarrow } = useDragSideBar();
   const navigate = useNavigate();
@@ -140,7 +140,7 @@ export function SideBar(props: { className?: string }) {
     () => isIOS() && isMobileScreen,
     [isMobileScreen],
   );
-
+  const serverConfig = getServerSideConfig();
   useHotKey();
 
   return (
@@ -155,10 +155,10 @@ export function SideBar(props: { className?: string }) {
     >
       <div className={styles["sidebar-header"]} data-tauri-drag-region>
         <div className={styles["sidebar-title"]} data-tauri-drag-region>
-          NextChat
+          {serverConfig.sidebarTitle}
         </div>
         <div className={styles["sidebar-sub-title"]}>
-          Build your own AI assistant.
+          {serverConfig.sidebarSubTitle}
         </div>
         <div className={styles["sidebar-logo"] + " no-dark"}>
           <ChatGptIcon />

app/config/server.ts

@@ -55,13 +55,17 @@ declare global {
 
       // custom template for preprocessing user input
       DEFAULT_INPUT_TEMPLATE?: string;
+
+      // custom sidebar title
+      SIDEBAR_TITLE?: string;
+      // custom sidebar sub-title
+      SIDEBAR_SUB_TITLE?: string;
     }
   }
 }
 
 const ACCESS_CODES = (function getAccessCodes(): Set<string> {
   const code = process.env.CODE;
-
   try {
     const codes = (code?.split(",") ?? [])
       .filter((v) => !!v)
@@ -125,7 +129,10 @@ export const getServerSideConfig = () => {
   const allowedWebDevEndpoints = (
     process.env.WHITE_WEBDEV_ENDPOINTS ?? ""
   ).split(",");
-
+  // custom title
+  const sidebarTitle = process.env.SIDEBAR_TITLE ?? "NextChat";
+  const sidebarSubTitle =
+    process.env.SIDEBAR_SUB_TITLE ?? "Build your own AI assistant.";
   return {
     baseUrl: process.env.BASE_URL,
     apiKey: getApiKey(process.env.OPENAI_API_KEY),
@@ -174,5 +181,7 @@ export const getServerSideConfig = () => {
     customModels,
     defaultModel,
     allowedWebDevEndpoints,
+    sidebarTitle,
+    sidebarSubTitle,
   };
 };