fix: search panel disappear

website/.gitignore

@@ -18,5 +18,3 @@
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-
-test/Caddyfile

website/Dockerfile

@@ -4,4 +4,4 @@ COPY . /app
 WORKDIR /app
 RUN npm ci
 RUN npm run build
-CMD npm run serve -- --port 80 --host 0.0.0.0
+CMD npm run serve -- --port 80 --host 0.0.0.0

website/README.md

@@ -1,30 +1,41 @@
-# 雷池社区官网
+# Website
 
-使用 [Docusaurus 2](https://docusaurus.io/) 开发。包含两部分内容：页面和文档。
+This website is built using [Docusaurus 2](https://docusaurus.io/), a modern static website generator.
 
-- 页面，在 src 目录下，手写 js
-- 文档，在 docs 目录下，手写 markdown
-
-### 开发
-
-```sh
-# 开发
-npm start
-# 支持 搜索功能的预览
-npm run serve -- --build --host 0.0.0.0
-```
-
-接口代理
-
-```sh
-# 格式化配置文件
-caddy fmt test/Caddyfile --overwrite
-# 启动服务
-caddy run --config test/Caddyfile
-```
-
-### 部署
+### Installation
 
 ```
-docker build -t website .
+$ yarn
 ```
+
+### Local Development
+
+```
+$ yarn start
+```
+
+This command starts a local development server and opens up a browser window. Most changes are reflected live without having to restart the server.
+
+### Build
+
+```
+$ yarn build
+```
+
+This command generates static content into the `build` directory and can be served using any static contents hosting service.
+
+### Deployment
+
+Using SSH:
+
+```
+$ USE_SSH=true yarn deploy
+```
+
+Not using SSH:
+
+```
+$ GIT_USER=<Your GitHub username> yarn deploy
+```
+
+If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch.

website/blog/2023-08-04-website.md

@@ -0,0 +1,3 @@
+# Website
+
+为了支持文档检索，采用 https://docusaurus.io/ 作为新的网站框架。

website/docs/02-上手指南/01-guide_install.md

@@ -1,7 +1,5 @@
 ---
 title: "安装雷池"
-group: "上手指南"
-order: 2
 ---
 
 # 安装雷池

website/docs/02-上手指南/02-guide_login.md

@@ -1,7 +1,5 @@
 ---
 title: "登录雷池"
-group: "上手指南"
-order: 3
 ---
 
 # 登录雷池

website/docs/02-上手指南/03-guide_config.md

@@ -1,7 +1,5 @@
 ---
 title: "配置防护站点"
-group: "上手指南"
-order: 4
 ---
 
 # 配置防护站点

website/docs/02-上手指南/04-guide_test.md

@@ -1,7 +1,5 @@
 ---
 title: "测试防护效果"
-group: "上手指南"
-order: 5
 ---
 
 # 测试防护效果

website/docs/02-上手指南/05-guide_upgrade.md

@@ -1,7 +1,5 @@
 ---
 title: "升级雷池"
-group: "上手指南"
-order: 6
 ---
 
 # 升级雷池

website/docs/02-上手指南/_category_.json

@@ -0,0 +1,6 @@
+{
+  "label": "上手指南",
+  "link": {
+    "type": "generated-index"
+  }
+}

website/docs/03-关于雷池/01-about_syntaxanalysis.md

@@ -1,7 +1,5 @@
 ---
 title: "智能语义分析技术"
-group: "关于雷池"
-order: 2
 ---
 
 # 智能语义分析技术

website/docs/03-关于雷池/02-about_challenge.md

@@ -1,9 +1,5 @@
 ---
 title: "人机验证"
-group:
-   title: "关于雷池"
-   order: 3
-order: 3
 ---
 
 # 人机验证

website/docs/03-关于雷池/03-about_chaitin.md

@@ -1,7 +1,5 @@
 ---
 title: "关于我们"
-group: "关于雷池"
-order: 9
 ---
 
 # 关于我们

website/docs/03-关于雷池/04-about_changelog.md

@@ -1,7 +1,5 @@
 ---
 title: "版本更新记录"
-group: "关于雷池"
-order: 3
 ---
 
 # 版本更新记录

website/docs/03-关于雷池/_category_.json

@@ -0,0 +1,6 @@
+{
+    "label": "关于雷池",
+    "link": {
+        "type": "generated-index"
+    }
+}

website/docs/04-常见问题排查/01-faq_install.md

@@ -1,9 +1,5 @@
 ---
 title: "安装问题"
-group:
-    title: "常见问题排查"
-    order: 2
-order: 1
 ---
 # 安装问题
 

website/docs/04-常见问题排查/02-faq_login.md

@@ -1,7 +1,5 @@
 ---
 title: "登录问题"
-group: "常见问题排查"
-order: 2
 ---
 
 # 登录问题

website/docs/04-常见问题排查/03-faq_access.md

@@ -1,7 +1,5 @@
 ---
 title: "网站无法访问"
-group: "常见问题排查"
-order: 3
 ---
 
 # 网站无法访问

website/docs/04-常见问题排查/04-faq_config.md

@@ -1,7 +1,5 @@
 ---
 title: "配置问题"
-group: "常见问题排查"
-order: 10
 ---
 
 # 配置问题

website/docs/04-常见问题排查/05-faq_other.md

@@ -1,7 +1,5 @@
 ---
 title: "其他问题"
-group: "常见问题排查"
-order: 10
 ---
 
 # 其他问题

website/docs/04-常见问题排查/_category_.json

@@ -0,0 +1,6 @@
+{
+    "label": "常见问题排查",
+    "link": {
+        "type": "generated-index"
+    }
+}

website/docusaurus.config.js

@@ -9,9 +9,8 @@ const cnzz = `<script type="text/javascript" src="https://v1.cnzz.com/z_stat.php
 /** @type {import('@docusaurus/types').Config} */
 const config = {
   title: "长亭雷池 WAF 社区版",
-  tagline: "Dinosaurs are cool",
+  tagline: "",
   favicon: "images/favicon.ico",
-  plugins: [require.resolve("@cmfcmf/docusaurus-search-local")],
 
   // Set the production url of your site here
   url: "https://waf-ce.chaitin.cn/",
@@ -35,6 +34,24 @@ const config = {
     locales: ["zh-Hans"],
   },
 
+  themes: [
+    [
+      // @ts-ignore
+      require.resolve("@easyops-cn/docusaurus-search-local"),
+      /** @type {import("@easyops-cn/docusaurus-search-local").PluginOptions} */
+      // @ts-ignore
+      ({
+        // ... Your options.
+        // `hashed` is recommended as long-term-cache of index file is possible.
+        hashed: true,
+        // For Docs using Chinese, The `language` is recommended to set to:
+        // ```
+        language: ["en", "zh"],
+        // ```
+      }),
+    ],
+  ],
+
   presets: [
     [
       "classic",
@@ -59,24 +76,6 @@ const config = {
     ],
   ],
 
-  themes: [
-    [
-      // @ts-ignore
-      require.resolve("@easyops-cn/docusaurus-search-local"),
-      /** @type {import("@easyops-cn/docusaurus-search-local").PluginOptions} */
-      // @ts-ignore
-      ({
-        // ... Your options.
-        // `hashed` is recommended as long-term-cache of index file is possible.
-        hashed: true,
-        // For Docs using Chinese, The `language` is recommended to set to:
-        // ```
-        language: ["zh"],
-        // ```
-      }),
-    ],
-  ],
-
   themeConfig:
     /** @type {import('@docusaurus/preset-classic').ThemeConfig} */
     ({
@@ -86,11 +85,7 @@ const config = {
         title: "",
         logo: { alt: "Logo", src: "images/logo.png" },
         items: [
-          {
-            to: "/docs",
-            label: "技术文档",
-            position: "right",
-          },
+          { to: "/docs", label: "技术文档", position: "right" },
           { to: "/detection", label: "效果对比", position: "right" },
           {
             to: "https://www.bilibili.com/medialist/detail/ml2342694989",
@@ -109,6 +104,7 @@ const config = {
           },
         ],
       },
+
       footer: {
         style: "dark",
         links: [
@@ -121,7 +117,7 @@ const config = {
               },
               {
                 label: "长亭 B 站主页",
-                to: "https://space.bilibili.com/521870525",
+                href: "https://space.bilibili.com/521870525",
               },
             ],
           },
@@ -130,11 +126,11 @@ const config = {
             items: [
               {
                 label: "CT Stack 安全社区",
-                to: "https://stack.chaitin.cn/",
+                href: "https://stack.chaitin.cn/",
               },
               {
                 label: "长亭合作伙伴论坛",
-                to: "https://bbs.chaitin.cn/",
+                href: "https://bbs.chaitin.cn/",
               },
             ],
           },
@@ -143,7 +139,7 @@ const config = {
             items: [
               {
                 label: "长亭百川云平台",
-                to: "https://rivers.chaitin.cn/",
+                href: "https://rivers.chaitin.cn/",
               },
               {
                 label: "关于我们",
@@ -156,16 +152,13 @@ const config = {
             items: [
               {
                 label: "长亭 GitHub 主页",
-                to: "https://github.com/chaitin",
+                href: "https://github.com/chaitin",
               },
             ],
           },
         ],
-        copyright: `Copyright © ${new Date().getFullYear()} 
-        北京长亭未来科技有限公司京 ICP 备 19035216 号京公网安备 11010802020947 号
-        <div style="display: none">${
-          process.env.NODE_ENV === "production" ? cnzz : ""
-        }</div>`,
+        copyright: `Copyright © ${new Date().getFullYear()}
+        北京长亭未来科技有限公司京 ICP 备 19035216 号京公网安备 11010802020947 号`,
       },
       prism: {
         theme: lightCodeTheme,

website/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "homepage",
+  "name": "website",
   "version": "0.0.0",
   "private": true,
   "scripts": {
@@ -10,6 +10,7 @@
     "deploy": "docusaurus deploy",
     "clear": "docusaurus clear",
     "serve": "docusaurus serve",
+    "preview": "docusaurus clear; docusaurus build; docusaurus serve",
     "write-translations": "docusaurus write-translations",
     "write-heading-ids": "docusaurus write-heading-ids",
     "typecheck": "tsc"
@@ -17,26 +18,24 @@
   "dependencies": {
     "@docusaurus/core": "2.4.1",
     "@docusaurus/preset-classic": "2.4.1",
-    "@easyops-cn/docusaurus-search-local": "0.35.0",
+    "@easyops-cn/docusaurus-search-local": "^0.35.0",
     "@emotion/react": "11.11.1",
     "@emotion/styled": "11.11.0",
-    "@mdx-js/react": "1.6.22",
-    "@mui/icons-material": "5.14.1",
-    "@mui/lab": "5.0.0-alpha.137",
-    "@mui/material": "5.14.2",
-    "clsx": "2.0.0",
+    "@mdx-js/react": "^1.6.22",
+    "@mui/icons-material": "5.14.3",
+    "@mui/lab": "5.0.0-alpha.138",
+    "@mui/material": "5.14.3",
+    "clsx": "^1.2.1",
     "countup.js": "2.7.0",
-    "highlight.js": "11.8.0",
     "prism-react-renderer": "^1.3.5",
-    "react": "17.0.2",
-    "react-dom": "17.0.2",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
     "react-responsive-carousel": "3.2.23"
   },
   "devDependencies": {
-    "@cmfcmf/docusaurus-search-local": "1.1.0",
     "@docusaurus/module-type-aliases": "2.4.1",
-    "@tsconfig/docusaurus": "2.0.0",
-    "typescript": "5.1.6"
+    "@tsconfig/docusaurus": "^1.0.5",
+    "typescript": "^4.7.4"
   },
   "browserslist": {
     "production": [
@@ -51,6 +50,6 @@
     ]
   },
   "engines": {
-    "node": ">=18"
+    "node": ">=16.14"
   }
 }

website/src/api/index.ts

@@ -1,52 +1,54 @@
 export {
-  submitSampleSet,
-  getSampleSet,
-  getSampleSetResult,
-  getSampleDetail,
-  getSetupCount,
-};
-
-const BASE_API = "http://localhost:2023/api";
-
-function submitSampleSet(data: {
-  pocs: Array<{ content: string; tag: string }>;
-  record_it: boolean;
-}) {
-  return fetch(BASE_API + "/poc/list", {
-    method: "POST",
-    headers: { "Content-Type": "application/json" },
-    mode: "cors",
-    // credentials: "include",
-    body: JSON.stringify(data),
-  }).then((res) => res.json());
-}
-
-function getSampleSet(id: string) {
-  return fetch(BASE_API + "/poc/list?id=" + id).then((res) => res.json());
-}
-
-function getSampleDetail(id: string) {
-  return fetch(BASE_API + "/poc/detail?id=" + id).then((res) => res.json());
-}
-
-async function getSampleSetResult(id: string, timeout: number = 60) {
-  const startAt = new Date().getTime();
-  const isTimeout = () => new Date().getTime() - startAt > timeout * 1000;
-  const maxRetry = 20;
-
-  for (let i = 0; i < maxRetry; i++) {
-    const res = await fetch(BASE_API + "/poc/results?id=" + id).then((res) =>
-      res.json()
-    );
-    if (res.code == 0 && res.data.data) {
-      return { data: res.data.data, timeout: false };
-    }
-    if (isTimeout()) break;
-    await new Promise((r) => setTimeout(r, 2000));
+    submitSampleSet,
+    getSampleSet,
+    getSampleSetResult,
+    getSampleDetail,
+    getSetupCount,
+  };
+  
+  // http://localhost:2023
+  const BASE_API = "/api";
+  
+  function submitSampleSet(data: {
+    pocs: Array<{ content: string; tag: string }>;
+    record_it: boolean;
+  }) {
+    return fetch(BASE_API + "/poc/list", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      mode: "cors",
+      // credentials: "include",
+      body: JSON.stringify(data),
+    }).then((res) => res.json());
   }
-  return { data: [], timeout: true };
-}
-
-function getSetupCount() {
-  return fetch(BASE_API + "/count").then((res) => res.json());
-}
+  
+  function getSampleSet(id: string) {
+    return fetch(BASE_API + "/poc/list?id=" + id).then((res) => res.json());
+  }
+  
+  function getSampleDetail(id: string) {
+    return fetch(BASE_API + "/poc/detail?id=" + id).then((res) => res.json());
+  }
+  
+  async function getSampleSetResult(id: string, timeout: number = 60) {
+    const startAt = new Date().getTime();
+    const isTimeout = () => new Date().getTime() - startAt > timeout * 1000;
+    const maxRetry = 20;
+  
+    for (let i = 0; i < maxRetry; i++) {
+      const res = await fetch(BASE_API + "/poc/results?id=" + id).then((res) =>
+        res.json()
+      );
+      if (res.code == 0 && res.data.data) {
+        return { data: res.data.data, timeout: false };
+      }
+      if (isTimeout()) break;
+      await new Promise((r) => setTimeout(r, 2000));
+    }
+    return { data: [], timeout: true };
+  }
+  
+  function getSetupCount() {
+    return fetch(BASE_API + "/count").then((res) => res.json());
+  }
+  

website/src/components/Version/FunctionTable.tsx

@@ -186,8 +186,8 @@ const FunctionTable = () => {
           }}
           style={{ marginTop: "48px" }}
         >
-          <TableHead>
-            <TableRow>
+          <TableHead sx={{ background: "transparent" }}>
+            <TableRow sx={{ border: "0" }}>
               <TableCell sx={{ width: "33%" }} />
               <TableCell align="center" sx={{ width: "33%", fontSize: "16px" }}>
                 <Box

website/src/components/detection/SampleList.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { useState } from "react";
-import hljs from "highlight.js";
+// import hljs from "highlight.js";
 
 import {
   Box,
@@ -48,10 +48,11 @@ function SampleList({ value, onSetIdChange }: SampleListProps) {
     }
     const text = document.createElement("textarea");
     text.innerHTML = res.data.content;
-    const highlighted = hljs.highlight(text.value, {
-      language: "http",
-    });
-    setDetail(highlighted.value);
+    // const highlighted = hljs.highlight(text.value, {
+    //   language: "http",
+    // });
+    // setDetail(highlighted.value);
+    setDetail(text.value)
     setOpen(true);
   };
 

website/src/components/detection/SampleSteps.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from "react";
-import hljs from "highlight.js";
+// import hljs from "highlight.js";
 import {
   Box,
   Button,
@@ -181,8 +181,9 @@ function SampleMarkable({
   });
 
   useEffect(() => {
-    const highlighted = hljs.highlight(sampleDetail, { language: "http" });
-    setCode(highlighted.value);
+    // const highlighted = hljs.highlight(sampleDetail, { language: "http" });
+    // setCode(highlighted.value);
+    setCode(sampleDetail)
   }, [sampleDetail]);
 
   const handle = () => {

website/src/css/custom.css

@@ -12,25 +12,19 @@ a:hover {
   text-decoration: none;
 }
 
-.navbar.navbar--fixed-top {
-  background-color: #0f1935;
-}
-
 /* You can override the default Infima variables here. */
 :root {
   --ifm-color-primary: #0fc6c2;
-  /* --ifm-color-primary-dark: #29784c;
-  --ifm-color-primary-darker: #277148;
-  --ifm-color-primary-darkest: #205d3b;
-  --ifm-color-primary-light: #33925d;
-  --ifm-color-primary-lighter: #359962;
-  --ifm-color-primary-lightest: #3cad6e; */
   --ifm-breadcrumb-color-active: #0fc6c2;
   --ifm-menu-color-active: #0fc6c2;
   --ifm-link-hover-color: #0fc6c2;
   --ifm-footer-link-hover-color: #0fc6c2;
   --ifm-navbar-link-hover-color: #0fc6c2;
+  --ifm-navbar-background-color: #0f1935;
   --ifm-navbar-link-color: white;
-  --ifm-code-font-size: 95%;
-  --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
+}
+
+/* Overriding root Infima variables */
+[data-theme="dark"] {
+  --ifm-navbar-background-color: #0f1935;
 }

website/src/theme/Footer/Copyright/index.js

@@ -0,0 +1,20 @@
+import React from "react";
+export default function FooterCopyright({ copyright }) {
+  return (
+    <>
+      <div
+        className="footer__copyright"
+        // Developer provided the HTML, so assume it's safe.
+        // eslint-disable-next-line react/no-danger
+        dangerouslySetInnerHTML={{ __html: copyright }}
+      />
+      {/* 自定义组件的目的是为了插入 cnzz 统计代码 */}
+      {process.env.NODE_ENV == "production" && (
+        <script
+          type="text/javascript"
+          src="https://v1.cnzz.com/z_stat.php?id=1281262430&web_id=1281262430"
+        />
+      )}
+    </>
+  );
+}

website/static/highlight/styles/a11y-light.min.css

@@ -1,7 +0,0 @@
-pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
-  Theme: a11y-light
-  Author: @ericwbailey
-  Maintainer: @ericwbailey
-
-  Based on the Tomorrow Night Eighties theme: https://github.com/isagalaev/highlight.js/blob/master/src/styles/tomorrow-night-eighties.css
-*/.hljs{background:#fefefe;color:#545454}.hljs-comment,.hljs-quote{color:#696969}.hljs-deletion,.hljs-name,.hljs-regexp,.hljs-selector-class,.hljs-selector-id,.hljs-tag,.hljs-template-variable,.hljs-variable{color:#d91e18}.hljs-attribute,.hljs-built_in,.hljs-link,.hljs-literal,.hljs-meta,.hljs-number,.hljs-params,.hljs-type{color:#aa5d00}.hljs-addition,.hljs-bullet,.hljs-string,.hljs-symbol{color:green}.hljs-section,.hljs-title{color:#007faa}.hljs-keyword,.hljs-selector-tag{color:#7928a1}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}@media screen and (-ms-high-contrast:active){.hljs-addition,.hljs-attribute,.hljs-built_in,.hljs-bullet,.hljs-comment,.hljs-link,.hljs-literal,.hljs-meta,.hljs-number,.hljs-params,.hljs-quote,.hljs-string,.hljs-symbol,.hljs-type{color:highlight}.hljs-keyword,.hljs-selector-tag{font-weight:700}}