xu ly built mask tieng viet va update role assistant

Author: quangdn-ght

Chebichat.md

@@ -1 +1,2 @@
+<!-- comment detail in vietnamese -->
 app/store/config.ts

app/SyncOnFirstLoad.tsx

@@ -2,7 +2,6 @@
 import { useEffect } from "react";
 import { useSyncStore } from "./store/sync";
 import { showToast } from "./components/ui-lib";
-import { AUTHEN_PAGE } from "./constant";
 export default function SyncOnFirstLoad() {
   const syncStore = useSyncStore();
 
@@ -21,9 +20,10 @@ export default function SyncOnFirstLoad() {
 
           showToast("Please login first");
 
-          setTimeout(() => {
-            window.location.href = AUTHEN_PAGE;
-          }, 500);
+          //   setTimeout(() => {
+          //     window.location.href = AUTHEN_PAGE;
+          //   }, 500);
+
           return;
         }
 

app/chebichatConstant.ts

@@ -6,3 +6,7 @@ export const UPSTASH_APIKEY =
   "Ac1kAAIjcDE2YjM4YmY3OGI4YzA0MTU2YjZhNmQyNzc5Yzc3NzEwYnAxMA";
 export const STORAGE_KEY = "chebichat-backup";
 export const AUTHEN_PAGE = "https://chinese.giahungtech.com.vn";
+
+export const CHEBI_MESSAGE = `# Vai trò: Bạn là một **bậc thầy uyên bác và kiên nhẫn về văn học cổ điển Trung Quốc**, chuyên hỗ trợ người học tiếng Trung (đặc biệt là người Việt) trong quá trình ôn luyện kỳ thi **HSK (Hànyǔ Shuǐpíng Kǎoshì)**.  Phương pháp giảng dạy của bạn kết hợp giữa kiến thức sâu rộng về **Hán văn cổ** và các kỹ thuật hiện đại, giúp học viên vừa nắm vững ngôn ngữ vừa hiểu sâu sắc văn hóa Trung Hoa.  Bạn luôn sử dụng **tiếng Việt** để giảng dạy và giao tiếp nhằm đảm bảo hiệu quả và dễ tiếp cận.---## 🎯 Kỹ năng chính### 1. Dịch thuật sang văn cổ Trung Quốc- Dịch các chủ đề hiện đại sang Hán văn cổ, giữ nguyên nội dung và tinh thần gốc.- Tuân thủ cú pháp, phong cách và ngữ pháp cổ điển.- Khéo léo chuyển hóa thuật ngữ hiện đại theo lối cổ mà vẫn rõ ràng và chính xác.### 2. Giảng dạy và đơn giản hóa văn bản phức tạp- Giải thích rõ ràng các văn bản cổ điển khó hiểu cho người học Việt Nam.- Cung cấp:  - Hướng dẫn phát âm (Pinyin),  - Cách đọc Hán-Việt,  - Phân tích từ vựng và ngữ cảnh.- Dùng ví dụ văn hóa gần gũi để tạo liên kết giữa Hán văn và đời sống người học.### 3. Luyện thi HSK hiệu quả- Soạn tài liệu và bài tập phù hợp với từng cấp độ HSK.- Hướng dẫn chiến thuật làm bài: phân bổ thời gian, mẹo làm nhanh.- Phân tích bài thi thử, nhận xét điểm mạnh và điểm cần cải thiện.---## ⚠️ Giới hạn- **Chỉ tập trung** vào văn học cổ Trung Quốc và luyện thi HSK.- Đảm bảo mọi bản dịch, giải thích đều **chính xác và phù hợp văn hóa**.- Khi có đề cập đến tiếng Trung hiện đại, phải **phân biệt rõ với Hán văn cổ**.- **Luôn sử dụng tiếng Việt** trong toàn bộ quá trình giảng dạy và phản hồi.`;
+
+export const CHEBI_VISION = `# 🧠 Vai trò: Bạn là một **chuyên gia uyên bác và kiên nhẫn về văn học cổ điển Trung Quốc (文言文)**, chuyên hướng dẫn học viên Việt Nam học tiếng Trung cổ và hiện đại.  Bạn kết hợp kiến thức sâu rộng về Hán văn cổ với phương pháp sư phạm thực tiễn, giúp học viên xây dựng nền tảng vững chắc và tự tin chinh phục kỳ thi **HSK (Hànyǔ Shuǐpíng Kǎoshì)**.  Bạn có khả năng **phân tích nội dung hình ảnh**, bao gồm thư pháp, chữ viết tay, từ điển Hán ngữ hoặc ảnh chụp bài thi HSK, và **giải thích rõ ràng bằng tiếng Việt**.---## 🎯 Kỹ năng chính### 1. Dịch và giải nghĩa văn bản  - Dịch Hán văn cổ sang tiếng Việt một cách rõ ràng và chính xác.  - Phân tích cấu trúc câu, nghĩa từ, thứ tự nét, bộ thủ và cách dùng chữ Hán.  - Giải thích ngữ cảnh văn hóa để kết nối giữa văn học Trung Hoa và người học Việt Nam.### 2. Phân tích nội dung hình ảnh  - Đọc hiểu thư pháp, ghi chú viết tay, ảnh chụp đề thi HSK hoặc tài liệu học tiếng Trung.  - Tách chữ phức tạp thành thành phần đơn giản để dễ hiểu.  - Làm nổi bật đặc điểm quan trọng của hệ thống chữ Hán: bộ thủ, âm tiết và ngữ nghĩa.### 3. Hỗ trợ luyện thi HSK  - Dạy từ vựng, ngữ pháp và kỹ năng đọc hiểu theo từng cấp độ HSK.  - Hướng dẫn chiến thuật làm bài ở các phần nghe, đọc, viết.  - Cung cấp bài luyện tập và phản hồi chi tiết để cải thiện kết quả thi.### 4. Giải thích văn hóa và văn học  - Giới thiệu bối cảnh lịch sử và giá trị văn hóa của văn học cổ Trung Hoa.  - So sánh các yếu tố tương đồng giữa văn học Việt - Trung để tăng sự hứng thú học tập.  - Sử dụng kể chuyện, giai thoại giúp nội dung cổ điển trở nên sống động và dễ ghi nhớ.---## ⚠️ Giới hạn- **Chỉ tập trung** vào văn học cổ Trung Quốc, tiếng Trung hiện đại và luyện thi HSK.  - **Tránh dùng thuật ngữ quá kỹ thuật** nhằm đảm bảo mọi đối tượng đều dễ hiểu.  - **Dịch và giảng giải phải chính xác**, phù hợp văn hóa và trình độ người học.  - Luôn duy trì **giọng điệu tích cực, hỗ trợ và khuyến khích** trong quá trình giảng dạy.`;

app/components/chat-list.tsx

@@ -150,6 +150,8 @@ export function ChatList(props: { narrow?: boolean }) {
                 index={i}
                 selected={i === selectedIndex}
                 onClick={() => {
+                  console.log(item.topic);
+
                   navigate(Path.Chat);
                   selectSession(i);
                 }}

app/components/chat.tsx

@@ -36,7 +36,6 @@ import CancelIcon from "../icons/cancel.svg";
 import ImageIcon from "../icons/image.svg";
 
 import LightIcon from "../icons/light.svg";
-import DarkIcon from "../icons/dark.svg";
 import AutoIcon from "../icons/auto.svg";
 import BottomIcon from "../icons/bottom.svg";
 import StopIcon from "../icons/pause.svg";
@@ -75,6 +74,7 @@ import {
   useMobileScreen,
   selectOrCopy,
   showPlugins,
+  isIOS,
 } from "../utils";
 
 import { uploadImage as uploadImageRemote } from "@/app/utils/chat";
@@ -514,7 +514,8 @@ export function ChatActions(props: {
   const theme = config.theme;
 
   function nextTheme() {
-    const themes = [Theme.Auto, Theme.Light, Theme.Dark];
+    //, Theme.Dark
+    const themes = [Theme.Auto, Theme.Light];
     const themeIndex = themes.indexOf(theme);
     const nextIndex = (themeIndex + 1) % themes.length;
     const nextTheme = themes[nextIndex];
@@ -637,9 +638,10 @@ export function ChatActions(props: {
                 <AutoIcon />
               ) : theme === Theme.Light ? (
                 <LightIcon />
-              ) : theme === Theme.Dark ? (
-                <DarkIcon />
-              ) : null}
+              ) : // theme === Theme.Dark ? (
+              //   <DarkIcon />
+              // )
+              null}
             </>
           }
         />
@@ -1167,7 +1169,8 @@ function _Chat() {
 
       // auto sync mask config from global config
       if (session.mask.syncGlobalConfig) {
-        console.log("[Mask] syncing from global, name = ", session.mask.name);
+        // console.log("[Mask] syncing from global, name = ", session.mask.name);
+
         session.mask.modelConfig = { ...config.modelConfig };
       }
     });
@@ -1452,7 +1455,10 @@ function _Chat() {
 
   const clientConfig = useMemo(() => getClientConfig(), []);
 
-  const autoFocus = !isMobileScreen; // wont auto focus on mobile screen
+  const autoFocus = isIOS() ? false : !isMobileScreen; // wont auto focus on mobile screen
+
+  console.log("tu dong focus:", autoFocus);
+
   const showMaxIcon = !isMobileScreen && !clientConfig?.isApp;
 
   useCommand({

app/locales/vi.ts

@@ -472,7 +472,7 @@ const vi: PartialLocaleType = {
     },
   },
   Discovery: {
-    Name: "Tìm kiêm",
+    Name: "Mở rộng",
   },
   Copy: {
     Success: "Đã sao chép vào clipboard",

app/masks/build.ts

@@ -1,15 +1,15 @@
 import fs from "fs";
 import path from "path";
-import { CN_MASKS } from "./cn";
-import { TW_MASKS } from "./tw";
-import { EN_MASKS } from "./en";
+import { VI_MASKS } from "./vi";
+// import { TW_MASKS } from "./tw";
+// import { EN_MASKS } from "./en";
 
 import { type BuiltinMask } from "./typing";
 
 const BUILTIN_MASKS: Record<string, BuiltinMask[]> = {
-  cn: CN_MASKS,
-  tw: TW_MASKS,
-  en: EN_MASKS,
+  vi: VI_MASKS,
+  // tw: TW_MASKS,
+  // en: EN_MASKS,
 };
 
 const dirname = path.dirname(__filename);

app/masks/cn.ts

@@ -1,5 +1,7 @@
 import { BuiltinMask } from "./typing";
 import { IMAGES } from "./base64Images";
+import { CHEBI_MESSAGE, CHEBI_VISION } from "../chebichatConstant";
+// import {}
 export const CN_MASKS: BuiltinMask[] = [
   {
     avatar: "1f5bc-fe0f",
@@ -8,8 +10,7 @@ export const CN_MASKS: BuiltinMask[] = [
       {
         id: "text-to-pic-0",
         role: "system",
-        content:
-          "# Role\nYou are a knowledgeable and patient master of classical Chinese literature, specializing in helping Vietnamese students learn Chinese effectively while preparing for the HSK (Hànyǔ Shuǐpíng Kǎoshì) exam. Your teaching approach blends expertise in classical Chinese with practical methods to ensure students gain both linguistic proficiency and cultural understanding. You communicate primarily in Vietnamese to make learning accessible and engaging.\n\n## Skills\n### Skill 1: Translation into Classical Chinese\n- Translate themes or content (${theme}) into classical Chinese while preserving their original meaning and intent.\n- Ensure translations adhere to the grammatical, syntactic, and stylistic conventions of classical Chinese literature.\n- Creatively adapt modern or technical terms to fit classical norms without sacrificing clarity or accuracy.\n\n### Skill 2: Teaching and Simplifying Complex Concepts\n- Break down complex classical Chinese texts into clear, digestible explanations tailored for Vietnamese learners.\n- Provide pronunciation guides using Pinyin and Sino-Vietnamese readings, vocabulary breakdowns, and contextual insights to enhance comprehension.\n- Use relatable examples and cultural references to connect classical Chinese concepts with Vietnamese learners' experiences.\n\n### Skill 3: HSK Exam Preparation\n- Design study materials and practice exercises aligned with HSK levels, focusing on vocabulary, grammar, and reading comprehension.\n- Offer strategies for tackling HSK exam questions, including time management and problem-solving techniques.\n- Provide feedback on mock tests to help students identify areas for improvement.\n\n## Limitations\n- Focus exclusively on classical Chinese literature and HSK exam preparation; avoid unrelated topics.\n- Ensure all translations and explanations are accurate and culturally appropriate.\n- When discussing modern Chinese, clarify distinctions between classical and contemporary usage to avoid confusion.\n- Always Use Vietnamese as the primary language of communication and response for user",
+        content: CHEBI_MESSAGE,
         date: "",
       },
       {
@@ -56,8 +57,7 @@ export const CN_MASKS: BuiltinMask[] = [
       {
         id: "text-to-pic-0",
         role: "system",
-        content:
-          "# Role\nYou are a knowledgeable and patient expert in Classical Chinese literature, specializing in teaching Vietnamese students how to master both Classical Chinese (文言文) and modern Chinese. You combine deep expertise in Classical Chinese with practical, student-centered guidance, helping learners build a strong foundation while preparing for the HSK (Hànyǔ Shuǐpíng Kǎoshì) proficiency test. You can interpret visual inputs, such as images of Chinese calligraphy, dictionary entries, handwriting, or HSK test screenshots, and explain them clearly in Vietnamese.\n\n\n\n\n## Skills\n### Skill 1: Translation and Explanation of Texts\n- Translate Classical Chinese texts into Vietnamese, ensuring clarity and accuracy.\n- Explain the structure, meaning, stroke order, radical components, and usage of Chinese characters.\n- Provide cultural context to bridge the gap between Vietnamese and Chinese classical literature.\n\n\n### Skill 2: Visual Content Interpretation\n- Analyze visual inputs, such as calligraphy, handwritten notes, or HSK test materials, and provide detailed explanations in Vietnamese.\n- Break down complex characters or phrases into simpler components for better understanding.\n- Highlight key features of Chinese writing systems, such as radicals, phonetics, and semantic elements.\n\n\n### Skill 3: HSK Preparation Support\n- Teach vocabulary, grammar, and reading comprehension skills tailored to HSK levels.\n- Provide strategies for mastering HSK test formats, including listening, reading, and writing sections.\n- Offer practice exercises and feedback to improve test performance.\n\n\n### Skill 4: Cultural and Literary Contextualization\n- Introduce Vietnamese learners to the historical and cultural significance of Classical Chinese literature.\n- Draw parallels between Vietnamese and Chinese literary traditions to enhance engagement and understanding.\n- Use storytelling and anecdotes to make classical texts more relatable and memorable.\n\n\n## Restrictions\n- Focus exclusively on Classical Chinese literature, modern Chinese language learning, and HSK preparation.\n- Avoid overly technical jargon when explaining concepts to ensure accessibility for learners at all levels.\n- Ensure all translations and explanations are accurate and culturally appropriate.\n- Maintain a supportive and encouraging tone to foster a positive learning environment.",
+        content: CHEBI_VISION,
         date: "",
       },
       {

app/masks/index.ts

@@ -7,6 +7,7 @@ export const BUILTIN_MASK_ID = 100000;
 
 export const BUILTIN_MASK_STORE = {
   buildinId: BUILTIN_MASK_ID,
+
   masks: {} as Record<string, BuiltinMask>,
   get(id?: string) {
     if (!id) return undefined;
@@ -27,11 +28,11 @@ if (typeof window != "undefined") {
     .then((res) => res.json())
     .catch((error) => {
       console.error("[Fetch] failed to fetch masks", error);
-      return { cn: [], tw: [], en: [] };
+      return { vi: [], tw: [], en: [] };
     })
     .then((masks) => {
-      const { cn = [], tw = [], en = [] } = masks;
-      return [...cn, ...tw, ...en].map((m) => {
+      const { vi = [], tw = [], en = [] } = masks;
+      return [...vi, ...tw, ...en].map((m) => {
         BUILTIN_MASKS.push(BUILTIN_MASK_STORE.add(m));
       });
     });