feat: token guidance

CHANGE_LOG.md

@@ -7,12 +7,14 @@
 ### Fixed
 
 - Fixed the problem of polyfill not working, ensuring that it is loaded on the client
+- Fixed the issue where the permissions of advanced users changed incorrectly when they were on a free trial.
 
 ### Add
 
 - Added Premium feature to support author's future development
 - Added support for Token recharge to unlock more session quotas
 - Added activation guide
+- Guidance when there is insufficient Token for adding: Start Free Trial or Recharge Token
 
 ## v0.6.2
 

CHANGE_LOG.zh_CN.md

@@ -7,12 +7,14 @@
 ### 修复
 
 - 修复 polyfill 不生效的问题，确保其在 client 加载
+- 修复高级版用户再免费试用时用户权限错误变更的问题
 
 ### 新增
 
 - 新增 Premium 功能，支持作者后续研发
 - 新增支持 Token 充值，解锁更多会话额度
 - 新增激活许可证引导
+- 新增 Token 不足时的引导：开始免费试用 or 充值 Token
 
 ## v0.6.2
 

package.json

@@ -15,14 +15,14 @@
   "dependencies": {
     "@emotion/css": "11.11.2",
     "@next-auth/prisma-adapter": "1.0.7",
-    "@prisma/client": "4.15.0",
+    "@prisma/client": "4.16.0",
     "@radix-ui/react-accordion": "1.1.2",
     "@radix-ui/react-alert-dialog": "1.0.4",
     "@radix-ui/react-context-menu": "2.1.4",
     "@radix-ui/react-dialog": "1.0.4",
     "@radix-ui/react-dropdown-menu": "2.0.5",
     "@radix-ui/react-popover": "1.0.6",
-    "@radix-ui/react-progress": "^1.0.3",
+    "@radix-ui/react-progress": "1.0.3",
     "@radix-ui/react-select": "1.2.2",
     "@radix-ui/react-slider": "1.1.2",
     "@radix-ui/react-tabs": "1.0.4",
@@ -44,7 +44,7 @@
     "eslint-config-next": "13.4.6",
     "file-saver": "2.0.5",
     "framer-motion": "10.12.16",
-    "gpt-tokens": "^1.0.9",
+    "gpt-tokens": "1.0.9",
     "js-tiktoken": "1.0.7",
     "l-hooks": "0.4.5",
     "math-random": "2.0.1",
@@ -73,10 +73,10 @@
     "@tailwindcss/typography": "0.5.9",
     "@types/file-saver": "2.0.5",
     "@types/math-random": "1.0.0",
-    "@types/nodemailer": "^6.4.8",
+    "@types/nodemailer": "6.4.8",
     "@types/react-syntax-highlighter": "15.5.7",
     "@types/uuid": "9.0.2",
     "dotenv-cli": "7.2.1",
-    "prisma": "4.15.0"
+    "prisma": "4.16.0"
   }
 }

src/app/api/azure/route.ts

@@ -144,7 +144,7 @@ export async function POST(request: Request) {
 
     const { costTokens, availableTokens } = user;
     if (costTokens >= availableTokens) {
-      return LResponseError("Insufficient token balance");
+      return NextResponse.json({ error: 10005 }, { status: 500 });
     }
   }
 

src/app/api/licenses/activate/route.ts

@@ -93,7 +93,9 @@ export async function POST(request: Request) {
         license_type = "premium";
         add_tokens = 500000;
       } else if (variants_name.includes("Free")) {
-        license_type = "free";
+        if (user.license_type !== "premium" && user.license_type !== "team") {
+          license_type = "free";
+        }
         add_tokens = 10000;
         freeTrialed = 1;
       }

src/app/api/openai/route.ts

@@ -151,7 +151,7 @@ export async function POST(request: Request) {
 
     const { costTokens, availableTokens } = user;
     if (costTokens >= availableTokens) {
-      return LResponseError("Insufficient token balance");
+      return NextResponse.json({ error: 10005 }, { status: 500 });
     }
   }
 

src/components/chatSection/chatFooter/index.tsx

@@ -19,6 +19,8 @@ import {
   useStreamDecoder,
   useUserInfo,
   useLLM,
+  usePremium,
+  useRecharge,
   BASE_PROMPT,
   ChannelListItem,
 } from "@/hooks";
@@ -35,7 +37,9 @@ const ChatFooter: React.FC = () => {
   const router = useRouter();
   const [newOpenAI] = useOpenAI();
   const [channel, setChannel] = useChannel();
-  const [, setTokens] = useUserInfo();
+  const [userInfo, setTokens] = useUserInfo();
+  const [, setPremiumOpen] = usePremium();
+  const [, setRechargeOpen] = useRecharge();
   const { openai, azure } = useLLM();
   const [inputValue, setInputValue] = React.useState<string>("");
   const LLMOptions = React.useMemo(() => [openai, azure], [openai, azure]);
@@ -52,6 +56,8 @@ const ChatFooter: React.FC = () => {
   const tCommon = useTranslations("common");
   const tRes = useTranslations("responseErr");
   const tAuth = useTranslations("auth");
+  const tRecharge = useTranslations("recharge");
+  const tPremium = useTranslations("premium");
   const scrollToBottom = useScrollToBottom();
   const { decoder } = useStreamDecoder();
 
@@ -74,6 +80,17 @@ const ChatFooter: React.FC = () => {
     window.open("https://docs.ltopx.com/conversation-limits");
   };
 
+  const handleRecharge = () => {
+    toast.dismiss();
+    if (!userInfo.license_type) {
+      // 开始免费试用
+      setPremiumOpen(true);
+    } else {
+      // 打开充值token界面
+      setRechargeOpen(true);
+    }
+  };
+
   const onGenerate = () => {
     // stop generate
     if (loadingChannel) {
@@ -300,6 +317,20 @@ const ChatFooter: React.FC = () => {
               errorMessage = tRes("10002");
             } else if (errRes.error === 10004) {
               errorMessage = tRes("10004");
+            } else if (errRes.error === 10005) {
+              return toast(
+                () => (
+                  <div className="flex gap-4 items-center">
+                    {tRes("10005")}
+                    <Button type="primary" onClick={handleRecharge}>
+                      {userInfo.license_type
+                        ? tRecharge("recharge")
+                        : tPremium("free-trial")}
+                    </Button>
+                  </div>
+                ),
+                { duration: 5000 }
+              );
             } else if (errRes.error.code === "context_length_exceeded") {
               return toast(
                 () => (

src/components/navbar/index.tsx

@@ -135,7 +135,7 @@ export default function Navbar() {
           )}
         </div>
 
-        <div className="absolute right-14 hidden md:block">
+        <div className="absolute right-16 hidden md:block">
           <Button type="outline" onClick={onOpenPremium}>
             <AiFillGift size={20} className="text-orange-400" />
           </Button>

src/locales/en.json

@@ -178,6 +178,7 @@
     "10002": "API Key missing, please check configuration or contact the developer",
     "10003": "Language model parameter error",
     "10004": "Please configure Azure API Version first",
+    "10005": "Insufficient token balance",
     "context_length_exceeded": "Session content is too long. Delete some or create a new session.",
     "learn-more": "Learn More"
   },

src/locales/zh-CN.json

@@ -178,6 +178,7 @@
     "10002": "API Key缺失，请检查配置或联系开发人员",
     "10003": "语言模型参数错误",
     "10004": "请先配置Azure API Version",
+    "10005": "Token 余额不足",
     "context_length_exceeded": "会话内容过长，请删减或新建另一个会话继续使用。",
     "learn-more": "了解更多"
   },