Merge remote-tracking branch 'connectai/main' into feature/using-tauri-fetch

2025-08-08 21:17:24 +08:00 · 2024-09-29 19:44:28 +08:00
parent 3898c507c4 f9d6f4f9da
commit dd77ad5d74
48 changed files with 848 additions and 155 deletions
--- a/app/api/google.ts
+++ b/app/api/google.ts
@@ -91,7 +91,7 @@ async function request(req: NextRequest, apiKey: string) {
    },
    10 * 60 * 1000,
  );
-  const fetchUrl = `${baseUrl}${path}?key=${apiKey}${
+  const fetchUrl = `${baseUrl}${path}${
    req?.nextUrl?.searchParams?.get("alt") === "sse" ? "&alt=sse" : ""
  }`;

@@ -100,6 +100,9 @@ async function request(req: NextRequest, apiKey: string) {
    headers: {
      "Content-Type": "application/json",
      "Cache-Control": "no-store",
+      "x-google-api-key":
+        req.headers.get("x-google-api-key") ||
+        (req.headers.get("Authorization") ?? "").replace("Bearer ", ""),
    },
    method: req.method,
    body: req.body,
--- a/app/client/api.ts
+++ b/app/client/api.ts
@@ -272,7 +272,13 @@ export function getHeaders(ignoreHeaders: boolean = false) {
  }

  function getAuthHeader(): string {
-    return isAzure ? "api-key" : isAnthropic ? "x-api-key" : "Authorization";
+    return isAzure
+      ? "api-key"
+      : isAnthropic
+      ? "x-api-key"
+      : isGoogle
+      ? "x-goog-api-key"
+      : "Authorization";
  }

  const {
@@ -283,14 +289,15 @@ export function getHeaders(ignoreHeaders: boolean = false) {
    apiKey,
    isEnabledAccessControl,
  } = getConfig();
-  // when using google api in app, not set auth header
-  if (isGoogle && clientConfig?.isApp) return headers;
  // when using baidu api in app, not set auth header
  if (isBaidu && clientConfig?.isApp) return headers;

  const authHeader = getAuthHeader();

-  const bearerToken = getBearerToken(apiKey, isAzure || isAnthropic);
+  const bearerToken = getBearerToken(
+    apiKey,
+    isAzure || isAnthropic || isGoogle,
+  );

  if (bearerToken) {
    headers[authHeader] = bearerToken;
--- a/app/client/platforms/google.ts
+++ b/app/client/platforms/google.ts
@@ -48,10 +48,6 @@ export class GeminiProApi implements LLMApi {
    let chatPath = [baseUrl, path].join("/");

    chatPath += chatPath.includes("?") ? "&alt=sse" : "?alt=sse";
-    // if chatPath.startsWith('http') then add key in query string
-    if (chatPath.startsWith("http") && accessStore.googleApiKey) {
-      chatPath += `&key=${accessStore.googleApiKey}`;
-    }
    return chatPath;
  }
  extractMessage(res: any) {
--- a/app/components/auth.module.scss
+++ b/app/components/auth.module.scss
@@ -1,12 +1,70 @@
 .auth-page {
  display: flex;
-  justify-content: center;
+  justify-content: flex-start;
  align-items: center;
  height: 100%;
  width: 100%;
  flex-direction: column;
+  .top-banner {
+    position: relative;
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 12px 64px;
+    box-sizing: border-box;
+    background: var(--second);
+    .top-banner-inner {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      font-size: 14px;
+      line-height: 150%;
+      span {
+        gap: 8px;
+        a {
+          display: inline-flex;
+          align-items: center;
+          text-decoration: none;
+          margin-left: 8px;
+          color: var(--primary);
+        }
+      }
+    }
+    .top-banner-close {
+      cursor: pointer;
+      position: absolute;
+      top: 50%;
+      right: 48px;
+      transform: translateY(-50%);
+    }
+  }
+
+  @media (max-width: 600px) {
+    .top-banner {
+      padding: 12px 24px 12px 12px;
+      .top-banner-close {
+        right: 10px;
+      }
+      .top-banner-inner {
+        .top-banner-logo {
+          margin-right: 8px;
+        }
+      }
+    }
+  }
+
+  .auth-header {
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+    padding: 10px;
+    box-sizing: border-box;
+    animation: slide-in-from-top ease 0.3s;
+  }

  .auth-logo {
+    margin-top: 10vh;
    transform: scale(1.4);
  }

@@ -14,6 +72,7 @@
    font-size: 24px;
    font-weight: bold;
    line-height: 2;
+    margin-bottom: 1vh;
  }

  .auth-tips {
@@ -24,6 +83,10 @@
    margin: 3vh 0;
  }

+  .auth-input-second {
+    margin: 0 0 3vh 0;
+  }
+
  .auth-actions {
    display: flex;
    justify-content: center;
--- a/app/components/auth.tsx
+++ b/app/components/auth.tsx
@@ -1,21 +1,34 @@
 import styles from "./auth.module.scss";
 import { IconButton } from "./button";
-
+import { useState, useEffect } from "react";
 import { useNavigate } from "react-router-dom";
-import { Path } from "../constant";
+import { Path, SAAS_CHAT_URL } from "../constant";
 import { useAccessStore } from "../store";
 import Locale from "../locales";
-
+import Delete from "../icons/close.svg";
+import Arrow from "../icons/arrow.svg";
+import Logo from "../icons/logo.svg";
+import { useMobileScreen } from "@/app/utils";
 import BotIcon from "../icons/bot.svg";
-import { useEffect } from "react";
 import { getClientConfig } from "../config/client";
+import LeftIcon from "@/app/icons/left.svg";
+import { safeLocalStorage } from "@/app/utils";
+import {
+  trackSettingsPageGuideToCPaymentClick,
+  trackAuthorizationPageButtonToCPaymentClick,
+} from "../utils/auth-settings-events";
+const storage = safeLocalStorage();

 export function AuthPage() {
  const navigate = useNavigate();
  const accessStore = useAccessStore();
-
  const goHome = () => navigate(Path.Home);
  const goChat = () => navigate(Path.Chat);
+  const goSaas = () => {
+    trackAuthorizationPageButtonToCPaymentClick();
+    window.location.href = SAAS_CHAT_URL;
+  };
+
  const resetAccessCode = () => {
    accessStore.update((access) => {
      access.openaiApiKey = "";
@@ -32,6 +45,14 @@ export function AuthPage() {

  return (
    <div className={styles["auth-page"]}>
+      <TopBanner></TopBanner>
+      <div className={styles["auth-header"]}>
+        <IconButton
+          icon={<LeftIcon />}
+          text={Locale.Auth.Return}
+          onClick={() => navigate(Path.Home)}
+        ></IconButton>
+      </div>
      <div className={`no-dark ${styles["auth-logo"]}`}>
        <BotIcon />
      </div>
@@ -65,7 +86,7 @@ export function AuthPage() {
            }}
          />
          <input
-            className={styles["auth-input"]}
+            className={styles["auth-input-second"]}
            type="password"
            placeholder={Locale.Settings.Access.Google.ApiKey.Placeholder}
            value={accessStore.googleApiKey}
@@ -85,13 +106,74 @@ export function AuthPage() {
          onClick={goChat}
        />
        <IconButton
-          text={Locale.Auth.Later}
+          text={Locale.Auth.SaasTips}
          onClick={() => {
-            resetAccessCode();
-            goHome();
+            goSaas();
          }}
        />
      </div>
    </div>
  );
 }
+
+function TopBanner() {
+  const [isHovered, setIsHovered] = useState(false);
+  const [isVisible, setIsVisible] = useState(true);
+  const isMobile = useMobileScreen();
+  useEffect(() => {
+    // 检查 localStorage 中是否有标记
+    const bannerDismissed = storage.getItem("bannerDismissed");
+    // 如果标记不存在，存储默认值并显示横幅
+    if (!bannerDismissed) {
+      storage.setItem("bannerDismissed", "false");
+      setIsVisible(true); // 显示横幅
+    } else if (bannerDismissed === "true") {
+      // 如果标记为 "true"，则隐藏横幅
+      setIsVisible(false);
+    }
+  }, []);
+
+  const handleMouseEnter = () => {
+    setIsHovered(true);
+  };
+
+  const handleMouseLeave = () => {
+    setIsHovered(false);
+  };
+
+  const handleClose = () => {
+    setIsVisible(false);
+    storage.setItem("bannerDismissed", "true");
+  };
+
+  if (!isVisible) {
+    return null;
+  }
+  return (
+    <div
+      className={styles["top-banner"]}
+      onMouseEnter={handleMouseEnter}
+      onMouseLeave={handleMouseLeave}
+    >
+      <div className={`${styles["top-banner-inner"]} no-dark`}>
+        <Logo className={styles["top-banner-logo"]}></Logo>
+        <span>
+          {Locale.Auth.TopTips}
+          <a
+            href={SAAS_CHAT_URL}
+            rel="stylesheet"
+            onClick={() => {
+              trackSettingsPageGuideToCPaymentClick();
+            }}
+          >
+            {Locale.Settings.Access.SaasStart.ChatNow}
+            <Arrow style={{ marginLeft: "4px" }} />
+          </a>
+        </span>
+      </div>
+      {(isHovered || isMobile) && (
+        <Delete className={styles["top-banner-close"]} onClick={handleClose} />
+      )}
+    </div>
+  );
+}
--- a/app/components/button.module.scss
+++ b/app/components/button.module.scss
@@ -5,7 +5,6 @@
  align-items: center;
  justify-content: center;
  padding: 10px;
-
  cursor: pointer;
  transition: all 0.3s ease;
  overflow: hidden;
--- a/app/components/markdown.tsx
+++ b/app/components/markdown.tsx
@@ -22,6 +22,8 @@ import {
 import { useChatStore } from "../store";
 import { IconButton } from "./button";

+import { useAppConfig } from "../store/config";
+
 export function Mermaid(props: { code: string }) {
  const ref = useRef<HTMLDivElement>(null);
  const [hasError, setHasError] = useState(false);
@@ -92,7 +94,9 @@ export function PreCode(props: { children: any }) {
    }
  }, 600);

-  const enableArtifacts = session.mask?.enableArtifacts !== false;
+  const config = useAppConfig();
+  const enableArtifacts =
+    session.mask?.enableArtifacts !== false && config.enableArtifacts;

  //Wrap the paragraph for plain-text
  useEffect(() => {
@@ -128,8 +132,9 @@ export function PreCode(props: { children: any }) {
          className="copy-code-button"
          onClick={() => {
            if (ref.current) {
-              const code = ref.current.innerText;
-              copyToClipboard(code);
+              copyToClipboard(
+                ref.current.querySelector("code")?.innerText ?? "",
+              );
            }
          }}
        ></span>
@@ -278,6 +283,20 @@ function _MarkDownContent(props: { content: string }) {
        p: (pProps) => <p {...pProps} dir="auto" />,
        a: (aProps) => {
          const href = aProps.href || "";
+          if (/\.(aac|mp3|opus|wav)$/.test(href)) {
+            return (
+              <figure>
+                <audio controls src={href}></audio>
+              </figure>
+            );
+          }
+          if (/\.(3gp|3g2|webm|ogv|mpeg|mp4|avi)$/.test(href)) {
+            return (
+              <video controls width="99.9%">
+                <source src={href} />
+              </video>
+            );
+          }
          const isInternal = /^\/#/i.test(href);
          const target = isInternal ? "_self" : aProps.target ?? "_blank";
          return <a {...aProps} target={target} />;
--- a/app/components/mask.tsx
+++ b/app/components/mask.tsx
@@ -166,21 +166,23 @@ export function MaskConfig(props: {
          ></input>
        </ListItem>

-        <ListItem
-          title={Locale.Mask.Config.Artifacts.Title}
-          subTitle={Locale.Mask.Config.Artifacts.SubTitle}
-        >
-          <input
-            aria-label={Locale.Mask.Config.Artifacts.Title}
-            type="checkbox"
-            checked={props.mask.enableArtifacts !== false}
-            onChange={(e) => {
-              props.updateMask((mask) => {
-                mask.enableArtifacts = e.currentTarget.checked;
-              });
-            }}
-          ></input>
-        </ListItem>
+        {globalConfig.enableArtifacts && (
+          <ListItem
+            title={Locale.Mask.Config.Artifacts.Title}
+            subTitle={Locale.Mask.Config.Artifacts.SubTitle}
+          >
+            <input
+              aria-label={Locale.Mask.Config.Artifacts.Title}
+              type="checkbox"
+              checked={props.mask.enableArtifacts !== false}
+              onChange={(e) => {
+                props.updateMask((mask) => {
+                  mask.enableArtifacts = e.currentTarget.checked;
+                });
+              }}
+            ></input>
+          </ListItem>
+        )}

        {!props.shouldSyncFromGlobal ? (
          <ListItem
--- a/app/components/model-config.module.scss
+++ b/app/components/model-config.module.scss
@@ -0,0 +1,7 @@
+.select-compress-model {
+  width: 60%;
+  select {
+    max-width: 100%;
+    white-space: normal;
+  }
+}
--- a/app/components/model-config.tsx
+++ b/app/components/model-config.tsx
@@ -6,6 +6,7 @@ import { InputRange } from "./input-range";
 import { ListItem, Select } from "./ui-lib";
 import { useAllModels } from "../utils/hooks";
 import { groupBy } from "lodash-es";
+import styles from "./model-config.module.scss";

 export function ModelConfigList(props: {
  modelConfig: ModelConfig;
@@ -242,6 +243,7 @@ export function ModelConfigList(props: {
        subTitle={Locale.Settings.CompressModel.SubTitle}
      >
        <Select
+          className={styles["select-compress-model"]}
          aria-label={Locale.Settings.CompressModel.Title}
          value={compressModelValue}
          onChange={(e) => {
--- a/app/components/plugin.module.scss
+++ b/app/components/plugin.module.scss
@@ -10,7 +10,29 @@
    max-height: 240px;
    overflow-y: auto;
    white-space: pre-wrap;
-    min-width: 300px;
+    min-width: 280px;
  }
 }

+.plugin-schema {
+  display: flex;
+  justify-content: flex-end;
+  flex-direction: row;
+
+  input {
+    margin-right: 20px;
+
+    @media screen and (max-width: 600px) {
+        margin-right: 0px;
+      }
+  }
+
+  @media screen and (max-width: 600px) {
+    flex-direction: column;
+    gap: 5px;
+
+    button {
+      padding: 10px;
+    }
+  }
+}
--- a/app/components/plugin.tsx
+++ b/app/components/plugin.tsx
@@ -12,7 +12,6 @@ import EditIcon from "../icons/edit.svg";
 import AddIcon from "../icons/add.svg";
 import CloseIcon from "../icons/close.svg";
 import DeleteIcon from "../icons/delete.svg";
-import EyeIcon from "../icons/eye.svg";
 import ConfirmIcon from "../icons/confirm.svg";
 import ReloadIcon from "../icons/reload.svg";
 import GithubIcon from "../icons/github.svg";
@@ -29,7 +28,6 @@ import {
 import Locale from "../locales";
 import { useNavigate } from "react-router-dom";
 import { useState } from "react";
-import { getClientConfig } from "../config/client";

 export function PluginPage() {
  const navigate = useNavigate();
@@ -209,19 +207,11 @@ export function PluginPage() {
                  </div>
                </div>
                <div className={styles["mask-actions"]}>
-                  {m.builtin ? (
-                    <IconButton
-                      icon={<EyeIcon />}
-                      text={Locale.Plugin.Item.View}
-                      onClick={() => setEditingPluginId(m.id)}
-                    />
-                  ) : (
-                    <IconButton
-                      icon={<EditIcon />}
-                      text={Locale.Plugin.Item.Edit}
-                      onClick={() => setEditingPluginId(m.id)}
-                    />
-                  )}
+                  <IconButton
+                    icon={<EditIcon />}
+                    text={Locale.Plugin.Item.Edit}
+                    onClick={() => setEditingPluginId(m.id)}
+                  />
                  {!m.builtin && (
                    <IconButton
                      icon={<DeleteIcon />}
@@ -325,30 +315,13 @@ export function PluginPage() {
                  ></PasswordInput>
                </ListItem>
              )}
-              {!getClientConfig()?.isApp && (
-                <ListItem
-                  title={Locale.Plugin.Auth.Proxy}
-                  subTitle={Locale.Plugin.Auth.ProxyDescription}
-                >
-                  <input
-                    type="checkbox"
-                    checked={editingPlugin?.usingProxy}
-                    style={{ minWidth: 16 }}
-                    onChange={(e) => {
-                      pluginStore.updatePlugin(editingPlugin.id, (plugin) => {
-                        plugin.usingProxy = e.currentTarget.checked;
-                      });
-                    }}
-                  ></input>
-                </ListItem>
-              )}
            </List>
            <List>
              <ListItem title={Locale.Plugin.EditModal.Content}>
-                <div style={{ display: "flex", justifyContent: "flex-end" }}>
+                <div className={pluginStyles["plugin-schema"]}>
                  <input
                    type="text"
-                    style={{ minWidth: 200, marginRight: 20 }}
+                    style={{ minWidth: 200 }}
                    onInput={(e) => setLoadUrl(e.currentTarget.value)}
                  ></input>
                  <IconButton
--- a/app/components/settings.module.scss
+++ b/app/components/settings.module.scss
@@ -72,3 +72,9 @@
    }
  }
 }
+
+.subtitle-button {
+  button {
+    overflow:visible ;
+  }
+}
--- a/app/components/settings.tsx
+++ b/app/components/settings.tsx
@@ -9,6 +9,7 @@ import CopyIcon from "../icons/copy.svg";
 import ClearIcon from "../icons/clear.svg";
 import LoadingIcon from "../icons/three-dots.svg";
 import EditIcon from "../icons/edit.svg";
+import FireIcon from "../icons/fire.svg";
 import EyeIcon from "../icons/eye.svg";
 import DownloadIcon from "../icons/download.svg";
 import UploadIcon from "../icons/upload.svg";
@@ -18,7 +19,7 @@ import ConfirmIcon from "../icons/confirm.svg";
 import ConnectionIcon from "../icons/connection.svg";
 import CloudSuccessIcon from "../icons/cloud-success.svg";
 import CloudFailIcon from "../icons/cloud-fail.svg";
-
+import { trackSettingsPageGuideToCPaymentClick } from "../utils/auth-settings-events";
 import {
  Input,
  List,
@@ -69,6 +70,7 @@ import {
  UPDATE_URL,
  Stability,
  Iflytek,
+  SAAS_CHAT_URL,
 } from "../constant";
 import { Prompt, SearchService, usePromptStore } from "../store/prompt";
 import { ErrorBoundary } from "./error";
@@ -686,6 +688,31 @@ export function Settings() {
    </ListItem>
  );

+  const saasStartComponent = (
+    <ListItem
+      className={styles["subtitle-button"]}
+      title={
+        Locale.Settings.Access.SaasStart.Title +
+        `${Locale.Settings.Access.SaasStart.Label}`
+      }
+      subTitle={Locale.Settings.Access.SaasStart.SubTitle}
+    >
+      <IconButton
+        aria={
+          Locale.Settings.Access.SaasStart.Title +
+          Locale.Settings.Access.SaasStart.ChatNow
+        }
+        icon={<FireIcon />}
+        type={"primary"}
+        text={Locale.Settings.Access.SaasStart.ChatNow}
+        onClick={() => {
+          trackSettingsPageGuideToCPaymentClick();
+          window.location.href = SAAS_CHAT_URL;
+        }}
+      />
+    </ListItem>
+  );
+
  const useCustomConfigComponent = // Conditionally render the following ListItem based on clientConfig.isApp
    !clientConfig?.isApp && ( // only show if isApp is false
      <ListItem
@@ -1465,6 +1492,23 @@ export function Settings() {
              }
            ></input>
          </ListItem>
+
+          <ListItem
+            title={Locale.Mask.Config.Artifacts.Title}
+            subTitle={Locale.Mask.Config.Artifacts.SubTitle}
+          >
+            <input
+              aria-label={Locale.Mask.Config.Artifacts.Title}
+              type="checkbox"
+              checked={config.enableArtifacts}
+              onChange={(e) =>
+                updateConfig(
+                  (config) =>
+                    (config.enableArtifacts = e.currentTarget.checked),
+                )
+              }
+            ></input>
+          </ListItem>
        </List>

        <SyncItems />
@@ -1541,6 +1585,7 @@ export function Settings() {
        </List>

        <List id={SlotID.CustomModel}>
+          {saasStartComponent}
          {accessCodeComponent}

          {!accessStore.hideUserApiKey && (
--- a/app/components/ui-lib.module.scss
+++ b/app/components/ui-lib.module.scss
@@ -62,14 +62,14 @@
    }
  }

-  &.vertical{
+  &.vertical {
    flex-direction: column;
    align-items: start;
-    .list-header{
-      .list-item-title{
+    .list-header {
+      .list-item-title {
        margin-bottom: 5px;
      }
-      .list-item-sub-title{
+      .list-item-sub-title {
        margin-bottom: 2px;
      }
    }
@@ -310,7 +310,7 @@
  justify-content: center;
  z-index: 999;

-  .selector-item-disabled{
+  .selector-item-disabled {
    opacity: 0.6;
  }

@@ -336,3 +336,4 @@
    }
  }
 }
+
--- a/app/constant.ts
+++ b/app/constant.ts
@@ -501,3 +501,6 @@ export const PLUGINS = [
  { name: "Stable Diffusion", path: Path.Sd },
  { name: "Search Chat", path: Path.SearchChat },
 ];
+
+export const SAAS_CHAT_URL = "https://nextchat.dev/chat";
+export const SAAS_CHAT_UTM_URL = "https://nextchat.dev/chat?utm=github";
--- a/app/icons/arrow.svg
+++ b/app/icons/arrow.svg
@@ -0,0 +1 @@
+<svg class="icon--SJP_d" width="16" height="16" fill="none" viewBox="0 0 16 16" style="min-width: 16px; min-height: 16px;"><g><path data-follow-fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M5.248 14.444a.625.625 0 0 1-.005-.884l5.068-5.12a.625.625 0 0 0 0-.88L5.243 2.44a.625.625 0 1 1 .889-.88l5.067 5.121c.723.73.723 1.907 0 2.638l-5.067 5.12a.625.625 0 0 1-.884.005Z" fill="currentColor"></path></g></svg>
--- a/app/icons/fire.svg
+++ b/app/icons/fire.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M12.832 21.801c3.126-.626 7.168-2.875 7.168-8.69c0-5.291-3.873-8.815-6.658-10.434c-.619-.36-1.342.113-1.342.828v1.828c0 1.442-.606 4.074-2.29 5.169c-.86.559-1.79-.278-1.894-1.298l-.086-.838c-.1-.974-1.092-1.565-1.87-.971C4.461 8.46 3 10.33 3 13.11C3 20.221 8.289 22 10.933 22q.232 0 .484-.015C10.111 21.874 8 21.064 8 18.444c0-2.05 1.495-3.435 2.631-4.11c.306-.18.663.055.663.41v.59c0 .45.175 1.155.59 1.637c.47.546 1.159-.026 1.214-.744c.018-.226.246-.37.442-.256c.641.375 1.46 1.175 1.46 2.473c0 2.048-1.129 2.99-2.168 3.357"/></svg>
--- a/app/icons/logo.svg
+++ b/app/icons/logo.svg
@@ -0,0 +1,19 @@
+<svg width="38.73" height="42" viewBox="0 0 221 240" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect x="160.697" y="38.125" width="65.007" height="145.932" rx="32.503" transform="rotate(21.987 160.697 38.125)" fill="url(#logo_svg__a)"></rect>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="m48.642 79.125-25.92 71.213c-6.139 16.869 2.558 35.52 19.427 41.66 16.868 6.14 35.52-2.558 41.66-19.426L94.23 143.94l-36.658-37.439a32.42 32.42 0 0 1-9.244-23.497c.033-1.326.14-2.62.314-3.879Z" fill="url(#logo_svg__b)"></path>
+  <path d="M172.578 132.787a32.765 32.765 0 0 1 8.981 24.238c-1.458 28.748-36.622 41.778-56.46 20.92l-67.644-71.122a32.763 32.763 0 0 1-8.981-24.238c1.457-28.748 36.622-41.778 56.46-20.92l67.644 71.122Z" fill="url(#logo_svg__c)" fill-opacity="0.96"></path>
+  <defs>
+    <linearGradient id="logo_svg__a" x1="215.063" y1="59.628" x2="160.714" y2="157.96" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#3EADFE"></stop>
+      <stop offset="1" stop-color="#2A7AFF"></stop>
+    </linearGradient>
+    <linearGradient id="logo_svg__b" x1="105.376" y1="84.416" x2="19.745" y2="131.163" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#01B3FF"></stop>
+      <stop offset="1" stop-color="#59ECFA"></stop>
+    </linearGradient>
+    <linearGradient id="logo_svg__c" x1="102.734" y1="136.396" x2="192.577" y2="155.859" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#023BFF" stop-opacity="0.82"></stop>
+      <stop offset="0.88" stop-color="#2D86FF" stop-opacity="0.76"></stop>
+    </linearGradient>
+  </defs>
+</svg>
--- a/app/locales/ar.ts
+++ b/app/locales/ar.ts
@@ -1,15 +1,21 @@
 import { SubmitKey } from "../store/config";
 import type { PartialLocaleType } from "./index";
 import { getClientConfig } from "../config/client";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const ar: PartialLocaleType = {
  WIP: "قريبًا...",
  Error: {
    Unauthorized: isApp
-      ? "تم اكتشاف مفتاح API غير صالح، يرجى الذهاب إلى [الإعدادات](/#/settings) للتحقق من صحة مفتاح API."
-      : "كلمة المرور غير صحيحة أو فارغة، يرجى الذهاب إلى [تسجيل الدخول](/#/auth) لإدخال كلمة مرور صحيحة، أو أدخل مفتاح OpenAI API الخاص بك في [الإعدادات](/#/settings).",
+      ? `😆 واجهت المحادثة بعض المشكلات، لا داعي للقلق:
+    \\ 1️⃣ إذا كنت ترغب في تجربة دون إعداد، [انقر هنا لبدء المحادثة فورًا 🚀](${SAAS_CHAT_UTM_URL})
+    \\ 2️⃣ إذا كنت تريد استخدام موارد OpenAI الخاصة بك، انقر [هنا](/#/settings) لتعديل الإعدادات ⚙️`
+      : `😆 واجهت المحادثة بعض المشكلات، لا داعي للقلق:
+    \ 1️⃣ إذا كنت ترغب في تجربة دون إعداد، [انقر هنا لبدء المحادثة فورًا 🚀](${SAAS_CHAT_UTM_URL})
+    \ 2️⃣ إذا كنت تستخدم إصدار النشر الخاص، انقر [هنا](/#/auth) لإدخال مفتاح الوصول 🔑
+    \ 3️⃣ إذا كنت تريد استخدام موارد OpenAI الخاصة بك، انقر [هنا](/#/settings) لتعديل الإعدادات ⚙️
+ `,
  },
  Auth: {
    Title: "تحتاج إلى كلمة مرور",
@@ -18,6 +24,10 @@ const ar: PartialLocaleType = {
    Input: "أدخل رمز الوصول هنا",
    Confirm: "تأكيد",
    Later: "في وقت لاحق",
+    Return: "عودة",
+    SaasTips: "الإعدادات معقدة، أريد استخدامه على الفور",
+    TopTips:
+      "🥳 عرض NextChat AI الأول، افتح الآن OpenAI o1, GPT-4o, Claude-3.5 وأحدث النماذج الكبيرة",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} محادثة`,
@@ -281,6 +291,13 @@ const ar: PartialLocaleType = {
    },

    Access: {
+      SaasStart: {
+        Title: "استخدام NextChat AI",
+        Label: "(أفضل حل من حيث التكلفة)",
+        SubTitle:
+          "مدعوم رسميًا من NextChat، جاهز للاستخدام بدون إعداد، يدعم أحدث النماذج الكبيرة مثل OpenAI o1 و GPT-4o و Claude-3.5",
+        ChatNow: "الدردشة الآن",
+      },
      AccessCode: {
        Title: "كلمة المرور للوصول",
        SubTitle: "قام المشرف بتمكين الوصول المشفر",
--- a/app/locales/bn.ts
+++ b/app/locales/bn.ts
@@ -1,15 +1,21 @@
 import { SubmitKey } from "../store/config";
 import type { PartialLocaleType } from "./index";
 import { getClientConfig } from "../config/client";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const bn: PartialLocaleType = {
  WIP: "শীঘ্রই আসছে...",
  Error: {
    Unauthorized: isApp
-      ? "অবৈধ API কী সনাক্ত করা হয়েছে, অনুগ্রহ করে [সেটিংস](/#/settings) পৃষ্ঠায় যান এবং নিশ্চিত করুন যে API কী সঠিকভাবে কনফিগার করা হয়েছে।"
-      : "অ্যাক্সেস পাসওয়ার্ড সঠিক নয় বা খালি, অনুগ্রহ করে [লগইন](/#/auth) পৃষ্ঠায় যান এবং সঠিক অ্যাক্সেস পাসওয়ার্ড প্রবেশ করান, অথবা [সেটিংস](/#/settings) পৃষ্ঠায় আপনার OpenAI API কী প্রবেশ করান।",
+      ? `😆 কথোপকথনে কিছু সমস্যা হয়েছে, চিন্তার কিছু নেই:
+    \\ 1️⃣ যদি আপনি শূন্য কনফিগারেশনে শুরু করতে চান, তাহলে [এখানে ক্লিক করে অবিলম্বে কথোপকথন শুরু করুন 🚀](${SAAS_CHAT_UTM_URL})
+    \\ 2️⃣ যদি আপনি আপনার নিজস্ব OpenAI সম্পদ ব্যবহার করতে চান, তাহলে [এখানে ক্লিক করুন](/#/settings) সেটিংস পরিবর্তন করতে ⚙️`
+      : `😆 কথোপকথনে কিছু সমস্যা হয়েছে, চিন্তার কিছু নেই:
+    \ 1️⃣ যদি আপনি শূন্য কনফিগারেশনে শুরু করতে চান, তাহলে [এখানে ক্লিক করে অবিলম্বে কথোপকথন শুরু করুন 🚀](${SAAS_CHAT_UTM_URL})
+    \ 2️⃣ যদি আপনি একটি প্রাইভেট ডেপ্লয়মেন্ট সংস্করণ ব্যবহার করেন, তাহলে [এখানে ক্লিক করুন](/#/auth) প্রবেশাধিকার কীগুলি প্রবেশ করতে 🔑
+    \ 3️⃣ যদি আপনি আপনার নিজস্ব OpenAI সম্পদ ব্যবহার করতে চান, তাহলে [এখানে ক্লিক করুন](/#/settings) সেটিংস পরিবর্তন করতে ⚙️
+ `,
  },
  Auth: {
    Title: "পাসওয়ার্ড প্রয়োজন",
@@ -18,6 +24,10 @@ const bn: PartialLocaleType = {
    Input: "এখানে অ্যাক্সেস কোড লিখুন",
    Confirm: "নিশ্চিত করুন",
    Later: "পরে বলুন",
+    Return: "ফিরে আসা",
+    SaasTips: "কনফিগারেশন খুব কঠিন, আমি অবিলম্বে ব্যবহার করতে চাই",
+    TopTips:
+      "🥳 NextChat AI প্রথম প্রকাশের অফার, এখনই OpenAI o1, GPT-4o, Claude-3.5 এবং সর্বশেষ বড় মডেলগুলি আনলক করুন",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} টি চ্যাট`,
@@ -284,6 +294,14 @@ const bn: PartialLocaleType = {
    },

    Access: {
+      SaasStart: {
+        Title: "NextChat AI ব্যবহার করুন",
+        Label: "(সেরা মূল্যসাশ্রয়ী সমাধান)",
+        SubTitle:
+          "NextChat কর্তৃক অফিসিয়াল রক্ষণাবেক্ষণ, শূন্য কনফিগারেশন ব্যবহার শুরু করুন, OpenAI o1, GPT-4o, Claude-3.5 সহ সর্বশেষ বড় মডেলগুলি সমর্থন করে",
+        ChatNow: "এখনই চ্যাট করুন",
+      },
+
      AccessCode: {
        Title: "অ্যাক্সেস পাসওয়ার্ড",
        SubTitle: "অ্যাডমিন এনক্রিপ্টেড অ্যাক্সেস সক্রিয় করেছেন",
--- a/app/locales/cn.ts
+++ b/app/locales/cn.ts
@@ -1,5 +1,6 @@
 import { getClientConfig } from "../config/client";
 import { SubmitKey } from "../store/config";
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";

 const isApp = !!getClientConfig()?.isApp;

@@ -7,16 +8,26 @@ const cn = {
  WIP: "该功能仍在开发中……",
  Error: {
    Unauthorized: isApp
-      ? "检测到无效 API Key，请前往[设置](/#/settings)页检查 API Key 是否配置正确。"
-      : "访问密码不正确或为空，请前往[登录](/#/auth)页输入正确的访问密码，或者在[设置](/#/settings)页填入你自己的 OpenAI API Key。",
+      ? `😆 对话遇到了一些问题，不用慌:
+       \\ 1️⃣ 想要零配置开箱即用，[点击这里立刻开启对话 🚀](${SAAS_CHAT_UTM_URL})
+       \\ 2️⃣ 如果你想消耗自己的 OpenAI 资源，点击[这里](/#/settings)修改设置 ⚙️`
+      : `😆 对话遇到了一些问题，不用慌:
+       \ 1️⃣ 想要零配置开箱即用，[点击这里立刻开启对话 🚀](${SAAS_CHAT_UTM_URL})
+       \ 2️⃣ 如果你正在使用私有部署版本，点击[这里](/#/auth)输入访问秘钥 🔑
+       \ 3️⃣ 如果你想消耗自己的 OpenAI 资源，点击[这里](/#/settings)修改设置 ⚙️
+       `,
  },
  Auth: {
+    Return: "返回",
    Title: "需要密码",
    Tips: "管理员开启了密码验证，请在下方填入访问码",
-    SubTips: "或者输入你的 OpenAI 或 Google API 密钥",
+    SubTips: "或者输入你的 OpenAI 或 Google AI 密钥",
    Input: "在此处填写访问码",
    Confirm: "确认",
    Later: "稍后再说",
+    SaasTips: "配置太麻烦，想要立即使用",
+    TopTips:
+      "🥳 NextChat AI 首发优惠，立刻解锁 OpenAI o1, GPT-4o, Claude-3.5 等最新大模型",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} 条对话`,
@@ -297,6 +308,13 @@ const cn = {
    },

    Access: {
+      SaasStart: {
+        Title: "使用 NextChat AI",
+        Label: "（性价比最高的方案）",
+        SubTitle:
+          "由 NextChat 官方维护, 零配置开箱即用，支持 OpenAI o1, GPT-4o, Claude-3.5 等最新大模型",
+        ChatNow: "立刻对话",
+      },
      AccessCode: {
        Title: "访问密码",
        SubTitle: "管理员已开启加密访问",
@@ -360,7 +378,7 @@ const cn = {
        ApiKey: {
          Title: "API 密钥",
          SubTitle: "从 Google AI 获取您的 API 密钥",
-          Placeholder: "输入您的 Google AI Studio API 密钥",
+          Placeholder: "Google AI API KEY",
        },

        Endpoint: {
--- a/app/locales/cs.ts
+++ b/app/locales/cs.ts
@@ -1,15 +1,21 @@
 import { SubmitKey } from "../store/config";
 import type { PartialLocaleType } from "./index";
 import { getClientConfig } from "../config/client";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const cs: PartialLocaleType = {
  WIP: "V přípravě...",
  Error: {
    Unauthorized: isApp
-      ? "Byl zjištěn neplatný API Key, prosím přejděte na stránku [Nastavení](/#/settings) a zkontrolujte, zda je API Key správně nakonfigurován."
-      : "Heslo je nesprávné nebo prázdné, prosím přejděte na stránku [Přihlášení](/#/auth) a zadejte správné heslo, nebo na stránku [Nastavení](/#/settings) a zadejte svůj vlastní OpenAI API Key.",
+      ? `😆 Rozhovor narazil na nějaké problémy, nebojte se:
+    \\ 1️⃣ Pokud chcete začít bez konfigurace, [klikněte sem pro okamžitý začátek chatu 🚀](${SAAS_CHAT_UTM_URL})
+    \\ 2️⃣ Pokud chcete využít své vlastní zdroje OpenAI, klikněte [sem](/#/settings) a upravte nastavení ⚙️`
+      : `😆 Rozhovor narazil na nějaké problémy, nebojte se:
+    \ 1️⃣ Pokud chcete začít bez konfigurace, [klikněte sem pro okamžitý začátek chatu 🚀](${SAAS_CHAT_UTM_URL})
+    \ 2️⃣ Pokud používáte verzi soukromého nasazení, klikněte [sem](/#/auth) a zadejte přístupový klíč 🔑
+    \ 3️⃣ Pokud chcete využít své vlastní zdroje OpenAI, klikněte [sem](/#/settings) a upravte nastavení ⚙️
+ `,
  },
  Auth: {
    Title: "Potřebné heslo",
@@ -18,6 +24,10 @@ const cs: PartialLocaleType = {
    Input: "Zadejte přístupový kód zde",
    Confirm: "Potvrdit",
    Later: "Později",
+    Return: "Návrat",
+    SaasTips: "Konfigurace je příliš složitá, chci okamžitě začít používat",
+    TopTips:
+      "🥳 Uvítací nabídka NextChat AI, okamžitě odemkněte OpenAI o1, GPT-4o, Claude-3.5 a nejnovější velké modely",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} konverzací`,
@@ -284,6 +294,14 @@ const cs: PartialLocaleType = {
    },

    Access: {
+      SaasStart: {
+        Title: "Použití NextChat AI",
+        Label: "(Nejlepší nákladově efektivní řešení)",
+        SubTitle:
+          "Oficiálně udržováno NextChat, připraveno k použití bez konfigurace, podporuje nejnovější velké modely jako OpenAI o1, GPT-4o, Claude-3.5",
+        ChatNow: "Začněte chatovat nyní",
+      },
+
      AccessCode: {
        Title: "Přístupový kód",
        SubTitle: "Administrátor aktivoval šifrovaný přístup",
--- a/app/locales/de.ts
+++ b/app/locales/de.ts
@@ -1,15 +1,21 @@
 import { SubmitKey } from "../store/config";
 import type { PartialLocaleType } from "./index";
 import { getClientConfig } from "../config/client";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const de: PartialLocaleType = {
  WIP: "In Bearbeitung...",
  Error: {
    Unauthorized: isApp
-      ? "Ungültiger API-Schlüssel erkannt. Bitte gehen Sie zur [Einstellungen](/#/settings) Seite, um zu überprüfen, ob der API-Schlüssel korrekt konfiguriert ist."
-      : "Das Passwort ist falsch oder leer. Bitte gehen Sie zur [Login](/#/auth) Seite, um das richtige Passwort einzugeben, oder fügen Sie Ihren OpenAI API-Schlüssel auf der [Einstellungen](/#/settings) Seite hinzu.",
+      ? `😆 Das Gespräch hatte einige Probleme, keine Sorge:
+    \\ 1️⃣ Wenn du ohne Konfiguration sofort starten möchtest, [klicke hier, um sofort zu chatten 🚀](${SAAS_CHAT_UTM_URL})
+    \\ 2️⃣ Wenn du deine eigenen OpenAI-Ressourcen verwenden möchtest, klicke [hier](/#/settings), um die Einstellungen zu ändern ⚙️`
+      : `😆 Das Gespräch hatte einige Probleme, keine Sorge:
+    \ 1️⃣ Wenn du ohne Konfiguration sofort starten möchtest, [klicke hier, um sofort zu chatten 🚀](${SAAS_CHAT_UTM_URL})
+    \ 2️⃣ Wenn du eine private Bereitstellung verwendest, klicke [hier](/#/auth), um den Zugriffsschlüssel einzugeben 🔑
+    \ 3️⃣ Wenn du deine eigenen OpenAI-Ressourcen verwenden möchtest, klicke [hier](/#/settings), um die Einstellungen zu ändern ⚙️
+ `,
  },
  Auth: {
    Title: "Passwort erforderlich",
@@ -18,6 +24,11 @@ const de: PartialLocaleType = {
    Input: "Geben Sie hier den Zugangscode ein",
    Confirm: "Bestätigen",
    Later: "Später",
+    Return: "Zurück",
+    SaasTips:
+      "Die Konfiguration ist zu kompliziert, ich möchte es sofort nutzen",
+    TopTips:
+      "🥳 NextChat AI Einführungsangebot, schalte jetzt OpenAI o1, GPT-4o, Claude-3.5 und die neuesten großen Modelle frei",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} Gespräche`,
@@ -291,6 +302,14 @@ const de: PartialLocaleType = {
    },

    Access: {
+      SaasStart: {
+        Title: "NextChat AI verwenden",
+        Label: "(Die kosteneffektivste Lösung)",
+        SubTitle:
+          "Offiziell von NextChat verwaltet, sofort einsatzbereit ohne Konfiguration, unterstützt die neuesten großen Modelle wie OpenAI o1, GPT-4o und Claude-3.5",
+        ChatNow: "Jetzt chatten",
+      },
+
      AccessCode: {
        Title: "Zugangscode",
        SubTitle:
--- a/app/locales/en.ts
+++ b/app/locales/en.ts
@@ -1,7 +1,7 @@
 import { getClientConfig } from "../config/client";
 import { SubmitKey } from "../store/config";
 import { LocaleType } from "./index";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 // if you are adding a new translation, please use PartialLocaleType instead of LocaleType

 const isApp = !!getClientConfig()?.isApp;
@@ -9,16 +9,26 @@ const en: LocaleType = {
  WIP: "Coming Soon...",
  Error: {
    Unauthorized: isApp
-      ? "Invalid API Key, please check it in [Settings](/#/settings) page."
-      : "Unauthorized access, please enter access code in [auth](/#/auth) page, or enter your OpenAI API Key.",
+      ? `😆 Oops, there's an issue. No worries:
+     \\ 1️⃣ New here? [Click to start chatting now 🚀](${SAAS_CHAT_UTM_URL})
+     \\ 2️⃣ Want to use your own OpenAI resources? [Click here](/#/settings) to change settings ⚙️`
+      : `😆 Oops, there's an issue. Let's fix it:
+     \ 1️⃣ New here? [Click to start chatting now 🚀](${SAAS_CHAT_UTM_URL})
+     \ 2️⃣ Using a private setup? [Click here](/#/auth) to enter your key 🔑
+     \ 3️⃣ Want to use your own OpenAI resources? [Click here](/#/settings) to change settings ⚙️
+     `,
  },
  Auth: {
+    Return: "Return",
    Title: "Need Access Code",
    Tips: "Please enter access code below",
    SubTips: "Or enter your OpenAI or Google API Key",
    Input: "access code",
    Confirm: "Confirm",
    Later: "Later",
+    SaasTips: "Too Complex, Use Immediately Now",
+    TopTips:
+      "🥳 NextChat AI launch promotion: Instantly unlock the latest models like OpenAI o1, GPT-4o, Claude-3.5!",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} messages`,
@@ -301,6 +311,14 @@ const en: LocaleType = {
      NoAccess: "Enter API Key to check balance",
    },
    Access: {
+      SaasStart: {
+        Title: "Use NextChat AI",
+        Label: " (Most Cost-Effective Option)",
+        SubTitle:
+          "Maintained by NextChat, zero setup needed, unlock OpenAI o1, GPT-4o," +
+          " Claude-3.5 and more",
+        ChatNow: "Start Now",
+      },
      AccessCode: {
        Title: "Access Code",
        SubTitle: "Access control Enabled",
@@ -461,7 +479,7 @@ const en: LocaleType = {
        ApiKey: {
          Title: "API Key",
          SubTitle: "Obtain your API Key from Google AI",
-          Placeholder: "Enter your Google AI Studio API Key",
+          Placeholder: "Google AI API Key",
        },

        Endpoint: {
--- a/app/locales/es.ts
+++ b/app/locales/es.ts
@@ -1,15 +1,21 @@
 import { SubmitKey } from "../store/config";
 import type { PartialLocaleType } from "./index";
 import { getClientConfig } from "../config/client";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const es: PartialLocaleType = {
  WIP: "En construcción...",
  Error: {
    Unauthorized: isApp
-      ? "Se detectó una clave API inválida. Por favor, ve a la página de [Configuración](/#/settings) para verificar si la clave API está configurada correctamente."
-      : "La contraseña de acceso es incorrecta o está vacía. Por favor, ve a la página de [Iniciar sesión](/#/auth) para ingresar la contraseña correcta, o en la página de [Configuración](/#/settings) para introducir tu propia clave API de OpenAI.",
+      ? `😆 La conversación encontró algunos problemas, no te preocupes:
+    \\ 1️⃣ Si deseas comenzar sin configuración, [haz clic aquí para empezar a chatear inmediatamente 🚀](${SAAS_CHAT_UTM_URL})
+    \\ 2️⃣ Si deseas usar tus propios recursos de OpenAI, haz clic [aquí](/#/settings) para modificar la configuración ⚙️`
+      : `😆 La conversación encontró algunos problemas, no te preocupes:
+    \ 1️⃣ Si deseas comenzar sin configuración, [haz clic aquí para empezar a chatear inmediatamente 🚀](${SAAS_CHAT_UTM_URL})
+    \ 2️⃣ Si estás utilizando una versión de implementación privada, haz clic [aquí](/#/auth) para ingresar la clave de acceso 🔑
+    \ 3️⃣ Si deseas usar tus propios recursos de OpenAI, haz clic [aquí](/#/settings) para modificar la configuración ⚙️
+ `,
  },
  Auth: {
    Title: "Se requiere contraseña",
@@ -18,6 +24,11 @@ const es: PartialLocaleType = {
    Input: "Introduce el código de acceso aquí",
    Confirm: "Confirmar",
    Later: "Más tarde",
+    Return: "Regresar",
+    SaasTips:
+      "La configuración es demasiado complicada, quiero usarlo de inmediato",
+    TopTips:
+      "🥳 Oferta de lanzamiento de NextChat AI, desbloquea OpenAI o1, GPT-4o, Claude-3.5 y los últimos grandes modelos",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} conversaciones`,
@@ -294,6 +305,14 @@ const es: PartialLocaleType = {
    },

    Access: {
+      SaasStart: {
+        Title: "Use NextChat AI",
+        Label: "(The most cost-effective solution)",
+        SubTitle:
+          "Officially maintained by NextChat, zero configuration ready to use, supports the latest large models like OpenAI o1, GPT-4o, and Claude-3.5",
+        ChatNow: "Chat Now",
+      },
+
      AccessCode: {
        Title: "Contraseña de acceso",
        SubTitle: "El administrador ha habilitado el acceso encriptado",
--- a/app/locales/fr.ts
+++ b/app/locales/fr.ts
@@ -1,15 +1,21 @@
 import { SubmitKey } from "../store/config";
 import type { PartialLocaleType } from "./index";
 import { getClientConfig } from "../config/client";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const fr: PartialLocaleType = {
  WIP: "Prochainement...",
  Error: {
    Unauthorized: isApp
-      ? "Clé API invalide détectée. Veuillez vérifier si la clé API est correctement configurée dans la page [Paramètres](/#/settings)."
-      : "Le mot de passe d'accès est incorrect ou manquant. Veuillez entrer le mot de passe d'accès correct sur la page [Connexion](/#/auth) ou entrer votre propre clé API OpenAI sur la page [Paramètres](/#/settings).",
+      ? `😆 La conversation a rencontré quelques problèmes, pas de panique :
+    \\ 1️⃣ Si vous souhaitez commencer sans configuration, [cliquez ici pour démarrer la conversation immédiatement 🚀](${SAAS_CHAT_UTM_URL})
+    \\ 2️⃣ Si vous souhaitez utiliser vos propres ressources OpenAI, cliquez [ici](/#/settings) pour modifier les paramètres ⚙️`
+      : `😆 La conversation a rencontré quelques problèmes, pas de panique :
+    \ 1️⃣ Si vous souhaitez commencer sans configuration, [cliquez ici pour démarrer la conversation immédiatement 🚀](${SAAS_CHAT_UTM_URL})
+    \ 2️⃣ Si vous utilisez une version déployée privée, cliquez [ici](/#/auth) pour entrer la clé d'accès 🔑
+    \ 3️⃣ Si vous souhaitez utiliser vos propres ressources OpenAI, cliquez [ici](/#/settings) pour modifier les paramètres ⚙️
+ `,
  },
  Auth: {
    Title: "Mot de passe requis",
@@ -18,6 +24,11 @@ const fr: PartialLocaleType = {
    Input: "Entrez le code d'accès ici",
    Confirm: "Confirmer",
    Later: "Plus tard",
+    Return: "Retour",
+    SaasTips:
+      "La configuration est trop compliquée, je veux l'utiliser immédiatement",
+    TopTips:
+      "🥳 Offre de lancement NextChat AI, débloquez OpenAI o1, GPT-4o, Claude-3.5 et les derniers grands modèles",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} conversations`,
@@ -294,6 +305,14 @@ const fr: PartialLocaleType = {
    },

    Access: {
+      SaasStart: {
+        Title: "Utiliser NextChat AI",
+        Label: "(La solution la plus rentable)",
+        SubTitle:
+          "Officiellement maintenu par NextChat, prêt à l'emploi sans configuration, prend en charge les derniers grands modèles comme OpenAI o1, GPT-4o et Claude-3.5",
+        ChatNow: "Discuter maintenant",
+      },
+
      AccessCode: {
        Title: "Mot de passe d'accès",
        SubTitle: "L'administrateur a activé l'accès sécurisé",
--- a/app/locales/id.ts
+++ b/app/locales/id.ts
@@ -1,15 +1,21 @@
 import { SubmitKey } from "../store/config";
 import type { PartialLocaleType } from "./index";
 import { getClientConfig } from "../config/client";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const id: PartialLocaleType = {
  WIP: "Coming Soon...",
  Error: {
    Unauthorized: isApp
-      ? "API Key tidak valid terdeteksi, silakan periksa apakah API Key telah dikonfigurasi dengan benar di halaman [Pengaturan](/#/settings)."
-      : "Kata sandi akses tidak benar atau kosong, silakan masukkan kata sandi akses yang benar di halaman [Masuk](/#/auth), atau masukkan OpenAI API Key Anda di halaman [Pengaturan](/#/settings).",
+      ? `😆 Percakapan mengalami beberapa masalah, tidak perlu khawatir:
+   \\ 1️⃣ Jika Anda ingin memulai tanpa konfigurasi, [klik di sini untuk mulai mengobrol segera 🚀](${SAAS_CHAT_UTM_URL})
+   \\ 2️⃣ Jika Anda ingin menggunakan sumber daya OpenAI Anda sendiri, klik [di sini](/#/settings) untuk mengubah pengaturan ⚙️`
+      : `😆 Percakapan mengalami beberapa masalah, tidak perlu khawatir:
+   \ 1️⃣ Jika Anda ingin memulai tanpa konfigurasi, [klik di sini untuk mulai mengobrol segera 🚀](${SAAS_CHAT_UTM_URL})
+   \ 2️⃣ Jika Anda menggunakan versi penyebaran pribadi, klik [di sini](/#/auth) untuk memasukkan kunci akses 🔑
+   \ 3️⃣ Jika Anda ingin menggunakan sumber daya OpenAI Anda sendiri, klik [di sini](/#/settings) untuk mengubah pengaturan ⚙️
+`,
  },
  Auth: {
    Title: "Kebutuhan Kata Sandi",
@@ -18,6 +24,10 @@ const id: PartialLocaleType = {
    Input: "Masukkan kode akses di sini",
    Confirm: "Konfirmasi",
    Later: "Nanti",
+    Return: "Kembali",
+    SaasTips: "Konfigurasi terlalu rumit, saya ingin menggunakannya segera",
+    TopTips:
+      "🥳 Penawaran Peluncuran NextChat AI, buka OpenAI o1, GPT-4o, Claude-3.5 dan model besar terbaru sekarang",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} percakapan`,
@@ -285,6 +295,14 @@ const id: PartialLocaleType = {
    },

    Access: {
+      SaasStart: {
+        Title: "Gunakan NextChat AI",
+        Label: "(Solusi paling hemat biaya)",
+        SubTitle:
+          "Dikelola secara resmi oleh NextChat, siap digunakan tanpa konfigurasi, mendukung model besar terbaru seperti OpenAI o1, GPT-4o, dan Claude-3.5",
+        ChatNow: "Chat Sekarang",
+      },
+
      AccessCode: {
        Title: "Kata Sandi Akses",
        SubTitle: "Administrator telah mengaktifkan akses terenkripsi",
--- a/app/locales/it.ts
+++ b/app/locales/it.ts
@@ -1,15 +1,21 @@
 import { SubmitKey } from "../store/config";
 import type { PartialLocaleType } from "./index";
 import { getClientConfig } from "../config/client";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const it: PartialLocaleType = {
  WIP: "Work in progress...",
  Error: {
    Unauthorized: isApp
-      ? "API Key non valido rilevato. Vai alla pagina [Impostazioni](/#/settings) per controllare se l'API Key è configurata correttamente."
-      : "La password di accesso è errata o mancante. Vai alla pagina [Login](/#/auth) per inserire la password corretta o inserisci la tua API Key OpenAI nella pagina [Impostazioni](/#/settings).",
+      ? `😆 La conversazione ha incontrato alcuni problemi, non preoccuparti:
+    \\ 1️⃣ Se vuoi iniziare senza configurazione, [clicca qui per iniziare a chattare immediatamente 🚀](${SAAS_CHAT_UTM_URL})
+    \\ 2️⃣ Se vuoi utilizzare le tue risorse OpenAI, clicca [qui](/#/settings) per modificare le impostazioni ⚙️`
+      : `😆 La conversazione ha incontrato alcuni problemi, non preoccuparti:
+    \ 1️⃣ Se vuoi iniziare senza configurazione, [clicca qui per iniziare a chattare immediatamente 🚀](${SAAS_CHAT_UTM_URL})
+    \ 2️⃣ Se stai utilizzando una versione di distribuzione privata, clicca [qui](/#/auth) per inserire la chiave di accesso 🔑
+    \ 3️⃣ Se vuoi utilizzare le tue risorse OpenAI, clicca [qui](/#/settings) per modificare le impostazioni ⚙️
+ `,
  },
  Auth: {
    Title: "Password richiesta",
@@ -18,6 +24,11 @@ const it: PartialLocaleType = {
    Input: "Inserisci il codice di accesso qui",
    Confirm: "Conferma",
    Later: "Più tardi",
+    Return: "Ritorna",
+    SaasTips:
+      "La configurazione è troppo complicata, voglio usarlo immediatamente",
+    TopTips:
+      "🥳 Offerta di lancio NextChat AI, sblocca OpenAI o1, GPT-4o, Claude-3.5 e i più recenti modelli di grandi dimensioni",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} conversazioni`,
@@ -295,6 +306,14 @@ const it: PartialLocaleType = {
    },

    Access: {
+      SaasStart: {
+        Title: "Usa NextChat AI",
+        Label: "(La soluzione più conveniente)",
+        SubTitle:
+          "Mantenuto ufficialmente da NextChat, pronto all'uso senza configurazione, supporta i modelli più recenti come OpenAI o1, GPT-4o e Claude-3.5",
+        ChatNow: "Chatta ora",
+      },
+
      AccessCode: {
        Title: "Password di accesso",
        SubTitle: "L'amministratore ha abilitato l'accesso criptato",
--- a/app/locales/jp.ts
+++ b/app/locales/jp.ts
@@ -1,15 +1,21 @@
 import { SubmitKey } from "../store/config";
 import type { PartialLocaleType } from "./index";
 import { getClientConfig } from "../config/client";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const jp: PartialLocaleType = {
  WIP: "この機能は開発中です",
  Error: {
    Unauthorized: isApp
-      ? "無効なAPIキーが検出されました。[設定](/#/settings)ページでAPIキーが正しく設定されているか確認してください。"
-      : "アクセスパスワードが正しくないか空です。[ログイン](/#/auth)ページで正しいアクセスパスワードを入力するか、[設定](/#/settings)ページで自分のOpenAI APIキーを入力してください。",
+      ? `😆 会話中に問題が発生しましたが、心配しないでください:
+    \\ 1️⃣ 設定なしで始めたい場合は、[ここをクリックしてすぐにチャットを開始 🚀](${SAAS_CHAT_UTM_URL})
+    \\ 2️⃣ 自分のOpenAIリソースを使用したい場合は、[ここをクリックして](/#/settings)設定を変更してください ⚙️`
+      : `😆 会話中に問題が発生しましたが、心配しないでください:
+    \ 1️⃣ 設定なしで始めたい場合は、[ここをクリックしてすぐにチャットを開始 🚀](${SAAS_CHAT_UTM_URL})
+    \ 2️⃣ プライベートデプロイ版を使用している場合は、[ここをクリックして](/#/auth)アクセストークンを入力してください 🔑
+    \ 3️⃣ 自分のOpenAIリソースを使用したい場合は、[ここをクリックして](/#/settings)設定を変更してください ⚙️
+ `,
  },
  Auth: {
    Title: "パスワードが必要です",
@@ -18,6 +24,10 @@ const jp: PartialLocaleType = {
    Input: "ここにアクセスコードを入力",
    Confirm: "確認",
    Later: "後で",
+    Return: "戻る",
+    SaasTips: "設定が面倒すぎる、すぐに使いたい",
+    TopTips:
+      "🥳 NextChat AIの発売特典で、OpenAI o1、GPT-4o、Claude-3.5などの最新の大規模モデルを今すぐアンロック",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count}件の会話`,
@@ -282,6 +292,14 @@ const jp: PartialLocaleType = {
    },

    Access: {
+      SaasStart: {
+        Title: "NextChat AIを使用する",
+        Label: "(コストパフォーマンスの最も高いソリューション)",
+        SubTitle:
+          "NextChatによって公式に管理されており、設定なしですぐに使用でき、OpenAI o1、GPT-4o、Claude-3.5などの最新の大規模モデルをサポートしています",
+        ChatNow: "今すぐチャット",
+      },
+
      AccessCode: {
        Title: "アクセスパスワード",
        SubTitle: "管理者が暗号化アクセスを有効にしました",
--- a/app/locales/ko.ts
+++ b/app/locales/ko.ts
@@ -1,15 +1,21 @@
 import { SubmitKey } from "../store/config";
 import type { PartialLocaleType } from "./index";
 import { getClientConfig } from "../config/client";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const ko: PartialLocaleType = {
  WIP: "곧 출시 예정...",
  Error: {
    Unauthorized: isApp
-      ? "유효하지 않은 API 키가 감지되었습니다. [설정](/#/settings) 페이지에서 API 키가 올바르게 구성되었는지 확인하십시오."
-      : "잘못된 접근 비밀번호이거나 비밀번호가 비어 있습니다. [로그인](/#/auth) 페이지에서 올바른 접근 비밀번호를 입력하거나 [설정](/#/settings) 페이지에서 OpenAI API 키를 입력하십시오.",
+      ? `😆 대화 중 문제가 발생했습니다, 걱정하지 마세요:
+    \\ 1️⃣ 제로 구성으로 시작하고 싶다면, [여기를 클릭하여 즉시 대화를 시작하세요 🚀](${SAAS_CHAT_UTM_URL})
+    \\ 2️⃣ 자신의 OpenAI 리소스를 사용하고 싶다면, [여기를 클릭하여](/#/settings) 설정을 수정하세요 ⚙️`
+      : `😆 대화 중 문제가 발생했습니다, 걱정하지 마세요:
+    \ 1️⃣ 제로 구성으로 시작하고 싶다면, [여기를 클릭하여 즉시 대화를 시작하세요 🚀](${SAAS_CHAT_UTM_URL})
+    \ 2️⃣ 개인 배포 버전을 사용하고 있다면, [여기를 클릭하여](/#/auth) 접근 키를 입력하세요 🔑
+    \ 3️⃣ 자신의 OpenAI 리소스를 사용하고 싶다면, [여기를 클릭하여](/#/settings) 설정을 수정하세요 ⚙️
+ `,
  },
  Auth: {
    Title: "비밀번호 필요",
@@ -18,6 +24,10 @@ const ko: PartialLocaleType = {
    Input: "여기에 접근 코드를 입력하십시오.",
    Confirm: "확인",
    Later: "나중에 하기",
+    Return: "돌아가기",
+    SaasTips: "설정이 너무 복잡합니다. 즉시 사용하고 싶습니다.",
+    TopTips:
+      "🥳 NextChat AI 출시 기념 할인, 지금 OpenAI o1, GPT-4o, Claude-3.5 및 최신 대형 모델을 해제하세요",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} 개의 대화`,
@@ -281,6 +291,14 @@ const ko: PartialLocaleType = {
    },

    Access: {
+      SaasStart: {
+        Title: "NextChat AI 사용하기",
+        Label: "(가장 비용 효율적인 솔루션)",
+        SubTitle:
+          "NextChat에 의해 공식적으로 유지 관리되며, 제로 구성으로 즉시 사용할 수 있으며, OpenAI o1, GPT-4o, Claude-3.5와 같은 최신 대형 모델을 지원합니다",
+        ChatNow: "지금 채팅하기",
+      },
+
      AccessCode: {
        Title: "접근 비밀번호",
        SubTitle: "관리자가 암호화된 접근을 활성화했습니다.",
--- a/app/locales/no.ts
+++ b/app/locales/no.ts
@@ -1,15 +1,21 @@
 import { SubmitKey } from "../store/config";
 import type { PartialLocaleType } from "./index";
 import { getClientConfig } from "../config/client";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const no: PartialLocaleType = {
  WIP: "Arbeid pågår ...",
  Error: {
    Unauthorized: isApp
-      ? "Ugyldig API-nøkkel oppdaget. Gå til [innstillinger](/#/settings) for å sjekke om API-nøkkelen er riktig konfigurert."
-      : "Adgangskoden er feil eller tom. Gå til [innlogging](/#/auth) for å oppgi riktig adgangskode, eller fyll inn din egen OpenAI API-nøkkel på [innstillinger](/#/settings) siden.",
+      ? `😆 Samtalen har støtt på noen problemer, ikke bekymre deg:
+    \\ 1️⃣ Hvis du vil starte uten konfigurasjon, [klikk her for å begynne å chatte umiddelbart 🚀](${SAAS_CHAT_UTM_URL})
+    \\ 2️⃣ Hvis du vil bruke dine egne OpenAI-ressurser, klikk [her](/#/settings) for å endre innstillingene ⚙️`
+      : `😆 Samtalen har støtt på noen problemer, ikke bekymre deg:
+    \ 1️⃣ Hvis du vil starte uten konfigurasjon, [klikk her for å begynne å chatte umiddelbart 🚀](${SAAS_CHAT_UTM_URL})
+    \ 2️⃣ Hvis du bruker en privat distribusjonsversjon, klikk [her](/#/auth) for å skrive inn tilgangsnøkkelen 🔑
+    \ 3️⃣ Hvis du vil bruke dine egne OpenAI-ressurser, klikk [her](/#/settings) for å endre innstillingene ⚙️
+ `,
  },
  Auth: {
    Title: "Passord påkrevd",
@@ -18,6 +24,11 @@ const no: PartialLocaleType = {
    Input: "Skriv tilgangskoden her",
    Confirm: "Bekreft",
    Later: "Kom tilbake senere",
+    Return: "Tilbake",
+    SaasTips:
+      "Konfigurasjonen er for komplisert, jeg vil bruke det med en gang",
+    TopTips:
+      "🥳 NextChat AI lanseringstilbud, lås opp OpenAI o1, GPT-4o, Claude-3.5 og de nyeste store modellene nå",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} samtaler`,
@@ -288,6 +299,14 @@ const no: PartialLocaleType = {
    },

    Access: {
+      SaasStart: {
+        Title: "Bruk NextChat AI",
+        Label: "(Den mest kostnadseffektive løsningen)",
+        SubTitle:
+          "Offisielt vedlikeholdt av NextChat, klar til bruk uten konfigurasjon, støtter de nyeste store modellene som OpenAI o1, GPT-4o og Claude-3.5",
+        ChatNow: "Chat nå",
+      },
+
      AccessCode: {
        Title: "Adgangskode",
        SubTitle: "Administrator har aktivert kryptert tilgang",
--- a/app/locales/pt.ts
+++ b/app/locales/pt.ts
@@ -1,15 +1,21 @@
 import { SubmitKey } from "../store/config";
 import { PartialLocaleType } from "../locales/index";
 import { getClientConfig } from "../config/client";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const pt: PartialLocaleType = {
  WIP: "Em breve...",
  Error: {
    Unauthorized: isApp
-      ? "Chave API inválida, por favor verifique em [Configurações](/#/settings)."
-      : "Acesso não autorizado, por favor insira o código de acesso em [auth](/#/auth) ou insira sua Chave API OpenAI.",
+      ? `😆 A conversa encontrou alguns problemas, não se preocupe:
+   \\ 1️⃣ Se você quiser começar sem configuração, [clique aqui para começar a conversar imediatamente 🚀](${SAAS_CHAT_UTM_URL})
+   \\ 2️⃣ Se você deseja usar seus próprios recursos OpenAI, clique [aqui](/#/settings) para modificar as configurações ⚙️`
+      : `😆 A conversa encontrou alguns problemas, não se preocupe:
+   \ 1️⃣ Se você quiser começar sem configuração, [clique aqui para começar a conversar imediatamente 🚀](${SAAS_CHAT_UTM_URL})
+   \ 2️⃣ Se você estiver usando uma versão de implantação privada, clique [aqui](/#/auth) para inserir a chave de acesso 🔑
+   \ 3️⃣ Se você deseja usar seus próprios recursos OpenAI, clique [aqui](/#/settings) para modificar as configurações ⚙️
+`,
  },
  Auth: {
    Title: "Necessário Código de Acesso",
@@ -18,6 +24,10 @@ const pt: PartialLocaleType = {
    Input: "código de acesso",
    Confirm: "Confirmar",
    Later: "Depois",
+    Return: "Voltar",
+    SaasTips: "A configuração é muito complicada, quero usá-la imediatamente",
+    TopTips:
+      "🥳 Oferta de Lançamento do NextChat AI, desbloqueie o OpenAI o1, GPT-4o, Claude-3.5 e os mais recentes grandes modelos agora",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} mensagens`,
@@ -281,6 +291,14 @@ const pt: PartialLocaleType = {
      NoAccess: "Insira a Chave API para verificar o saldo",
    },
    Access: {
+      SaasStart: {
+        Title: "Usar NextChat AI",
+        Label: "(A solução mais econômica)",
+        SubTitle:
+          "Mantido oficialmente pelo NextChat, pronto para uso sem configuração, suporta os mais recentes grandes modelos como OpenAI o1, GPT-4o e Claude-3.5",
+        ChatNow: "Conversar agora",
+      },
+
      AccessCode: {
        Title: "Código de Acesso",
        SubTitle: "Controle de Acesso Habilitado",
--- a/app/locales/ru.ts
+++ b/app/locales/ru.ts
@@ -1,15 +1,21 @@
 import { SubmitKey } from "../store/config";
 import { PartialLocaleType } from "../locales/index";
 import { getClientConfig } from "../config/client";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const ru: PartialLocaleType = {
  WIP: "Скоро...",
  Error: {
    Unauthorized: isApp
-      ? "Обнаружен недействительный API-ключ. Пожалуйста, перейдите на страницу [Настройки](/#/settings), чтобы проверить правильность конфигурации API-ключа."
-      : "Неверный или пустой пароль доступа. Пожалуйста, перейдите на страницу [Вход](/#/auth), чтобы ввести правильный пароль доступа, или на страницу [Настройки](/#/settings), чтобы ввести ваш собственный API-ключ OpenAI.",
+      ? `😆 В разговоре возникли некоторые проблемы, не переживайте:
+    \\ 1️⃣ Если вы хотите начать без настройки, [нажмите здесь, чтобы немедленно начать разговор 🚀](${SAAS_CHAT_UTM_URL})
+    \\ 2️⃣ Если вы хотите использовать свои ресурсы OpenAI, нажмите [здесь](/#/settings), чтобы изменить настройки ⚙️`
+      : `😆 В разговоре возникли некоторые проблемы, не переживайте:
+    \ 1️⃣ Если вы хотите начать без настройки, [нажмите здесь, чтобы немедленно начать разговор 🚀](${SAAS_CHAT_UTM_URL})
+    \ 2️⃣ Если вы используете частную версию развертывания, нажмите [здесь](/#/auth), чтобы ввести ключ доступа 🔑
+    \ 3️⃣ Если вы хотите использовать свои ресурсы OpenAI, нажмите [здесь](/#/settings), чтобы изменить настройки ⚙️
+ `,
  },
  Auth: {
    Title: "Требуется пароль",
@@ -18,6 +24,10 @@ const ru: PartialLocaleType = {
    Input: "Введите код доступа здесь",
    Confirm: "Подтвердить",
    Later: "Позже",
+    Return: "Назад",
+    SaasTips: "Настройка слишком сложна, я хочу использовать это немедленно",
+    TopTips:
+      "🥳 Предложение по запуску NextChat AI: разблокируйте OpenAI o1, GPT-4o, Claude-3.5 и новейшие большие модели прямо сейчас",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} бесед`,
@@ -286,6 +296,14 @@ const ru: PartialLocaleType = {
    },

    Access: {
+      SaasStart: {
+        Title: "Используйте NextChat AI",
+        Label: "(Самое экономичное решение)",
+        SubTitle:
+          "Официально поддерживается NextChat, готов к использованию без настройки, поддерживает последние крупные модели, такие как OpenAI o1, GPT-4o и Claude-3.5",
+        ChatNow: "Начать чат",
+      },
+
      AccessCode: {
        Title: "Пароль доступа",
        SubTitle: "Администратор включил защиту паролем",
--- a/app/locales/sk.ts
+++ b/app/locales/sk.ts
@@ -1,7 +1,7 @@
 import { getClientConfig } from "../config/client";
 import { SubmitKey } from "../store/config";
 import type { PartialLocaleType } from "./index";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 // if you are adding a new translation, please use PartialLocaleType instead of LocaleType

 const isApp = !!getClientConfig()?.isApp;
@@ -9,8 +9,14 @@ const sk: PartialLocaleType = {
  WIP: "Už čoskoro...",
  Error: {
    Unauthorized: isApp
-      ? "Neplatný API kľúč, prosím skontrolujte ho na stránke [Nastavenia](/#/settings)."
-      : "Neoprávnený prístup, prosím zadajte prístupový kód na stránke [auth](/#/auth), alebo zadajte váš OpenAI API kľúč.",
+      ? `😆 Rozhovor narazil na nejaké problémy, nebojte sa:
+    \\ 1️⃣ Ak chcete začať bez konfigurácie, [kliknite sem, aby ste okamžite začali chatovať 🚀](${SAAS_CHAT_UTM_URL})
+    \\ 2️⃣ Ak chcete používať svoje vlastné zdroje OpenAI, kliknite [sem](/#/settings), aby ste upravili nastavenia ⚙️`
+      : `😆 Rozhovor narazil na nejaké problémy, nebojte sa:
+    \ 1️⃣ Ak chcete začať bez konfigurácie, [kliknite sem, aby ste okamžite začali chatovať 🚀](${SAAS_CHAT_UTM_URL})
+    \ 2️⃣ Ak používate verziu súkromného nasadenia, kliknite [sem](/#/auth), aby ste zadali prístupový kľúč 🔑
+    \ 3️⃣ Ak chcete používať svoje vlastné zdroje OpenAI, kliknite [sem](/#/settings), aby ste upravili nastavenia ⚙️
+ `,
  },
  Auth: {
    Title: "Potrebný prístupový kód",
@@ -19,6 +25,10 @@ const sk: PartialLocaleType = {
    Input: "prístupový kód",
    Confirm: "Potvrdiť",
    Later: "Neskôr",
+    Return: "Návrat",
+    SaasTips: "Nastavenie je príliš zložité, chcem to okamžite použiť",
+    TopTips:
+      "🥳 Uvítacia ponuka NextChat AI, okamžite odomknite OpenAI o1, GPT-4o, Claude-3.5 a najnovšie veľké modely",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} správ`,
@@ -281,6 +291,14 @@ const sk: PartialLocaleType = {
      NoAccess: "Zadajte API kľúč na skontrolovanie zostatku",
    },
    Access: {
+      SaasStart: {
+        Title: "Použite NextChat AI",
+        Label: "(Najvýhodnejšie riešenie)",
+        SubTitle:
+          "Oficiálne udržiavané NextChat, pripravené na použitie bez konfigurácie, podporuje najnovšie veľké modely ako OpenAI o1, GPT-4o a Claude-3.5",
+        ChatNow: "Chatovať teraz",
+      },
+
      AccessCode: {
        Title: "Prístupový kód",
        SubTitle: "Povolený prístupový kód",
--- a/app/locales/tr.ts
+++ b/app/locales/tr.ts
@@ -1,15 +1,21 @@
 import { SubmitKey } from "../store/config";
 import type { PartialLocaleType } from "./index";
 import { getClientConfig } from "../config/client";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const tr: PartialLocaleType = {
  WIP: "Çalışma devam ediyor...",
  Error: {
    Unauthorized: isApp
-      ? "Geçersiz API Anahtarı tespit edildi, lütfen API Anahtarını doğru şekilde yapılandırmak için [Ayarlar](/#/settings) sayfasına gidin."
-      : "Erişim şifresi yanlış veya boş, lütfen doğru erişim şifresini girmek için [Giriş](/#/auth) sayfasına gidin veya kendi OpenAI API Anahtarınızı [Ayarlar](/#/settings) sayfasına girin.",
+      ? `😆 Sohbet bazı sorunlarla karşılaştı, endişelenmeyin:
+    \\ 1️⃣ Eğer sıfır yapılandırma ile başlamak istiyorsanız, [buraya tıklayarak hemen sohbete başlayın 🚀](${SAAS_CHAT_UTM_URL})
+    \\ 2️⃣ Kendi OpenAI kaynaklarınızı kullanmak istiyorsanız, [buraya tıklayarak](/#/settings) ayarları değiştirin ⚙️`
+      : `😆 Sohbet bazı sorunlarla karşılaştı, endişelenmeyin:
+    \ 1️⃣ Eğer sıfır yapılandırma ile başlamak istiyorsanız, [buraya tıklayarak hemen sohbete başlayın 🚀](${SAAS_CHAT_UTM_URL})
+    \ 2️⃣ Eğer özel dağıtım sürümü kullanıyorsanız, [buraya tıklayarak](/#/auth) erişim anahtarını girin 🔑
+    \ 3️⃣ Kendi OpenAI kaynaklarınızı kullanmak istiyorsanız, [buraya tıklayarak](/#/settings) ayarları değiştirin ⚙️
+ `,
  },
  Auth: {
    Title: "Şifre Gerekli",
@@ -18,6 +24,10 @@ const tr: PartialLocaleType = {
    Input: "Erişim kodunu buraya girin",
    Confirm: "Onayla",
    Later: "Sonra",
+    Return: "Geri",
+    SaasTips: "Ayarlar çok karmaşık, hemen kullanmak istiyorum",
+    TopTips:
+      "🥳 NextChat AI lansman teklifi, OpenAI o1, GPT-4o, Claude-3.5 ve en son büyük modelleri şimdi açın",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} konuşma`,
@@ -286,6 +296,14 @@ const tr: PartialLocaleType = {
    },

    Access: {
+      SaasStart: {
+        Title: "NextChat AI kullanın",
+        Label: "(En maliyet etkin çözüm)",
+        SubTitle:
+          "NextChat tarafından resmi olarak yönetilmektedir, yapılandırma olmadan hemen kullanıma hazırdır, OpenAI o1, GPT-4o, Claude-3.5 gibi en son büyük modelleri destekler",
+        ChatNow: "Şimdi sohbet et",
+      },
+
      AccessCode: {
        Title: "Erişim Şifresi",
        SubTitle: "Yönetici şifreli erişimi etkinleştirdi",
--- a/app/locales/tw.ts
+++ b/app/locales/tw.ts
@@ -1,14 +1,20 @@
 import { getClientConfig } from "../config/client";
 import { SubmitKey } from "../store/config";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const tw = {
  WIP: "此功能仍在開發中……",
  Error: {
    Unauthorized: isApp
-      ? "偵測到無效的 API Key，請前往[設定](/#/settings)頁面檢查 API Key 是否設定正確。"
-      : "存取密碼不正確或尚未填寫，請前往[登入](/#/auth)頁面輸入正確的存取密碼，或者在[設定](/#/settings)頁面填入你自己的 OpenAI API Key。",
+      ? `😆 對話遇到了一些問題，不用慌:
+    \\ 1️⃣ 想要零配置開箱即用，[點擊這裡立刻開啟對話 🚀](${SAAS_CHAT_UTM_URL})
+    \\ 2️⃣ 如果你想消耗自己的 OpenAI 資源，點擊[這裡](/#/settings)修改設定 ⚙️`
+      : `😆 對話遇到了一些問題，不用慌:
+    \ 1️⃣ 想要零配置開箱即用，[點擊這裡立刻開啟對話 🚀](${SAAS_CHAT_UTM_URL})
+    \ 2️⃣ 如果你正在使用私有部署版本，點擊[這裡](/#/auth)輸入訪問秘鑰 🔑
+    \ 3️⃣ 如果你想消耗自己的 OpenAI 資源，點擊[這裡](/#/settings)修改設定 ⚙️
+ `,
  },

  Auth: {
@@ -18,6 +24,10 @@ const tw = {
    Input: "在此處填寫存取密碼",
    Confirm: "確認",
    Later: "稍候再說",
+    Return: "返回",
+    SaasTips: "配置太麻煩，想要立即使用",
+    TopTips:
+      "🥳 NextChat AI 首發優惠，立刻解鎖 OpenAI o1, GPT-4o, Claude-3.5 等最新大模型",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} 則對話`,
@@ -287,6 +297,14 @@ const tw = {
    },

    Access: {
+      SaasStart: {
+        Title: "使用 NextChat AI",
+        Label: "(性價比最高的方案)",
+        SubTitle:
+          "由 NextChat 官方維護，零配置開箱即用，支持 OpenAI o1、GPT-4o、Claude-3.5 等最新大模型",
+        ChatNow: "立刻對話",
+      },
+
      AccessCode: {
        Title: "存取密碼",
        SubTitle: "管理員已開啟加密存取",
--- a/app/locales/vi.ts
+++ b/app/locales/vi.ts
@@ -1,15 +1,21 @@
 import { SubmitKey } from "../store/config";
 import type { PartialLocaleType } from "./index";
 import { getClientConfig } from "../config/client";
-
+import { SAAS_CHAT_UTM_URL } from "@/app/constant";
 const isApp = !!getClientConfig()?.isApp;

 const vi: PartialLocaleType = {
  WIP: "Sắp ra mắt...",
  Error: {
    Unauthorized: isApp
-      ? "Phát hiện khóa API không hợp lệ, vui lòng truy cập trang [Cài đặt](/#/settings) để kiểm tra xem khóa API có được cấu hình chính xác không."
-      : "Mật khẩu truy cập không đúng hoặc để trống, vui lòng truy cập trang [Đăng nhập](/#/auth) để nhập mật khẩu truy cập chính xác, hoặc điền khóa API OpenAI của bạn vào trang [Cài đặt](/#/settings).",
+      ? `😆 Cuộc trò chuyện gặp một số vấn đề, đừng lo lắng:
+    \\ 1️⃣ Nếu bạn muốn bắt đầu mà không cần cấu hình, [nhấp vào đây để bắt đầu trò chuyện ngay lập tức 🚀](${SAAS_CHAT_UTM_URL})
+    \\ 2️⃣ Nếu bạn muốn sử dụng tài nguyên OpenAI của riêng mình, hãy nhấp [vào đây](/#/settings) để thay đổi cài đặt ⚙️`
+      : `😆 Cuộc trò chuyện gặp một số vấn đề, đừng lo lắng:
+    \ 1️⃣ Nếu bạn muốn bắt đầu mà không cần cấu hình, [nhấp vào đây để bắt đầu trò chuyện ngay lập tức 🚀](${SAAS_CHAT_UTM_URL})
+    \ 2️⃣ Nếu bạn đang sử dụng phiên bản triển khai riêng, hãy nhấp [vào đây](/#/auth) để nhập khóa truy cập 🔑
+    \ 3️⃣ Nếu bạn muốn sử dụng tài nguyên OpenAI của riêng mình, hãy nhấp [vào đây](/#/settings) để thay đổi cài đặt ⚙️
+ `,
  },
  Auth: {
    Title: "Cần mật khẩu",
@@ -18,6 +24,10 @@ const vi: PartialLocaleType = {
    Input: "Nhập mã truy cập tại đây",
    Confirm: "Xác nhận",
    Later: "Để sau",
+    Return: "Trở lại",
+    SaasTips: "Cấu hình quá phức tạp, tôi muốn sử dụng ngay lập tức",
+    TopTips:
+      "🥳 Ưu đãi ra mắt NextChat AI, mở khóa OpenAI o1, GPT-4o, Claude-3.5 và các mô hình lớn mới nhất ngay bây giờ",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} cuộc trò chuyện`,
@@ -283,6 +293,14 @@ const vi: PartialLocaleType = {
    },

    Access: {
+      SaasStart: {
+        Title: "Sử dụng NextChat AI",
+        Label: "(Giải pháp tiết kiệm chi phí nhất)",
+        SubTitle:
+          "Được NextChat chính thức duy trì, sẵn sàng sử dụng mà không cần cấu hình, hỗ trợ các mô hình lớn mới nhất như OpenAI o1, GPT-4o và Claude-3.5",
+        ChatNow: "Chat ngay",
+      },
+
      AccessCode: {
        Title: "Mật khẩu truy cập",
        SubTitle: "Quản trị viên đã bật truy cập mã hóa",
--- a/app/store/access.ts
+++ b/app/store/access.ts
@@ -211,10 +211,13 @@ export const useAccessStore = createPersistStore(
      })
        .then((res) => res.json())
        .then((res) => {
-          // Set default model from env request
-          let defaultModel = res.defaultModel ?? "";
-          if (defaultModel !== "")
-            DEFAULT_CONFIG.modelConfig.model = defaultModel;
+          const defaultModel = res.defaultModel ?? "";
+          if (defaultModel !== "") {
+            const [model, providerName] = defaultModel.split("@");
+            DEFAULT_CONFIG.modelConfig.model = model;
+            DEFAULT_CONFIG.modelConfig.providerName = providerName;
+          }
+
          return res;
        })
        .then((res: DangerConfig) => {
--- a/app/store/chat.ts
+++ b/app/store/chat.ts
@@ -615,6 +615,7 @@ export const useChatStore = createPersistStore(
              providerName,
            },
            onFinish(message) {
+              if (!isValidMessage(message)) return;
              get().updateCurrentSession(
                (session) =>
                  (session.topic =
@@ -690,6 +691,10 @@ export const useChatStore = createPersistStore(
            },
          });
        }
+
+        function isValidMessage(message: any): boolean {
+          return typeof message === "string" && !message.startsWith("```json");
+        }
      },

      updateStat(message: ChatMessage) {
--- a/app/store/config.ts
+++ b/app/store/config.ts
@@ -50,6 +50,8 @@ export const DEFAULT_CONFIG = {
  enableAutoGenerateTitle: true,
  sidebarWidth: DEFAULT_SIDEBAR_WIDTH,

+  enableArtifacts: true, // show artifacts config
+
  disablePromptHint: false,

  dontShowMaskSplashScreen: false, // dont show splash screen when create chat
--- a/app/store/plugin.ts
+++ b/app/store/plugin.ts
@@ -2,8 +2,12 @@ import OpenAPIClientAxios from "openapi-client-axios";
 import { StoreKey } from "../constant";
 import { nanoid } from "nanoid";
 import { createPersistStore } from "../utils/store";
+import { getClientConfig } from "../config/client";
 import yaml from "js-yaml";
 import { adapter } from "../utils";
+import { useAccessStore } from "./access";
+
+const isApp = getClientConfig()?.isApp;

 export type Plugin = {
  id: string;
@@ -16,7 +20,6 @@ export type Plugin = {
  authLocation?: string;
  authHeader?: string;
  authToken?: string;
-  usingProxy?: boolean;
 };

 export type FunctionToolItem = {
@@ -46,18 +49,25 @@ export const FunctionToolService = {
      plugin?.authType == "basic"
        ? `Basic ${plugin?.authToken}`
        : plugin?.authType == "bearer"
-        ? ` Bearer ${plugin?.authToken}`
+        ? `Bearer ${plugin?.authToken}`
        : plugin?.authToken;
    const authLocation = plugin?.authLocation || "header";
    const definition = yaml.load(plugin.content) as any;
    const serverURL = definition?.servers?.[0]?.url;
-    const baseURL = !!plugin?.usingProxy ? "/api/proxy" : serverURL;
+    const baseURL = !isApp ? "/api/proxy" : serverURL;
    const headers: Record<string, string | undefined> = {
-      "X-Base-URL": !!plugin?.usingProxy ? serverURL : undefined,
+      "X-Base-URL": !isApp ? serverURL : undefined,
    };
    if (authLocation == "header") {
      headers[headerName] = tokenValue;
    }
+    // try using openaiApiKey for Dalle3 Plugin.
+    if (!tokenValue && plugin.id === "dalle3") {
+      const openaiApiKey = useAccessStore.getState().openaiApiKey;
+      if (openaiApiKey) {
+        headers[headerName] = `Bearer ${openaiApiKey}`;
+      }
+    }
    const api = new OpenAPIClientAxios({
      definition: yaml.load(plugin.content) as any,
      axiosConfigDefaults: {
@@ -165,7 +175,7 @@ export const usePluginStore = createPersistStore(
  (set, get) => ({
    create(plugin?: Partial<Plugin>) {
      const plugins = get().plugins;
-      const id = nanoid();
+      const id = plugin?.id || nanoid();
      plugins[id] = {
        ...createEmptyPlugin(),
        ...plugin,
@@ -220,5 +230,42 @@ export const usePluginStore = createPersistStore(
  {
    name: StoreKey.Plugin,
    version: 1,
+    onRehydrateStorage(state) {
+      // Skip store rehydration on server side
+      if (typeof window === "undefined") {
+        return;
+      }
+
+      fetch("./plugins.json")
+        .then((res) => res.json())
+        .then((res) => {
+          Promise.all(
+            res.map((item: any) =>
+              // skip get schema
+              state.get(item.id)
+                ? item
+                : fetch(item.schema)
+                    .then((res) => res.text())
+                    .then((content) => ({
+                      ...item,
+                      content,
+                    }))
+                    .catch((e) => item),
+            ),
+          ).then((builtinPlugins: any) => {
+            builtinPlugins
+              .filter((item: any) => item?.content)
+              .forEach((item: any) => {
+                const plugin = state.create(item);
+                state.updatePlugin(plugin.id, (plugin) => {
+                  const tool = FunctionToolService.add(plugin, true);
+                  plugin.title = tool.api.definition.info.title;
+                  plugin.version = tool.api.definition.info.version;
+                  plugin.builtin = true;
+                });
+              });
+          });
+        });
+    },
  },
 );
--- a/app/utils/auth-settings-events.ts
+++ b/app/utils/auth-settings-events.ts
@@ -0,0 +1,19 @@
+import { sendGAEvent } from "@next/third-parties/google";
+
+export function trackConversationGuideToCPaymentClick() {
+  sendGAEvent("event", "ConversationGuideToCPaymentClick", { value: 1 });
+}
+
+export function trackAuthorizationPageButtonToCPaymentClick() {
+  sendGAEvent("event", "AuthorizationPageButtonToCPaymentClick", { value: 1 });
+}
+
+export function trackAuthorizationPageBannerToCPaymentClick() {
+  sendGAEvent("event", "AuthorizationPageBannerToCPaymentClick", {
+    value: 1,
+  });
+}
+
+export function trackSettingsPageGuideToCPaymentClick() {
+  sendGAEvent("event", "SettingsPageGuideToCPaymentClick", { value: 1 });
+}
				`@@ -0,0 +1 @@`
				`<svg class="icon--SJP_d" width="16" height="16" fill="none" viewBox="0 0 16 16" style="min-width: 16px; min-height: 16px;"><g><path data-follow-fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M5.248 14.444a.625.625 0 0 1-.005-.884l5.068-5.12a.625.625 0 0 0 0-.88L5.243 2.44a.625.625 0 1 1 .889-.88l5.067 5.121c.723.73.723 1.907 0 2.638l-5.067 5.12a.625.625 0 0 1-.884.005Z" fill="currentColor"></path></g></svg>`
				`@@ -0,0 +1 @@`
				<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M12.832 21.801c3.126-.626 7.168-2.875 7.168-8.69c0-5.291-3.873-8.815-6.658-10.434c-.619-.36-1.342.113-1.342.828v1.828c0 1.442-.606 4.074-2.29 5.169c-.86.559-1.79-.278-1.894-1.298l-.086-.838c-.1-.974-1.092-1.565-1.87-.971C4.461 8.46 3 10.33 3 13.11C3 20.221 8.289 22 10.933 22q.232 0 .484-.015C10.111 21.874 8 21.064 8 18.444c0-2.05 1.495-3.435 2.631-4.11c.306-.18.663.055.663.41v.59c0 .45.175 1.155.59 1.637c.47.546 1.159-.026 1.214-.744c.018-.226.246-.37.442-.256c.641.375 1.46 1.175 1.46 2.473c0 2.048-1.129 2.99-2.168 3.357"/></svg>