perf: add helpLink for each page

web/src/app/home/components/home-sidebar/HomeSidebarChild.tsx

@@ -6,6 +6,7 @@ export interface ISidebarChildVO {
   name: string;
   route: string;
   description: string;
+  helpLink: string;
 }
 
 export class SidebarChildVO {
@@ -14,6 +15,7 @@ export class SidebarChildVO {
   name: string;
   route: string;
   description: string;
+  helpLink: string;
 
   constructor(props: ISidebarChildVO) {
     this.id = props.id;
@@ -21,6 +23,7 @@ export class SidebarChildVO {
     this.name = props.name;
     this.route = props.route;
     this.description = props.description;
+    this.helpLink = props.helpLink;
   }
 }
 

web/src/app/home/components/home-sidebar/sidbarConfigList.tsx

@@ -17,6 +17,7 @@ export const sidebarConfigList = [
     ),
     route: '/home/bots',
     description: '创建和管理机器人，这是 LangBot 与各个平台连接的入口',
+    helpLink: 'https://docs.langbot.app/deploy/platforms/readme.html',
   }),
   new SidebarChildVO({
     id: 'models',
@@ -33,6 +34,7 @@ export const sidebarConfigList = [
     ),
     route: '/home/models',
     description: '配置和管理可在流水线中使用的模型',
+    helpLink: 'https://docs.langbot.app/deploy/models/readme.html',
   }),
   new SidebarChildVO({
     id: 'pipelines',
@@ -49,6 +51,7 @@ export const sidebarConfigList = [
     ),
     route: '/home/pipelines',
     description: '流水线定义了对消息事件的处理流程，用于绑定到机器人',
+    helpLink: 'https://docs.langbot.app/deploy/pipelines/readme.html',
   }),
   new SidebarChildVO({
     id: 'plugins',
@@ -65,5 +68,6 @@ export const sidebarConfigList = [
     ),
     route: '/home/plugins',
     description: '安装和配置用于扩展 LangBot 功能的插件',
+    helpLink: 'https://docs.langbot.app/plugin/plugin-intro.html',
   }),
 ];

web/src/app/home/components/home-titlebar/HomeTitleBar.tsx

@@ -3,14 +3,30 @@ import styles from './HomeTittleBar.module.css';
 export default function HomeTitleBar({
   title,
   subtitle,
+  helpLink,
 }: {
   title: string;
   subtitle: string;
+  helpLink: string;
 }) {
   return (
     <div className={`${styles.titleBarContainer}`}>
       <div className={`${styles.titleText}`}>{title}</div>
-      <div className={`${styles.subtitleText}`}>{subtitle}</div>
+      <div className={`${styles.subtitleText}`}>
+        {subtitle}
+        <span className={`${styles.helpLink}`}>
+          <a href={helpLink} target="_blank" rel="noopener noreferrer">
+            <svg
+              className="w-[1rem] h-[1rem]"
+              xmlns="http://www.w3.org/2000/svg"
+              viewBox="0 0 24 24"
+              fill="currentColor"
+            >
+              <path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 15H13V17H11V15ZM13 13.3551V14H11V12.5C11 11.9477 11.4477 11.5 12 11.5C12.8284 11.5 13.5 10.8284 13.5 10C13.5 9.17157 12.8284 8.5 12 8.5C11.2723 8.5 10.6656 9.01823 10.5288 9.70577L8.56731 9.31346C8.88637 7.70919 10.302 6.5 12 6.5C13.933 6.5 15.5 8.067 15.5 10C15.5 11.5855 14.4457 12.9248 13 13.3551Z"></path>
+            </svg>
+          </a>
+        </span>
+      </div>
     </div>
   );
 }

web/src/app/home/components/home-titlebar/HomeTittleBar.module.css

@@ -1,6 +1,6 @@
 .titleBarContainer {
   width: 100%;
-  padding-top: 0.8rem;
+  padding-top: 1rem;
   height: 4rem;
   opacity: 1;
   font-size: 20px;
@@ -21,4 +21,12 @@
   margin-left: 3.2rem;
   font-size: 0.8rem;
   color: #808080;
+  display: flex;
+  align-items: center;
+}
+
+.helpLink {
+  margin-left: 0.2rem;
+  font-size: 0.8rem;
+  color: #8b8b8b;
 }