Merge pull request #5470 from ChatGPTNextWeb/add_tip_top

add fanyi add top tip
2025-11-04 08:13:43 +08:00 · 2024-09-25 15:46:21 +08:00
parent 7dc0f81d3f e83f61e74d
commit a5ac2386d8
32 changed files with 556 additions and 66 deletions
--- a/app/components/auth.module.scss
+++ b/app/components/auth.module.scss
@@ -5,6 +5,54 @@
  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;
--- a/app/components/auth.tsx
+++ b/app/components/auth.tsx
@@ -1,25 +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, 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 = "";
@@ -36,6 +45,7 @@ export function AuthPage() {

  return (
    <div className={styles["auth-page"]}>
+      <TopBanner></TopBanner>
      <div className={styles["auth-header"]}>
        <IconButton
          icon={<LeftIcon />}
@@ -105,3 +115,65 @@ export function AuthPage() {
    </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
@@ -21,7 +21,6 @@ import {
 } from "./artifacts";
 import { useChatStore } from "../store";
 import { IconButton } from "./button";
-
 export function Mermaid(props: { code: string }) {
  const ref = useRef<HTMLDivElement>(null);
  const [hasError, setHasError] = useState(false);
--- 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/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
@@ -19,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,
@@ -690,6 +690,7 @@ export function Settings() {

  const saasStartComponent = (
    <ListItem
+      className={styles["subtitle-button"]}
      title={
        Locale.Settings.Access.SaasStart.Title +
        `${Locale.Settings.Access.SaasStart.Label}`
@@ -705,6 +706,7 @@ export function Settings() {
        type={"primary"}
        text={Locale.Settings.Access.SaasStart.ChatNow}
        onClick={() => {
+          trackSettingsPageGuideToCPaymentClick();
          window.location.href = SAAS_CHAT_URL;
        }}
      />
--- 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
@@ -502,4 +502,4 @@ export const PLUGINS = [
  { name: "Search Chat", path: Path.SearchChat },
 ];

-export const SAAS_CHAT_URL = "https://nextchat.dev";
+export const SAAS_CHAT_URL = "https://nextchat.dev/chat";
--- 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/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_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_URL})
+    \\ 2️⃣ إذا كنت تريد استخدام موارد OpenAI الخاصة بك، انقر [هنا](/#/settings) لتعديل الإعدادات ⚙️`
+      : `😆 واجهت المحادثة بعض المشكلات، لا داعي للقلق:
+    \ 1️⃣ إذا كنت ترغب في تجربة دون إعداد، [انقر هنا لبدء المحادثة فورًا 🚀](${SAAS_CHAT_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_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_URL})
+    \\ 2️⃣ যদি আপনি আপনার নিজস্ব OpenAI সম্পদ ব্যবহার করতে চান, তাহলে [এখানে ক্লিক করুন](/#/settings) সেটিংস পরিবর্তন করতে ⚙️`
+      : `😆 কথোপকথনে কিছু সমস্যা হয়েছে, চিন্তার কিছু নেই:
+    \ 1️⃣ যদি আপনি শূন্য কনফিগারেশনে শুরু করতে চান, তাহলে [এখানে ক্লিক করে অবিলম্বে কথোপকথন শুরু করুন 🚀](${SAAS_CHAT_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
@@ -2,6 +2,7 @@ import { getClientConfig } from "../config/client";
 import { SubmitKey } from "../store/config";
 import { SAAS_CHAT_URL } from "@/app/constant";

+const SAAS_CHAT_URL_WITH_PARAM = `${SAAS_CHAT_URL}?data=title`;
 const isApp = !!getClientConfig()?.isApp;

 const cn = {
@@ -9,10 +10,10 @@ const cn = {
  Error: {
    Unauthorized: isApp
      ? `😆 对话遇到了一些问题，不用慌:
-       \\ 1️⃣ 想要零配置开箱即用，[点击这里立刻开启对话 🚀](${SAAS_CHAT_URL})
+       \\ 1️⃣ 想要零配置开箱即用，[点击这里立刻开启对话 🚀](${SAAS_CHAT_URL_WITH_PARAM})
       \\ 2️⃣ 如果你想消耗自己的 OpenAI 资源，点击[这里](/#/settings)修改设置 ⚙️`
      : `😆 对话遇到了一些问题，不用慌:
-       \ 1️⃣ 想要零配置开箱即用，[点击这里立刻开启对话 🚀](${SAAS_CHAT_URL})
+       \ 1️⃣ 想要零配置开箱即用，[点击这里立刻开启对话 🚀](${SAAS_CHAT_URL_WITH_PARAM})
       \ 2️⃣ 如果你正在使用私有部署版本，点击[这里](/#/auth)输入访问秘钥 🔑
       \ 3️⃣ 如果你想消耗自己的 OpenAI 资源，点击[这里](/#/settings)修改设置 ⚙️
       `,
@@ -26,6 +27,8 @@ const cn = {
    Confirm: "确认",
    Later: "稍后再说",
    SaasTips: "配置太麻烦，想要立即使用",
+    TopTips:
+      "🥳 NextChat AI 首发优惠，立刻解锁 OpenAI o1, GPT-4o, Claude-3.5 等最新大模型",
  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} 条对话`,
--- 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_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_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_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_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_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_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
@@ -27,6 +27,8 @@ const en: LocaleType = {
    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`,
--- 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_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_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_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_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_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_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_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_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_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_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_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_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_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_URL})
+    \\ 2️⃣ 自分のOpenAIリソースを使用したい場合は、[ここをクリックして](/#/settings)設定を変更してください ⚙️`
+      : `😆 会話中に問題が発生しましたが、心配しないでください:
+    \ 1️⃣ 設定なしで始めたい場合は、[ここをクリックしてすぐにチャットを開始 🚀](${SAAS_CHAT_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_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_URL})
+    \\ 2️⃣ 자신의 OpenAI 리소스를 사용하고 싶다면, [여기를 클릭하여](/#/settings) 설정을 수정하세요 ⚙️`
+      : `😆 대화 중 문제가 발생했습니다, 걱정하지 마세요:
+    \ 1️⃣ 제로 구성으로 시작하고 싶다면, [여기를 클릭하여 즉시 대화를 시작하세요 🚀](${SAAS_CHAT_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_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_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_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_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_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_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_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_URL})
+    \\ 2️⃣ Если вы хотите использовать свои ресурсы OpenAI, нажмите [здесь](/#/settings), чтобы изменить настройки ⚙️`
+      : `😆 В разговоре возникли некоторые проблемы, не переживайте:
+    \ 1️⃣ Если вы хотите начать без настройки, [нажмите здесь, чтобы немедленно начать разговор 🚀](${SAAS_CHAT_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_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_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_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_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_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_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_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_URL})
+    \\ 2️⃣ 如果你想消耗自己的 OpenAI 資源，點擊[這裡](/#/settings)修改設定 ⚙️`
+      : `😆 對話遇到了一些問題，不用慌:
+    \ 1️⃣ 想要零配置開箱即用，[點擊這裡立刻開啟對話 🚀](${SAAS_CHAT_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_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_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_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/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>`