feat: Chinese document search

docusaurus/src/constants/index.ts

@@ -0,0 +1,91 @@
+import { DocSearchTranslations } from "@docsearch/react";
+
+const EN_TRANSLATIONS: DocSearchTranslations = {
+  button: {
+    buttonText: "Search",
+    buttonAriaLabel: "Search",
+  },
+  modal: {
+    searchBox: {
+      resetButtonTitle: "Clear the query",
+      resetButtonAriaLabel: "Clear the query",
+      cancelButtonText: "Cancel",
+      cancelButtonAriaLabel: "Cancel",
+      searchInputLabel: "Search",
+    },
+    startScreen: {
+      recentSearchesTitle: "Recent",
+      noRecentSearchesText: "No recent searches",
+      saveRecentSearchButtonTitle: "Save this search",
+      removeRecentSearchButtonTitle: "Remove this search from history",
+      favoriteSearchesTitle: "Favorite",
+      removeFavoriteSearchButtonTitle: "Remove this search from favorites",
+    },
+    errorScreen: {
+      titleText: "Unable to fetch results",
+      helpText: "You might want to check your network connection.",
+    },
+    footer: {
+      selectText: "to select",
+      selectKeyAriaLabel: "Enter key",
+      navigateText: "to navigate",
+      navigateUpKeyAriaLabel: "Arrow up",
+      navigateDownKeyAriaLabel: "Arrow down",
+      closeText: "to close",
+      closeKeyAriaLabel: "Escape key",
+      searchByText: "Search by",
+    },
+    noResultsScreen: {
+      noResultsText: "No results for",
+      suggestedQueryText: "Try searching for",
+      reportMissingResultsText: "Believe this query should return results?",
+      reportMissingResultsLinkText: "Let us know.",
+    },
+  },
+};
+
+const ZH_TRANSLATIONS: DocSearchTranslations = {
+  button: {
+    buttonText: "搜索",
+    buttonAriaLabel: "搜索",
+  },
+  modal: {
+    searchBox: {
+      resetButtonTitle: "盒子",
+      resetButtonAriaLabel: "清除查询",
+      cancelButtonText: "取消",
+      cancelButtonAriaLabel: "取消",
+      searchInputLabel: "搜索文档",
+    },
+    startScreen: {
+      recentSearchesTitle: "最近的",
+      noRecentSearchesText: "没有最近搜索记录",
+      saveRecentSearchButtonTitle: "保存此搜索",
+      removeRecentSearchButtonTitle: "从历史记录中删除此搜索",
+      favoriteSearchesTitle: "最喜欢的",
+      removeFavoriteSearchButtonTitle: "从收藏夹中删除此搜索",
+    },
+    errorScreen: {
+      titleText: "无法获取结果",
+      helpText: "您可能想检查您的网络连接.",
+    },
+    footer: {
+      selectText: "选择",
+      selectKeyAriaLabel: "输入键",
+      navigateText: "导航",
+      navigateUpKeyAriaLabel: "向上箭头",
+      navigateDownKeyAriaLabel: "向下箭头",
+      closeText: "关闭",
+      closeKeyAriaLabel: "退出键",
+      searchByText: "搜索提供",
+    },
+    noResultsScreen: {
+      noResultsText: "未搜索到",
+      suggestedQueryText: "尝试搜索",
+      reportMissingResultsText: "相信这个查询应该返回结果?",
+      reportMissingResultsLinkText: "让我们知道.",
+    },
+  },
+};
+
+export { EN_TRANSLATIONS, ZH_TRANSLATIONS };

docusaurus/src/theme/DocSidebar/index.tsx

@@ -4,8 +4,9 @@ import type DocSidebarType from "@theme/DocSidebar";
 import type { WrapperProps } from "@docusaurus/types";
 import { useLocation, useHistory } from "react-router-dom";
 import Select from "antd/lib/select/index";
-import { DocSearch } from '@docsearch/react';
-import Link from '@docusaurus/Link';
+import { DocSearch } from "@docsearch/react";
+import Link from "@docusaurus/Link";
+import { EN_TRANSLATIONS, ZH_TRANSLATIONS } from "@site/src/constants";
 
 type Props = WrapperProps<typeof DocSidebarType>;
 
@@ -48,12 +49,15 @@ export default function DocSidebarWrapper(props: Props): JSX.Element {
   };
 
   const formatDocSearchVersion = (tag: string) => {
-    return tag.replace(/docs-(\d+\.\d+\.\d+)|docs-latest_zh/g, (match, version) => {
-      if (match.includes('latest_zh')) {
-        return 'docs-default';
+    return tag.replace(
+      /docs-(\d+\.\d+\.\d+)|docs-latest_zh/g,
+      (match, version) => {
+        if (match.includes("latest_zh")) {
+          return "docs-default";
+        }
+        return `docs-${version.replace(/\./g, "-")}`;
       }
-      return `docs-${version.replace(/\./g, '-')}`;
-    });
+    );
   };
 
   const onVersionChange = (version) => {
@@ -75,14 +79,14 @@ export default function DocSidebarWrapper(props: Props): JSX.Element {
   };
 
   const navigator = useRef({
-    navigate({itemUrl}: {itemUrl?: string}) {
+    navigate({ itemUrl }: { itemUrl?: string }) {
       history.push(itemUrl!);
     },
   }).current;
 
   const Hit: React.FC = ({ hit, children }) => {
     return <Link to={hit.url}>{children}</Link>;
-  }
+  };
 
   useEffect(() => {
     window.addEventListener("click", () => {
@@ -96,6 +100,20 @@ export default function DocSidebarWrapper(props: Props): JSX.Element {
     });
   }, []);
 
+  const getTranslationsByLanguage = (lang: string) => {
+    if (lang === "zh") {
+      return ZH_TRANSLATIONS;
+    }
+    return EN_TRANSLATIONS;
+  };
+
+  const getPlaceholderByLanguage = (lang: string) => {
+    if (lang === "zh") {
+      return "搜索文档";
+    }
+    return "Search docs";
+  };
+
   return (
     <div
       style={{
@@ -104,7 +122,7 @@ export default function DocSidebarWrapper(props: Props): JSX.Element {
         flexDirection: "column",
       }}
     >
-      <div style={{display: 'flex', alignItems: 'center'}}>
+      <div style={{ display: "flex", alignItems: "center" }}>
         <Select
           defaultValue={getCurrentVersion()}
           style={{ width: 120, margin: "10px 4px 8px 8px" }}
@@ -118,18 +136,25 @@ export default function DocSidebarWrapper(props: Props): JSX.Element {
               indexName: "zhongyunwanio",
               appId: "DGYVABHR0M",
               searchParameters: {
-                facetFilters: [formatDocSearchVersion(`docusaurus_tag:docs-${getCurrentVersion()}_${getCurrentLanguage()}-current`)],
+                facetFilters: [
+                  formatDocSearchVersion(
+                    `docusaurus_tag:docs-${getCurrentVersion()}_${getCurrentLanguage()}-current`
+                  ),
+                ],
               },
               hitComponent: Hit,
               transformItems: (items) => {
-                return items.map(item => {
+                return items.map((item) => {
                   return {
                     ...item,
-                    url: '/tugraph-db' + item?.url?.split('/tugraph-db')[1] ?? ''
+                    url:
+                      "/tugraph-db" + item?.url?.split("/tugraph-db")[1] ?? "",
                   };
-                })
+                });
               },
-              navigator: navigator
+              navigator: navigator,
+              translations: getTranslationsByLanguage(getCurrentLanguage()),
+              placeholder: getPlaceholderByLanguage(getCurrentLanguage()),
             }}
           />
         </div>