From 41cdfb071514fd062faf2185820042c47a31a236 Mon Sep 17 00:00:00 2001
From: moonrailgun <moonrailgun@gmail.com>
Date: Fri, 19 May 2023 01:19:38 +0800
Subject: [PATCH] feat: add regPluginGroupConfigItem

---
 client/shared/model/group.ts                  |  2 +-
 .../components/modals/GroupDetail/Config.tsx  | 26 ++++++++++++++-----
 client/web/src/plugin/common/reg.ts           | 12 +++++++++
 client/web/src/utils/plugin-helper.ts         |  8 ++++++
 4 files changed, 40 insertions(+), 8 deletions(-)

diff --git a/client/shared/model/group.ts b/client/shared/model/group.ts
index 98524496..ac33669b 100644
--- a/client/shared/model/group.ts
+++ b/client/shared/model/group.ts
@@ -11,7 +11,7 @@ export const groupConfigNames = [
   'hideGroupMemberDiscriminator',
 ] as const;
 
-export type GroupConfigNames = (typeof groupConfigNames)[number];
+export type GroupConfigNames = (typeof groupConfigNames)[number] | string; // string is plugin config
 
 export interface GroupMember {
   roles: string[]; // 角色组
diff --git a/client/web/src/components/modals/GroupDetail/Config.tsx b/client/web/src/components/modals/GroupDetail/Config.tsx
index d4b5d08b..4555deb1 100644
--- a/client/web/src/components/modals/GroupDetail/Config.tsx
+++ b/client/web/src/components/modals/GroupDetail/Config.tsx
@@ -1,15 +1,11 @@
 import React from 'react';
-import {
-  model,
-  showSuccessToasts,
-  t,
-  useAsyncRequest,
-  useGroupInfo,
-} from 'tailchat-shared';
+import { model, t, useAsyncRequest, useGroupInfo } from 'tailchat-shared';
 import { Loading } from '@/components/Loading';
 import { FullModalField } from '@/components/FullModal/Field';
 import { FullModalCommonTitle } from '@/components/FullModal/CommonTitle';
 import { Switch } from 'antd';
+import { pluginGroupConfigItems } from '@/plugin/common';
+import { ensurePluginNamePrefix } from '@/utils/plugin-helper';
 
 export const GroupConfig: React.FC<{
   groupId: string;
@@ -47,6 +43,22 @@ export const GroupConfig: React.FC<{
           />
         }
       />
+
+      {pluginGroupConfigItems.map((item) => {
+        const name = ensurePluginNamePrefix(item.name);
+        return (
+          <FullModalField
+            key={name}
+            title={item.title}
+            tip={item.tip}
+            content={item.render({
+              value: config[name],
+              onChange: (val: any) => handleModifyConfig(name, val),
+              loading,
+            })}
+          />
+        );
+      })}
     </div>
   );
 });
diff --git a/client/web/src/plugin/common/reg.ts b/client/web/src/plugin/common/reg.ts
index 43e6f4d6..15ecc379 100644
--- a/client/web/src/plugin/common/reg.ts
+++ b/client/web/src/plugin/common/reg.ts
@@ -12,6 +12,7 @@ import {
 } from 'tailchat-shared';
 import type { MetaFormFieldMeta } from 'tailchat-design';
 import type { FullModalFactoryConfig } from '@/components/FullModal/Factory';
+import type { ReactElement } from 'react';
 
 /**
  * 注册自定义面板
@@ -301,3 +302,14 @@ interface PluginInboxItem {
  */
 export const [pluginInboxItemMap, regPluginInboxItemMap] =
   buildRegMap<PluginInboxItem>();
+
+export const [pluginGroupConfigItems, regPluginGroupConfigItem] = buildRegList<{
+  name: string;
+  title: string;
+  tip?: string;
+  render: (props: {
+    value: any;
+    onChange: (val: unknown) => void;
+    loading: boolean;
+  }) => ReactElement;
+}>();
diff --git a/client/web/src/utils/plugin-helper.ts b/client/web/src/utils/plugin-helper.ts
index 4619a4df..deeafc50 100644
--- a/client/web/src/utils/plugin-helper.ts
+++ b/client/web/src/utils/plugin-helper.ts
@@ -9,3 +9,11 @@ export function findPluginPanelInfoByName(
 ): PluginGroupPanel | undefined {
   return pluginGroupPanel.find((p) => p.name === pluginPanelName);
 }
+
+export function ensurePluginNamePrefix(name: string): string {
+  if (typeof name !== 'string') {
+    throw new Error('Plugin Name must be string');
+  }
+
+  return name.startsWith('plugin:') ? name : `plugin:${name}`;
+}