docs: localization

apps/docs/.dumi/theme/componets/banner/constants.ts

@@ -1,75 +1,10 @@
+
 export interface FeatureProps {
   title: string;
   description: string;
   imageUrl: string;
   isImageLeft: boolean;
 }
 
-export const totalfeatures: FeatureProps[] = [
-  {
-    title: '面向投研的量化代码生成场景',
-    description:
-      'Build stunning landing pages in minutes with our intuitive drag-and-drop interface and pre-designed components.',
-    imageUrl:
-      '/zhu.png',
-    isImageLeft: true,
-  },
-];
 
-export const firstfeatures: FeatureProps[] = [
-  {
-    title: '隐私计算场景多节点调试',
-    description:
-      'SecretNote 是专为隐语开发者打造的高级工具套件，支持多节点代码执行和文件管理，同时提供运行状态追踪功能，能较大程度提升开发者的效率和工作体验。',
-    imageUrl:
-      '/scretenote.png',
-    isImageLeft: true,
-  },
-  {
-    title: '量化场景的智能代码生成',
-    description:
-      '在量化分析师最舒适习惯的编码环境中，通过 Prompt Cell 丝滑引入大模型生态与定制智能体。',
-    imageUrl:
-      '/zhu.png',
-    isImageLeft: false,
-  },
-  {
-    title: '大数据 SQL 交互增强',
-    description: '提供强大的内核定制能力，支持 ODPS SQL 等执行环境',
-    imageUrl:
-      '/sql_ide.png',
-    isImageLeft: true,
-  },
-];
 
-export const secondfeatures: FeatureProps[] = [
-  {
-    title: 'AI Copilot',
-    description: '支持智能助手 AI 对话功能',
-    imageUrl:
-      '/copilot.png',
-    isImageLeft: true,
-  },
-  {
-    title: 'Notebook 即 App',
-    description: '基于 Notebook 结合交互控件生成动态报告',
-    imageUrl:
-      '/app.png',
-    isImageLeft: false,
-  },
-  {
-    title: '版本 Diff 能力',
-    description: '支持 Cell 级别的版本 Diff 能力，方便更好的进行版本管理、CR。',
-    imageUrl:
-      '/diff.png',
-    isImageLeft: true,
-  },
-  {
-    title: '更优异的代码提示能力',
-    description:
-      'Libro 拥有卓越的编辑体验，尤其针对 Python 代码，提供更优异的代码补全、代码提示、代码格式化和定义跳转等功能。',
-    imageUrl:
-      '/tip.png',
-    isImageLeft: false,
-  },
-];

apps/docs/.dumi/theme/componets/banner/feature-section.tsx

@@ -1,8 +1,6 @@
 import type { FC } from 'react';
 import React from 'react';
 
-import { Button } from '../ui/button';
-
 import type { FeatureProps } from './constants';
 
 const Feature: FC<FeatureProps> = ({ title, description, imageUrl, isImageLeft }) => (

apps/docs/.dumi/theme/componets/banner/hero-section.tsx

@@ -1,4 +1,5 @@
 // import { BGShapeCircle } from "@/components/bg-shape-circle";
+import { l10n } from '@difizen/mana-l10n';
 import { Button } from 'antd';
 import type { FC } from 'react';
 import React from 'react';
@@ -23,7 +24,7 @@ export const HeroSection: FC = () => {
             libro
           </h1>
           <p className="text-xl sm:text-2xl text-muted-foreground mb-8">
-            灵活定制、轻松集成的 Notebook 产品方案
+            {l10n.t('Flexible customization and easy integration of Notebook product solutions.')}
           </p>
           <Button type="primary" size="large" className="start-btn" href="http://libro-lab.difizen.net/libro?" target="_blank">
             Start now

apps/docs/.dumi/theme/componets/banner/index.tsx

@@ -1,28 +1,82 @@
-import { useSiteData } from 'dumi';
+import { l10n } from '@difizen/mana-l10n';
 import React from 'react';
 
-import { firstfeatures, secondfeatures } from './constants';
+import type { FeatureProps} from './constants';
 import { FeatureSection } from './feature-section';
 import { HeroSection } from './hero-section';
 import './index.less';
 import { IntergractionSection } from './intergration';
 
 const Banner: React.FC = () => {
-  const { themeConfig } = useSiteData();
 
-  if (!themeConfig.banner) {
-    return null;
-  }
+
+  const firstfeatures: FeatureProps[] = [
+    {
+      title: l10n.t('Multi-node debugging in secret computing scenarios.'),//'隐私计算场景多节点调试',
+      description:
+        l10n.t(`SecretNote is an advanced tool suite designed specifically for Enigma developers. It supports multi-node code execution and file management, while also providing runtime status tracking features, significantly enhancing developer's efficiency and work experience.`),
+      imageUrl:
+        '/scretenote.png',
+      isImageLeft: true,
+    },
+    {
+      title: l10n.t('Intelligent code generation for quantitative scenarios.'),
+      description:l10n.t('In the coding environment most comfortable for quantitative analysts, seamlessly integrate large model ecosystems and custom agents through Prompt Cell.'),
+      imageUrl:
+        '/zhu.png',
+      isImageLeft: false,
+    },
+    {
+      title: l10n.t('Big Data SQL Interaction Enhancement'),
+      description: l10n.t('Provide powerful kernel customization capabilities, supporting execution environments like ODPS SQL.'),
+      imageUrl:
+        '/sql_ide.png',
+      isImageLeft: true,
+    },
+  ];
+
+
+  const secondfeatures: FeatureProps[] = [
+    {
+      title: 'AI Copilot',
+      description: l10n.t('Support intelligent assistant AI dialogue functions.'),
+      imageUrl:
+        '/copilot.png',
+      isImageLeft: true,
+    },
+    {
+      title: l10n.t('Notebook as an App'),
+      description: l10n.t('Generate dynamic reports based on Notebooks combined with interactive controls.'),
+      imageUrl:
+        '/app.png',
+      isImageLeft: false,
+    },
+    {
+      title: l10n.t('Version Diff Capability'),
+      description: l10n.t('Support cell-level version diff capability for better version management and code review.'),
+      imageUrl:
+        '/diff.png',
+      isImageLeft: true,
+    },
+    {
+      title: l10n.t('Superior code suggestion capabilities'),
+      description:
+      l10n.t('Libro offers an exceptional editing experience, especially for Python code, providing superior code completion, code suggestions, code formatting, and go-to-definition features.'),
+      imageUrl:
+        '/tip.png',
+      isImageLeft: false,
+    },
+  ];
   return (
     <div className="difizen-dumi-banner">
       <HeroSection></HeroSection>
       <FeatureSection
         features={firstfeatures}
-        title="企业级场景定制能力"
+        title={l10n.t('Enterprise-level scenario customization capabilities')}
       ></FeatureSection>
       <FeatureSection
         features={secondfeatures}
-        title="激动人心的功能特性"
+        title={l10n.t('Exciting features and capabilities')}
       ></FeatureSection>
       <IntergractionSection></IntergractionSection>
     </div>

apps/docs/.dumi/theme/componets/banner/intergration.tsx

@@ -1,3 +1,4 @@
+import { l10n } from '@difizen/mana-l10n';
 import { Row, Col } from 'antd';
 import React from 'react';
 import type { FC } from 'react';
@@ -6,7 +7,7 @@ import './index.less';
 export const IntergractionSection: FC = () => {
   return (
     <div className="py-16 px-4 sm:px-6 lg:px-8 mx-auto max-w-7xl">
-      <p className="feature-title">谁在使用</p>
+      <p className="feature-title">{l10n.t('Who is using')}</p>
       <Row className="user-container">
         <Col sm={12} md={8} lg={6} >
           <a className="user-item" href="https://github.com/secretflow/secretnote" target="_blank" rel="noreferrer">

apps/docs/.dumi/theme/lang/bundle.l10n.en-US.json

@@ -0,0 +1,26 @@
+{
+  "Contact Us": "Contact Us",
+  "Copied": "Copied",
+  "Related": "Related",
+  "Community": "Community",
+  "feedback issues": "feedback issues",
+  "release notes": "release notes",
+  "DingTalk":"DingTalk",
+  "Flexible customization and easy integration of Notebook product solutions.": "Flexible customization and easy integration of Notebook product solutions.",
+  "Multi-node debugging in secret computing scenarios.":"Multi-node debugging in secret computing scenarios.",
+  "SecretNote is an advanced tool suite designed specifically for Enigma developers. It supports multi-node code execution and file management, while also providing runtime status tracking features, significantly enhancing developer's efficiency and work experience.":"SecretNote is an advanced tool suite designed specifically for Enigma developers. It supports multi-node code execution and file management, while also providing runtime status tracking features, significantly enhancing developer's efficiency and work experience.",
+  "Intelligent code generation for quantitative scenarios.":"Intelligent code generation for quantitative scenarios.",
+  "In the coding environment most comfortable for quantitative analysts, seamlessly integrate large model ecosystems and custom agents through Prompt Cell.":"In the coding environment most comfortable for quantitative analysts, seamlessly integrate large model ecosystems and custom agents through Prompt Cell.",
+  "Big Data SQL Interaction Enhancement":"Big Data SQL Interaction Enhancement",
+  "Provide powerful kernel customization capabilities, supporting execution environments like ODPS SQL.":"Provide powerful kernel customization capabilities, supporting execution environments like ODPS SQL.",
+  "Support intelligent assistant AI dialogue functions.":"Support intelligent assistant AI dialogue functions.",
+  "Notebook as an App":"Notebook as an App",
+  "Generate dynamic reports based on Notebooks combined with interactive controls.":"Generate dynamic reports based on Notebooks combined with interactive controls.",
+  "Version Diff Capability":"Version Diff Capability",
+  "Support cell-level version diff capability for better version management and code review.":"Support cell-level version diff capability for better version management and code review.",
+  "Superior code suggestion capabilities":"Superior code suggestion capabilities",
+  "Libro offers an exceptional editing experience, especially for Python code, providing superior code completion, code suggestions, code formatting, and go-to-definition features.":"Libro offers an exceptional editing experience, especially for Python code, providing superior code completion, code suggestions, code formatting, and go-to-definition features.",
+  "Enterprise-level scenario customization capabilities":"Enterprise-level scenario customization capabilities",
+  "Exciting features and capabilities":"Exciting features and capabilities",
+  "Who is using":"Who is using"
+}

apps/docs/.dumi/theme/lang/bundle.l10n.zh-CN.json

@@ -0,0 +1,26 @@
+{
+  "Contact Us": "联系我们",
+  "Copied": "已复制",
+  "Related": "相关资源",
+  "Community": "社区",
+  "feedback issues": "反馈问题",
+  "release notes": "发布日志",
+  "DingTalk":"钉钉",
+  "Flexible customization and easy integration of Notebook product solutions.": "灵活定制、轻松集成的 Notebook 产品方案",
+  "Multi-node debugging in secret computing scenarios.":"隐私计算场景多节点调试",
+  "SecretNote is an advanced tool suite designed specifically for Enigma developers. It supports multi-node code execution and file management, while also providing runtime status tracking features, significantly enhancing developer's efficiency and work experience.":"SecretNote 是专为隐语开发者打造的高级工具套件，支持多节点代码执行和文件管理，同时提供运行状态追踪功能，能较大程度提升开发者的效率和工作体验。",
+  "Intelligent code generation for quantitative scenarios.":"量化场景的智能代码生成",
+  "In the coding environment most comfortable for quantitative analysts, seamlessly integrate large model ecosystems and custom agents through Prompt Cell.":"在量化分析师最舒适习惯的编码环境中，通过 Prompt Cell 丝滑引入大模型生态与定制智能体。",
+  "Big Data SQL Interaction Enhancement":"大数据 SQL 交互增强",
+  "Provide powerful kernel customization capabilities, supporting execution environments like ODPS SQL.":"提供强大的内核定制能力，支持 ODPS SQL 等执行环境",
+  "Support intelligent assistant AI dialogue functions.":"支持智能助手 AI 对话功能",
+  "Notebook as an App":"Notebook 即 App",
+  "Generate dynamic reports based on Notebooks combined with interactive controls.":"基于 Notebook 结合交互控件生成动态报告",
+  "Version Diff Capability":"版本 Diff 能力",
+  "Support cell-level version diff capability for better version management and code review.":"支持 Cell 级别的版本 Diff 能力，方便更好的进行版本管理、CR。",
+  "Superior code suggestion capabilities":"更优异的代码提示能力",
+  "Libro offers an exceptional editing experience, especially for Python code, providing superior code completion, code suggestions, code formatting, and go-to-definition features.":"Libro 拥有卓越的编辑体验，尤其针对 Python 代码，提供更优异的代码补全、代码提示、代码格式化和定义跳转等功能。",
+  "Enterprise-level scenario customization capabilities":"企业级场景定制能力",
+  "Exciting features and capabilities":"激动人心的功能特性",
+  "Who is using":"谁在使用"
+}

apps/docs/.dumi/theme/lang/index.ts

@@ -0,0 +1,9 @@
+import type { LanguageBundles } from '@difizen/mana-l10n';
+
+import langENUS from './bundle.l10n.en-US';
+import langZHCN from './bundle.l10n.zh-CN';
+
+export const langBundles: LanguageBundles = {
+  'zh-CN': langZHCN,
+  'en-US': langENUS,
+};

apps/docs/.dumi/theme/layouts/DocLayout.tsx

@@ -30,7 +30,7 @@ const DocLayout = () => {
 
   return (
     <ManaComponents.Application modules={[DumiPreset]} renderChildren>
-      {pathname === '/' ? (
+      {pathname === '/'||pathname === '/zh-CN'||pathname === '/zh-CN/' ? (
         <HomeLayout />
       ) : (
         <div className="difizen-dumi-layout">

apps/docs/.dumi/theme/modules/module.ts

@@ -1,5 +1,14 @@
 import { ManaAppPreset, ManaModule } from '@difizen/mana-app';
+import { l10n } from '@difizen/mana-l10n';
+
+import { langBundles } from '../lang/index';
 
 import { Github } from './github.js';
 
-export const DumiPreset = ManaModule.create().register(Github).dependOn(ManaAppPreset);
+export const DumiPreset = ManaModule.create()
+  .preload(() => {
+    l10n.loadLangBundles(langBundles);
+    return Promise.resolve();
+  })
+  .register(Github)
+  .dependOn(ManaAppPreset);

apps/docs/.dumi/theme/slots/Footer/index.tsx

@@ -1,3 +1,4 @@
+import { l10n } from '@difizen/mana-l10n';
 import { useSiteData, Link } from 'dumi';
 import React from 'react';
 import './index.less';
@@ -12,7 +13,49 @@ type DatumType = {
 
 const Footer: React.FC = () => {
   const { themeConfig } = useSiteData();
-  const qrcodes = themeConfig.qrcodes;
+  const links = [
+    {
+      title: l10n.t('Related'),
+      itemList: [
+        {
+          name: 'Difizen',
+          link: 'https://github.com/difizen',
+        },
+        {
+          name: 'Difizen｜libro',
+          link: 'https://github.com/difizen/libro',
+        },
+        {
+          name: 'Difizen｜mana',
+          link: 'https://github.com/difizen/mana',
+        },
+        {
+          name: 'Difizen｜magent',
+          link: 'https://github.com/difizen/magent',
+        },
+      ],
+    },
+    {
+      title: l10n.t('Community'),
+      itemList: [
+        {
+          name:  l10n.t('feedback issues'),
+          link: 'https://github.com/difizen/libro/issues',
+        },
+        {
+          name:  l10n.t('release notes'),
+          link: 'https://github.com/difizen/libro/releases',
+        },
+      ],
+    },
+  ]
+
+  const qrcodes = [
+    {
+      name: l10n.t('DingTalk'),
+      qrcode: '/ding-qrcode.png',
+    },
+  ];
 
   return (
     <div className="difizen-dumi-footer">
@@ -24,7 +67,7 @@ const Footer: React.FC = () => {
                 </Link>
               )}
             </div>
-            {(themeConfig['links'] || []).map((datum: DatumType) => (
+            {links.map((datum: DatumType) => (
                   <div className="difizen-dumi-footer-text-group" key={datum.title}>
                     <div className="difizen-dumi-footer-title">{datum.title}</div>
                     {datum.itemList.map((item) => (
@@ -37,7 +80,7 @@ const Footer: React.FC = () => {
                   </div>
             ))}
             <div className="difizen-dumi-footer-text-group">
-              <div className="difizen-dumi-footer-contact">联系我们</div>
+              <div className="difizen-dumi-footer-contact">{l10n.t('Contact Us')}</div>
               {qrcodes.map((item: { name: string; qrcode: string }) => (
                 <div className="difizen-dumi-footer-image-group" key={item.name}>
                   <img className="difizen-dumi-footer-img" src={item.qrcode} />