feat: i18n refactor and style adjustment

app/components/button.module.scss

@@ -18,6 +18,15 @@
     cursor: not-allowed;
     opacity: 0.5;
   }
+
+  &.primary {
+    background-color: var(--primary);
+    color: white;
+
+    path {
+      fill: white !important;
+    }
+  }
 }
 
 .shadow {

app/components/button.tsx

@@ -5,10 +5,10 @@ import styles from "./button.module.scss";
 export function IconButton(props: {
   onClick?: () => void;
   icon?: JSX.Element;
+  type?: "primary" | "danger";
   text?: string;
   bordered?: boolean;
   shadow?: boolean;
-  noDark?: boolean;
   className?: string;
   title?: string;
   disabled?: boolean;
@@ -19,7 +19,7 @@ export function IconButton(props: {
         styles["icon-button"] +
         ` ${props.bordered && styles.border} ${props.shadow && styles.shadow} ${
           props.className ?? ""
-        } clickable`
+        } clickable ${styles[props.type ?? ""]}`
       }
       onClick={props.onClick}
       title={props.title}
@@ -29,7 +29,8 @@ export function IconButton(props: {
       {props.icon && (
         <div
           className={
-            styles["icon-button-icon"] + ` ${props.noDark && "no-dark"}`
+            styles["icon-button-icon"] +
+            ` ${props.type === "primary" && "no-dark"}`
           }
         >
           {props.icon}

app/components/chat-list.tsx

@@ -14,6 +14,8 @@ import { useChatStore } from "../store";
 import Locale from "../locales";
 import { Link, useNavigate } from "react-router-dom";
 import { Path } from "../constant";
+import { MaskAvatar } from "./mask";
+import { Mask } from "../store/mask";
 
 export function ChatItem(props: {
   onClick?: () => void;
@@ -25,6 +27,7 @@ export function ChatItem(props: {
   id: number;
   index: number;
   narrow?: boolean;
+  mask: Mask;
 }) {
   return (
     <Draggable draggableId={`${props.id}`} index={props.index}>
@@ -44,7 +47,7 @@ export function ChatItem(props: {
           {props.narrow ? (
             <div className={styles["chat-item-narrow"]}>
               <div className={styles["chat-item-avatar"] + " no-dark"}>
-                <BotIcon></BotIcon>
+                <MaskAvatar mask={props.mask} />
               </div>
               <div className={styles["chat-item-narrow-count"]}>
                 {props.count}
@@ -129,6 +132,7 @@ export function ChatList(props: { narrow?: boolean }) {
                   }
                 }}
                 narrow={props.narrow}
+                mask={item.mask}
               />
             ))}
             {provided.placeholder}

app/components/chat.tsx

@@ -53,13 +53,16 @@ import { IconButton } from "./button";
 import styles from "./home.module.scss";
 import chatStyle from "./chat.module.scss";
 
-import { Input, List, ListItem, Modal, Popover, showModal } from "./ui-lib";
+import { ListItem, Modal, showModal } from "./ui-lib";
 import { useNavigate } from "react-router-dom";
 import { Path } from "../constant";
-import { ModelConfigList } from "./model-config";
-import { Avatar, AvatarPicker } from "./emoji";
-import { MaskConfig } from "./mask";
-import { DEFAULT_MASK_ID, useMaskStore } from "../store/mask";
+import { Avatar } from "./emoji";
+import { MaskAvatar, MaskConfig } from "./mask";
+import {
+  DEFAULT_MASK_AVATAR,
+  DEFAULT_MASK_ID,
+  useMaskStore,
+} from "../store/mask";
 
 const Markdown = dynamic(
   async () => memo((await import("./markdown")).Markdown),
@@ -668,10 +671,8 @@ export function Chat() {
                 <div className={styles["chat-message-avatar"]}>
                   {message.role === "user" ? (
                     <Avatar avatar={config.avatar} />
-                  ) : session.mask.id === DEFAULT_MASK_ID ? (
-                    <Avatar model={message.model ?? "gpt-3.5-turbo"} />
                   ) : (
-                    <Avatar avatar={session.mask.avatar} />
+                    <MaskAvatar mask={session.mask} />
                   )}
                 </div>
                 {showTyping && (
@@ -778,7 +779,7 @@ export function Chat() {
             icon={<SendWhiteIcon />}
             text={Locale.Chat.Send}
             className={styles["chat-input-send"]}
-            noDark
+            type="primary"
             onClick={onUserSubmit}
           />
         </div>

app/components/error.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import { IconButton } from "./button";
 import GithubIcon from "../icons/github.svg";
 import ResetIcon from "../icons/reload.svg";
-import { ISSUE_URL, StoreKey } from "../constant";
+import { ISSUE_URL } from "../constant";
 import Locale from "../locales";
 import { downloadAs } from "../utils";
 
@@ -24,22 +24,15 @@ export class ErrorBoundary extends React.Component<any, IErrorBoundaryState> {
   }
 
   clearAndSaveData() {
-    const snapshot: Record<string, any> = {};
-    Object.values(StoreKey).forEach((key) => {
-      snapshot[key] = localStorage.getItem(key);
-
-      if (snapshot[key]) {
-        try {
-          snapshot[key] = JSON.parse(snapshot[key]);
-        } catch {}
-      }
-    });
-
     try {
-      downloadAs(JSON.stringify(snapshot), "chatgpt-next-web-snapshot.json");
-    } catch {}
-
-    localStorage.clear();
+      downloadAs(
+        JSON.stringify(localStorage),
+        "chatgpt-next-web-snapshot.json",
+      );
+    } finally {
+      localStorage.clear();
+      location.reload();
+    }
   }
 
   render() {
@@ -65,7 +58,8 @@ export class ErrorBoundary extends React.Component<any, IErrorBoundaryState> {
               icon={<ResetIcon />}
               text="Clear All Data"
               onClick={() =>
-                confirm(Locale.Store.ConfirmClearAll) && this.clearAndSaveData()
+                confirm(Locale.Settings.Actions.ConfirmClearAll) &&
+                this.clearAndSaveData()
               }
               bordered
             />

app/components/home.module.scss

@@ -269,7 +269,7 @@
     .chat-item-avatar {
       display: flex;
       justify-content: center;
-      opacity: 0.1;
+      opacity: 0.2;
       position: absolute;
       transform: scale(4);
     }

app/components/new-chat.module.scss

@@ -52,10 +52,18 @@
     animation: slide-in ease 0.4s;
   }
 
-  .search-bar {
+  .actions {
     margin-top: 5vh;
     margin-bottom: 5vh;
     animation: slide-in ease 0.45s;
+    display: flex;
+    justify-content: center;
+
+    .search-bar {
+      font-size: 12px;
+      margin-right: 10px;
+      width: 40vw;
+    }
   }
 
   .masks {

app/components/new-chat.tsx

@@ -3,11 +3,14 @@ import { Path, SlotID } from "../constant";
 import { IconButton } from "./button";
 import { EmojiAvatar } from "./emoji";
 import styles from "./new-chat.module.scss";
+
 import LeftIcon from "../icons/left.svg";
-import { useNavigate } from "react-router-dom";
+import AddIcon from "../icons/lightning.svg";
+
+import { useLocation, useNavigate } from "react-router-dom";
 import { createEmptyMask, Mask, useMaskStore } from "../store/mask";
 import Locale from "../locales";
-import { useChatStore } from "../store";
+import { useAppConfig, useChatStore } from "../store";
 import { MaskAvatar } from "./mask";
 
 function getIntersectionArea(aRect: DOMRect, bRect: DOMRect) {
@@ -93,10 +96,14 @@ function useMaskGroup(masks: Mask[]) {
 export function NewChat() {
   const chatStore = useChatStore();
   const maskStore = useMaskStore();
+
   const masks = maskStore.getAll();
   const groups = useMaskGroup(masks);
 
   const navigate = useNavigate();
+  const config = useAppConfig();
+
+  const { state } = useLocation();
 
   const startChat = (mask?: Mask) => {
     chatStore.newSession(mask);
@@ -111,10 +118,19 @@ export function NewChat() {
           text={Locale.NewChat.Return}
           onClick={() => navigate(Path.Home)}
         ></IconButton>
-        <IconButton
-          text={Locale.NewChat.Skip}
-          onClick={() => startChat()}
-        ></IconButton>
+        {!state?.fromHome && (
+          <IconButton
+            text={Locale.NewChat.NotShow}
+            onClick={() => {
+              if (confirm(Locale.NewChat.ConfirmNoShow)) {
+                startChat();
+                config.update(
+                  (config) => (config.dontShowMaskSplashScreen = true),
+                );
+              }
+            }}
+          ></IconButton>
+        )}
       </div>
       <div className={styles["mask-cards"]}>
         <div className={styles["mask-card"]}>
@@ -131,12 +147,22 @@ export function NewChat() {
       <div className={styles["title"]}>{Locale.NewChat.Title}</div>
       <div className={styles["sub-title"]}>{Locale.NewChat.SubTitle}</div>
 
-      <input
-        className={styles["search-bar"]}
-        placeholder={Locale.NewChat.More}
-        type="text"
-        onClick={() => navigate(Path.Masks)}
-      />
+      <div className={styles["actions"]}>
+        <input
+          className={styles["search-bar"]}
+          placeholder={Locale.NewChat.More}
+          type="text"
+          onClick={() => navigate(Path.Masks)}
+        />
+
+        <IconButton
+          text={Locale.NewChat.Skip}
+          onClick={() => startChat()}
+          icon={<AddIcon />}
+          type="primary"
+          shadow
+        />
+      </div>
 
       <div className={styles["masks"]}>
         {groups.map((masks, i) => (

app/components/settings.tsx

@@ -137,10 +137,7 @@ export function Settings() {
   const config = useAppConfig();
   const updateConfig = config.update;
   const resetConfig = config.reset;
-  const [clearAllData, clearSessions] = useChatStore((state) => [
-    state.clearAllData,
-    state.clearSessions,
-  ]);
+  const chatStore = useChatStore();
 
   const updateStore = useUpdateStore();
   const [checkingUpdate, setCheckingUpdate] = useState(false);
@@ -160,9 +157,9 @@ export function Settings() {
     subscription: updateStore.subscription,
   };
   const [loadingUsage, setLoadingUsage] = useState(false);
-  function checkUsage() {
+  function checkUsage(force = false) {
     setLoadingUsage(true);
-    updateStore.updateUsage().finally(() => {
+    updateStore.updateUsage(force).finally(() => {
       setLoadingUsage(false);
     });
   }
@@ -216,11 +213,8 @@ export function Settings() {
             <IconButton
               icon={<ClearIcon />}
               onClick={() => {
-                const confirmed = window.confirm(
-                  `${Locale.Settings.Actions.ConfirmClearAll.Confirm}`,
-                );
-                if (confirmed) {
-                  clearSessions();
+                if (confirm(Locale.Settings.Actions.ConfirmClearAll)) {
+                  chatStore.clearAllData();
                 }
               }}
               bordered
@@ -231,10 +225,7 @@ export function Settings() {
             <IconButton
               icon={<ResetIcon />}
               onClick={() => {
-                const confirmed = window.confirm(
-                  `${Locale.Settings.Actions.ConfirmResetAll.Confirm}`,
-                );
-                if (confirmed) {
+                if (confirm(Locale.Settings.Actions.ConfirmResetAll)) {
                   resetConfig();
                 }
               }}
@@ -370,26 +361,34 @@ export function Settings() {
             ></InputRange>
           </ListItem>
 
-          <ListItem title={Locale.Settings.TightBorder}>
+          <ListItem
+            title={Locale.Settings.SendPreviewBubble.Title}
+            subTitle={Locale.Settings.SendPreviewBubble.SubTitle}
+          >
             <input
               type="checkbox"
-              checked={config.tightBorder}
+              checked={config.sendPreviewBubble}
               onChange={(e) =>
                 updateConfig(
-                  (config) => (config.tightBorder = e.currentTarget.checked),
+                  (config) =>
+                    (config.sendPreviewBubble = e.currentTarget.checked),
                 )
               }
             ></input>
           </ListItem>
 
-          <ListItem title={Locale.Settings.SendPreviewBubble}>
+          <ListItem
+            title={Locale.Settings.Mask.Title}
+            subTitle={Locale.Settings.Mask.SubTitle}
+          >
             <input
               type="checkbox"
-              checked={config.sendPreviewBubble}
+              checked={!config.dontShowMaskSplashScreen}
               onChange={(e) =>
                 updateConfig(
                   (config) =>
-                    (config.sendPreviewBubble = e.currentTarget.checked),
+                    (config.dontShowMaskSplashScreen =
+                      !e.currentTarget.checked),
                 )
               }
             ></input>
@@ -448,7 +447,7 @@ export function Settings() {
               <IconButton
                 icon={<ResetIcon></ResetIcon>}
                 text={Locale.Settings.Usage.Check}
-                onClick={checkUsage}
+                onClick={() => checkUsage(true)}
               />
             )}
           </ListItem>

app/components/sidebar.tsx

@@ -87,6 +87,8 @@ export function SideBar(props: { className?: string }) {
   const { onDragMouseDown, shouldNarrow } = useDragSideBar();
   const navigate = useNavigate();
 
+  const config = useAppConfig();
+
   return (
     <div
       className={`${styles.sidebar} ${props.className} ${
@@ -106,14 +108,14 @@ export function SideBar(props: { className?: string }) {
       <div className={styles["sidebar-header-bar"]}>
         <IconButton
           icon={<MaskIcon />}
-          text="Mask"
+          text={shouldNarrow ? undefined : Locale.Mask.Name}
           className={styles["sidebar-bar-button"]}
-          onClick={() => navigate(Path.Masks)}
+          onClick={() => navigate(Path.NewChat, { state: { fromHome: true } })}
           shadow
         />
         <IconButton
           icon={<PluginIcon />}
-          text="Plugins"
+          text={shouldNarrow ? undefined : Locale.Plugin.Name}
           className={styles["sidebar-bar-button"]}
           onClick={() => showToast(Locale.WIP)}
           shadow
@@ -155,7 +157,11 @@ export function SideBar(props: { className?: string }) {
             icon={<AddIcon />}
             text={shouldNarrow ? undefined : Locale.Home.NewChat}
             onClick={() => {
-              navigate(Path.NewChat);
+              if (config.dontShowMaskSplashScreen) {
+                chatStore.newSession();
+              } else {
+                navigate(Path.NewChat);
+              }
             }}
             shadow
           />

app/locales/cn.ts

@@ -45,7 +45,7 @@ const cn = {
   Memory: {
     Title: "历史摘要",
     EmptyContent: "对话内容过短，无需总结",
-    Send: "启用总结并发送摘要",
+    Send: "自动压缩聊天记录并作为上下文发送",
     Copy: "复制摘要",
     Reset: "重置对话",
     ResetConfirm: "重置后将清空当前对话记录以及历史摘要，确认重置？",
@@ -63,12 +63,8 @@ const cn = {
       ClearAll: "清除所有数据",
       ResetAll: "重置所有选项",
       Close: "关闭",
-      ConfirmResetAll: {
-        Confirm: "确认清除所有配置？",
-      },
-      ConfirmClearAll: {
-        Confirm: "确认清除所有聊天记录？",
-      },
+      ConfirmResetAll: "确认重置所有配置？",
+      ConfirmClearAll: "确认清除所有数据？",
     },
     Lang: {
       Name: "Language",
@@ -101,7 +97,14 @@ const cn = {
     SendKey: "发送键",
     Theme: "主题",
     TightBorder: "无边框模式",
-    SendPreviewBubble: "发送预览气泡",
+    SendPreviewBubble: {
+      Title: "预览气泡",
+      SubTitle: "在预览气泡中预览 Markdown 内容",
+    },
+    Mask: {
+      Title: "面具启动页",
+      SubTitle: "新建聊天时，展示面具启动页",
+    },
     Prompt: {
       Disable: {
         Title: "禁用提示词自动补全",
@@ -130,6 +133,7 @@ const cn = {
       SubTitle: "使用自己的 Key 可绕过密码访问限制",
       Placeholder: "OpenAI API Key",
     },
+
     Usage: {
       Title: "余额查询",
       SubTitle(used: any, total: any) {
@@ -170,7 +174,6 @@ const cn = {
       Summarize:
         "简要总结一下你和用户的对话，用作后续的上下文提示 prompt，控制在 200 字以内",
     },
-    ConfirmClearAll: "确认清除所有聊天、设置数据？",
   },
   Copy: {
     Success: "已写入剪切板",
@@ -181,7 +184,11 @@ const cn = {
     Edit: "当前对话设置",
     Add: "新增预设对话",
   },
+  Plugin: {
+    Name: "插件",
+  },
   Mask: {
+    Name: "面具",
     Page: {
       Title: "预设角色面具",
       SubTitle: (count: number) => `${count} 个预设角色定义`,
@@ -209,7 +216,9 @@ const cn = {
   },
   NewChat: {
     Return: "返回",
-    Skip: "跳过",
+    Skip: "直接开始",
+    NotShow: "不再展示",
+    ConfirmNoShow: "确认禁用？禁用后可以随时在设置中重新启用。",
     Title: "挑选一个面具",
     SubTitle: "现在开始，与面具背后的灵魂思维碰撞",
     More: "搜索更多",

app/locales/de.ts

@@ -65,12 +65,9 @@ const de: LocaleType = {
       ClearAll: "Alle Daten löschen",
       ResetAll: "Alle Einstellungen zurücksetzen",
       Close: "Schließen",
-      ConfirmResetAll: {
-        Confirm: "Möchten Sie wirklich alle Konfigurationen zurücksetzen?",
-      },
-      ConfirmClearAll: {
-        Confirm: "Möchten Sie wirklich alle Chats zurücksetzen?",
-      },
+      ConfirmResetAll:
+        "Möchten Sie wirklich alle Konfigurationen zurücksetzen?",
+      ConfirmClearAll: "Möchten Sie wirklich alle Chats zurücksetzen?",
     },
     Lang: {
       Name: "Language", // ATTENTION: if you wanna add a new translation, please do not translate this value, leave it as `Language`
@@ -102,7 +99,14 @@ const de: LocaleType = {
     SendKey: "Senden-Taste",
     Theme: "Erscheinungsbild",
     TightBorder: "Enger Rahmen",
-    SendPreviewBubble: "Vorschau-Bubble senden",
+    SendPreviewBubble: {
+      Title: "Vorschau-Bubble senden",
+      SubTitle: "Preview markdown in bubble",
+    },
+    Mask: {
+      Title: "Mask Splash Screen",
+      SubTitle: "Show a mask splash screen before starting new chat",
+    },
     Prompt: {
       Disable: {
         Title: "Autovervollständigung deaktivieren",
@@ -176,8 +180,6 @@ const de: LocaleType = {
       Summarize:
         "Fassen Sie unsere Diskussion kurz in 200 Wörtern oder weniger zusammen, um sie als Pronpt für zukünftige Gespräche zu verwenden.",
     },
-    ConfirmClearAll:
-      "Bestätigen Sie, um alle Chat- und Einstellungsdaten zu löschen?",
   },
   Copy: {
     Success: "In die Zwischenablage kopiert",
@@ -189,7 +191,11 @@ const de: LocaleType = {
     Edit: "Kontext- und Gedächtnis-Prompts",
     Add: "Hinzufügen",
   },
+  Plugin: {
+    Name: "Plugin",
+  },
   Mask: {
+    Name: "Mask",
     Page: {
       Title: "Prompt Template",
       SubTitle: (count: number) => `${count} prompt templates`,
@@ -221,6 +227,8 @@ const de: LocaleType = {
     Title: "Pick a Mask",
     SubTitle: "Chat with the Soul behind the Mask",
     More: "Find More",
+    NotShow: "Not Show Again",
+    ConfirmNoShow: "Confirm to disable？You can enable it in settings later.",
   },
 };
 

app/locales/en.ts

@@ -65,12 +65,8 @@ const en: LocaleType = {
       ClearAll: "Clear All Data",
       ResetAll: "Reset All Settings",
       Close: "Close",
-      ConfirmResetAll: {
-        Confirm: "Are you sure you want to reset all configurations?",
-      },
-      ConfirmClearAll: {
-        Confirm: "Are you sure you want to reset all chat?",
-      },
+      ConfirmResetAll: "Are you sure you want to reset all configurations?",
+      ConfirmClearAll: "Are you sure you want to reset all data?",
     },
     Lang: {
       Name: "Language", // ATTENTION: if you wanna add a new translation, please do not translate this value, leave it as `Language`
@@ -102,7 +98,14 @@ const en: LocaleType = {
     SendKey: "Send Key",
     Theme: "Theme",
     TightBorder: "Tight Border",
-    SendPreviewBubble: "Send Preview Bubble",
+    SendPreviewBubble: {
+      Title: "Send Preview Bubble",
+      SubTitle: "Preview markdown in bubble",
+    },
+    Mask: {
+      Title: "Mask Splash Screen",
+      SubTitle: "Show a mask splash screen before starting new chat",
+    },
     Prompt: {
       Disable: {
         Title: "Disable auto-completion",
@@ -174,7 +177,6 @@ const en: LocaleType = {
       Summarize:
         "Summarize our discussion briefly in 200 words or less to use as a prompt for future context.",
     },
-    ConfirmClearAll: "Confirm to clear all chat and setting data?",
   },
   Copy: {
     Success: "Copied to clipboard",
@@ -185,7 +187,11 @@ const en: LocaleType = {
     Edit: "Contextual and Memory Prompts",
     Add: "Add a Prompt",
   },
+  Plugin: {
+    Name: "Plugin",
+  },
   Mask: {
+    Name: "Mask",
     Page: {
       Title: "Prompt Template",
       SubTitle: (count: number) => `${count} prompt templates`,
@@ -217,6 +223,8 @@ const en: LocaleType = {
     Title: "Pick a Mask",
     SubTitle: "Chat with the Soul behind the Mask",
     More: "Find More",
+    NotShow: "Not Show Again",
+    ConfirmNoShow: "Confirm to disable？You can enable it in settings later.",
   },
 };
 

app/locales/es.ts

@@ -65,12 +65,8 @@ const es: LocaleType = {
       ClearAll: "Borrar todos los datos",
       ResetAll: "Restablecer todas las configuraciones",
       Close: "Cerrar",
-      ConfirmResetAll: {
-        Confirm: "Are you sure you want to reset all configurations?",
-      },
-      ConfirmClearAll: {
-        Confirm: "Are you sure you want to reset all chat?",
-      },
+      ConfirmResetAll: "Are you sure you want to reset all configurations?",
+      ConfirmClearAll: "Are you sure you want to reset all chat?",
     },
     Lang: {
       Name: "Language",
@@ -102,7 +98,14 @@ const es: LocaleType = {
     SendKey: "Tecla de envío",
     Theme: "Tema",
     TightBorder: "Borde ajustado",
-    SendPreviewBubble: "Enviar burbuja de vista previa",
+    SendPreviewBubble: {
+      Title: "Enviar burbuja de vista previa",
+      SubTitle: "Preview markdown in bubble",
+    },
+    Mask: {
+      Title: "Mask Splash Screen",
+      SubTitle: "Show a mask splash screen before starting new chat",
+    },
     Prompt: {
       Disable: {
         Title: "Desactivar autocompletado",
@@ -174,8 +177,6 @@ const es: LocaleType = {
       Summarize:
         "Resuma nuestra discusión brevemente en 200 caracteres o menos para usarlo como un recordatorio para futuros contextos.",
     },
-    ConfirmClearAll:
-      "¿Confirmar para borrar todos los datos de chat y configuración?",
   },
   Copy: {
     Success: "Copiado al portapapeles",
@@ -187,7 +188,11 @@ const es: LocaleType = {
     Edit: "Contextual and Memory Prompts",
     Add: "Add One",
   },
+  Plugin: {
+    Name: "Plugin",
+  },
   Mask: {
+    Name: "Mask",
     Page: {
       Title: "Prompt Template",
       SubTitle: (count: number) => `${count} prompt templates`,
@@ -219,6 +224,8 @@ const es: LocaleType = {
     Title: "Pick a Mask",
     SubTitle: "Chat with the Soul behind the Mask",
     More: "Find More",
+    NotShow: "Not Show Again",
+    ConfirmNoShow: "Confirm to disable？You can enable it in settings later.",
   },
 };
 

app/locales/it.ts

@@ -65,12 +65,8 @@ const it: LocaleType = {
       ClearAll: "Cancella tutti i dati",
       ResetAll: "Resetta tutte le impostazioni",
       Close: "Chiudi",
-      ConfirmResetAll: {
-        Confirm: "Sei sicuro vuoi cancellare tutte le impostazioni?",
-      },
-      ConfirmClearAll: {
-        Confirm: "Sei sicuro vuoi cancellare tutte le chat?",
-      },
+      ConfirmResetAll: "Sei sicuro vuoi cancellare tutte le impostazioni?",
+      ConfirmClearAll: "Sei sicuro vuoi cancellare tutte le chat?",
     },
     Lang: {
       Name: "Lingue",
@@ -102,7 +98,14 @@ const it: LocaleType = {
     SendKey: "Tasto invia",
     Theme: "Tema",
     TightBorder: "Schermo intero",
-    SendPreviewBubble: "Anteprima di digitazione",
+    SendPreviewBubble: {
+      Title: "Anteprima di digitazione",
+      SubTitle: "Preview markdown in bubble",
+    },
+    Mask: {
+      Title: "Mask Splash Screen",
+      SubTitle: "Show a mask splash screen before starting new chat",
+    },
     Prompt: {
       Disable: {
         Title: "Disabilita l'auto completamento",
@@ -175,8 +178,6 @@ const it: LocaleType = {
       Summarize:
         "Riassumi brevemente la nostra discussione in 200 caratteri o meno per usarla come spunto per una futura conversazione.",
     },
-    ConfirmClearAll:
-      "Confermi la cancellazione di tutti i dati della chat e delle impostazioni?",
   },
   Copy: {
     Success: "Copiato sugli appunti",
@@ -188,7 +189,11 @@ const it: LocaleType = {
     Edit: "Prompt contestuali e di memoria",
     Add: "Aggiungi altro",
   },
+  Plugin: {
+    Name: "Plugin",
+  },
   Mask: {
+    Name: "Mask",
     Page: {
       Title: "Prompt Template",
       SubTitle: (count: number) => `${count} prompt templates`,
@@ -220,6 +225,8 @@ const it: LocaleType = {
     Title: "Pick a Mask",
     SubTitle: "Chat with the Soul behind the Mask",
     More: "Find More",
+    NotShow: "Not Show Again",
+    ConfirmNoShow: "Confirm to disable？You can enable it in settings later.",
   },
 };
 

app/locales/jp.ts

@@ -65,12 +65,8 @@ const jp: LocaleType = {
       ClearAll: "すべてのデータをクリア",
       ResetAll: "すべてのオプションをリセット",
       Close: "閉じる",
-      ConfirmResetAll: {
-        Confirm: "すべての設定をリセットしてもよろしいですか？",
-      },
-      ConfirmClearAll: {
-        Confirm: "すべてのチャットをリセットしてもよろしいですか？",
-      },
+      ConfirmResetAll: "すべての設定をリセットしてもよろしいですか？",
+      ConfirmClearAll: "すべてのチャットをリセットしてもよろしいですか？",
     },
     Lang: {
       Name: "Language",
@@ -103,7 +99,14 @@ const jp: LocaleType = {
     SendKey: "送信キー",
     Theme: "テーマ",
     TightBorder: "ボーダーレスモード",
-    SendPreviewBubble: "プレビューバブルの送信",
+    SendPreviewBubble: {
+      Title: "プレビューバブルの送信",
+      SubTitle: "在预览气泡中预览 Markdown 内容",
+    },
+    Mask: {
+      Title: "面具启动页",
+      SubTitle: "新建聊天时，展示面具启动页",
+    },
     Prompt: {
       Disable: {
         Title: "プロンプトの自動補完を無効にする",
@@ -176,8 +179,6 @@ const jp: LocaleType = {
       Summarize:
         "あなたとユーザの会話を簡潔にまとめて、後続のコンテキストプロンプトとして使ってください。200字以内に抑えてください。",
     },
-    ConfirmClearAll:
-      "すべてのチャット、設定データをクリアしてもよろしいですか？",
   },
   Copy: {
     Success: "クリップボードに書き込みました",
@@ -188,7 +189,9 @@ const jp: LocaleType = {
     Edit: "前置コンテキストと履歴メモリ",
     Add: "新規追加",
   },
+  Plugin: { Name: "插件" },
   Mask: {
+    Name: "面具",
     Page: {
       Title: "预设角色面具",
       SubTitle: (count: number) => `${count} 个预设角色定义`,
@@ -220,6 +223,8 @@ const jp: LocaleType = {
     Title: "挑选一个面具",
     SubTitle: "现在开始，与面具背后的灵魂思维碰撞",
     More: "搜索更多",
+    NotShow: "不再展示",
+    ConfirmNoShow: "确认禁用？禁用后可以随时在设置中重新启用。",
   },
 };
 

app/locales/tr.ts

@@ -65,12 +65,8 @@ const tr: LocaleType = {
       ClearAll: "Tüm Verileri Temizle",
       ResetAll: "Tüm Ayarları Sıfırla",
       Close: "Kapat",
-      ConfirmResetAll: {
-        Confirm: "Tüm ayarları sıfırlamak istediğinizden emin misiniz?",
-      },
-      ConfirmClearAll: {
-        Confirm: "Tüm sohbeti sıfırlamak istediğinizden emin misiniz?",
-      },
+      ConfirmResetAll: "Tüm ayarları sıfırlamak istediğinizden emin misiniz?",
+      ConfirmClearAll: "Tüm sohbeti sıfırlamak istediğinizden emin misiniz?",
     },
     Lang: {
       Name: "Language", // ATTENTION: if you wanna add a new translation, please do not translate this value, leave it as `Language`
@@ -102,7 +98,14 @@ const tr: LocaleType = {
     SendKey: "Gönder Tuşu",
     Theme: "Tema",
     TightBorder: "Tam Ekran",
-    SendPreviewBubble: "Mesaj Önizleme Balonu",
+    SendPreviewBubble: {
+      Title: "Mesaj Önizleme Balonu",
+      SubTitle: "Preview markdown in bubble",
+    },
+    Mask: {
+      Title: "Mask Splash Screen",
+      SubTitle: "Show a mask splash screen before starting new chat",
+    },
     Prompt: {
       Disable: {
         Title: "Otomatik tamamlamayı devre dışı bırak",
@@ -176,8 +179,6 @@ const tr: LocaleType = {
       Summarize:
         "Gelecekteki bağlam için bir bilgi istemi olarak kullanmak üzere tartışmamızı en fazla 200 kelimeyle özetleyin.",
     },
-    ConfirmClearAll:
-      "Tüm sohbet ve ayar verilerini temizlemeyi onaylıyor musunuz?",
   },
   Copy: {
     Success: "Panoya kopyalandı",
@@ -188,7 +189,11 @@ const tr: LocaleType = {
     Edit: "Bağlamsal ve Bellek Komutları",
     Add: "Yeni Ekle",
   },
+  Plugin: {
+    Name: "Plugin",
+  },
   Mask: {
+    Name: "Mask",
     Page: {
       Title: "Prompt Template",
       SubTitle: (count: number) => `${count} prompt templates`,
@@ -220,6 +225,8 @@ const tr: LocaleType = {
     Title: "Pick a Mask",
     SubTitle: "Chat with the Soul behind the Mask",
     More: "Find More",
+    NotShow: "Not Show Again",
+    ConfirmNoShow: "Confirm to disable？You can enable it in settings later.",
   },
 };
 

app/locales/tw.ts

@@ -63,12 +63,8 @@ const tw: LocaleType = {
       ClearAll: "清除所有資料",
       ResetAll: "重設所有設定",
       Close: "關閉",
-      ConfirmResetAll: {
-        Confirm: "您確定要重設所有設定嗎？",
-      },
-      ConfirmClearAll: {
-        Confirm: "您確定要清除所有聊天嗎？",
-      },
+      ConfirmResetAll: "您確定要重設所有設定嗎？",
+      ConfirmClearAll: "您確定要清除所有数据嗎？",
     },
     Lang: {
       Name: "Language",
@@ -100,7 +96,14 @@ const tw: LocaleType = {
     SendKey: "發送鍵",
     Theme: "主題",
     TightBorder: "緊湊邊框",
-    SendPreviewBubble: "發送預覽氣泡",
+    SendPreviewBubble: {
+      Title: "預覽氣泡",
+      SubTitle: "在预览气泡中预览 Markdown 内容",
+    },
+    Mask: {
+      Title: "面具启动页",
+      SubTitle: "新建聊天时，展示面具启动页",
+    },
     Prompt: {
       Disable: {
         Title: "停用提示詞自動補齊",
@@ -169,7 +172,6 @@ const tw: LocaleType = {
       Summarize:
         "Use the language used by the user (e.g. en-us for english conversation, zh-hant for chinese conversation, etc.) to summarise the conversation in at most 200 words. The summary will be used as prompt for you to continue the conversation in the future.",
     },
-    ConfirmClearAll: "確認清除所有對話、設定？",
   },
   Copy: {
     Success: "已複製到剪貼簿中",
@@ -180,7 +182,9 @@ const tw: LocaleType = {
     Edit: "前置上下文和歷史記憶",
     Add: "新增一條",
   },
+  Plugin: { Name: "插件" },
   Mask: {
+    Name: "面具",
     Page: {
       Title: "预设角色面具",
       SubTitle: (count: number) => `${count} 个预设角色定义`,
@@ -212,6 +216,8 @@ const tw: LocaleType = {
     Title: "挑选一个面具",
     SubTitle: "现在开始，与面具背后的灵魂思维碰撞",
     More: "搜索更多",
+    NotShow: "不再展示",
+    ConfirmNoShow: "确认禁用？禁用后可以随时在设置中重新启用。",
   },
 };
 

app/store/chat.ts

@@ -319,7 +319,10 @@ export const useChatStore = create<ChatStore>()(
 
         return {
           role: "system",
-          content: Locale.Store.Prompt.History(session.memoryPrompt),
+          content:
+            session.memoryPrompt.length > 0
+              ? Locale.Store.Prompt.History(session.memoryPrompt)
+              : "",
           date: "",
         } as Message;
       },
@@ -481,10 +484,8 @@ export const useChatStore = create<ChatStore>()(
       },
 
       clearAllData() {
-        if (confirm(Locale.Store.ConfirmClearAll)) {
-          localStorage.clear();
-          location.reload();
-        }
+        localStorage.clear();
+        location.reload();
       },
     }),
     {

app/store/config.ts

@@ -28,6 +28,8 @@ export const DEFAULT_CONFIG = {
 
   disablePromptHint: false,
 
+  dontShowMaskSplashScreen: false, // dont show splash screen when create chat
+
   modelConfig: {
     model: "gpt-3.5-turbo" as ModelType,
     temperature: 1,
@@ -138,6 +140,7 @@ export const useAppConfig = create<ChatConfigStore>()(
         state.modelConfig.sendMemory = true;
         state.modelConfig.historyMessageCount = 4;
         state.modelConfig.compressMessageLengthThreshold = 1000;
+        state.dontShowMaskSplashScreen = false;
 
         return state;
       },