feat: regCustomPanel add useIsShow props to hide icon

client/web/src/plugin/common/reg.ts

@@ -55,6 +55,16 @@ export interface PluginCustomPanel {
    * 渲染组件
    */
   render: React.ComponentType;
+
+  /**
+   * hooks determine navbar icon whether to render
+   *
+   * Only available in position: `navbar-more` | `navbar-group` | `navbar-personal`
+   *
+   * @default
+   * () => true
+   */
+  useIsShow?: () => boolean;
 }
 export const [pluginCustomPanel, regCustomPanel] =
   buildRegList<PluginCustomPanel>();

client/web/src/routes/Main/Navbar/CustomNavItem.tsx

@@ -1,9 +1,11 @@
 import type { PluginCustomPanel } from '@/plugin/common';
 import clsx from 'clsx';
-import React from 'react';
+import React, { useMemo } from 'react';
 import { Icon } from 'tailchat-design';
 import { NavbarNavItem } from './NavItem';
 
+const defaultUseIsShow = () => true;
+
 /**
  * 导航栏自定义选项
  * 用于插件
@@ -12,6 +14,14 @@ export const NavbarCustomNavItem: React.FC<{
   panelInfo: PluginCustomPanel;
   withBg: boolean;
 }> = React.memo(({ panelInfo, withBg }) => {
+  const useIsShow = useMemo(() => panelInfo.useIsShow ?? defaultUseIsShow, []);
+
+  const isShow = useIsShow();
+
+  if (!isShow) {
+    return null;
+  }
+
   return (
     <NavbarNavItem
       key={panelInfo.name}

client/web/src/routes/Main/Navbar/NavItem.tsx

@@ -23,7 +23,9 @@ export const NavbarNavItem: React.FC<
 
   let inner = (
     <Tooltip
-      title={<div className="font-bold px-1.5 py-0.5">{name}</div>}
+      title={
+        name ? <div className="font-bold px-1.5 py-0.5">{name}</div> : null
+      }
       placement="right"
     >
       <div

client/web/tailchat.d.ts

@@ -232,10 +232,19 @@ declare module '@capital/common' {
       | 'navbar-more'
       | 'navbar-group'
       | 'navbar-personal';
-    icon: string;
+    icon: string | React.ComponentType;
     name: string;
     label: string;
     render: React.ComponentType;
+    /**
+     * hooks determine whether to render
+     *
+     * Only available in position: `navbar-more` | `navbar-group` | `navbar-personal`
+     *
+     * @default
+     * () => true
+     */
+    useIsShow?: () => boolean;
   }) => void;
 
   export const pluginGroupPanel: any;

server/plugins/com.msgbyte.livekit/web/plugins/com.msgbyte.livekit/types/tailchat.d.ts

@@ -225,6 +225,13 @@ declare module '@capital/common' {
     name: string;
     label: string;
     render: React.ComponentType;
+    /**
+     * hooks determine whether to render
+     *
+     * @default
+     * () => true
+     */
+    useIsShow?: () => boolean;
   }) => void;
 
   export const pluginGroupPanel: any;