feat(ui): list plugins

web/src/app/home/plugins/plugin-installed/PluginInstalledComponent.tsx

@@ -43,15 +43,20 @@ const PluginInstalledComponent = forwardRef<PluginInstalledComponentRef>(
         setPluginList(
           value.plugins.map((plugin) => {
             return new PluginCardVO({
-              author: plugin.author,
-              description: i18nObj(plugin.description),
+              author: plugin.manifest.manifest.metadata.author ?? '',
+              description: i18nObj(
+                plugin.manifest.manifest.metadata.description ?? {
+                  en_US: '',
+                  zh_Hans: '',
+                },
+              ),
               enabled: plugin.enabled,
-              name: plugin.name,
-              version: plugin.version,
+              name: plugin.manifest.manifest.metadata.name,
+              version: plugin.manifest.manifest.metadata.version ?? '',
               status: plugin.status,
-              tools: plugin.tools,
-              event_handlers: plugin.event_handlers,
-              repository: plugin.repository,
+              tools: [],
+              event_handlers: {},
+              repository: plugin.manifest.manifest.metadata.repository ?? '',
               priority: plugin.priority,
             });
           }),

web/src/app/home/plugins/plugin-installed/plugin-form/PluginForm.tsx

@@ -1,5 +1,6 @@
 import { useState, useEffect } from 'react';
-import { ApiRespPluginConfig, Plugin } from '@/app/infra/entities/api';
+import { ApiRespPluginConfig } from '@/app/infra/entities/api';
+import { Plugin } from '@/app/infra/entities/plugin';
 import { httpClient } from '@/app/infra/http/HttpClient';
 import DynamicFormComponent from '@/app/home/components/dynamic-form/DynamicFormComponent';
 import { Button } from '@/components/ui/button';
@@ -183,13 +184,22 @@ export default function PluginForm({
       </Dialog>
 
       <div className="space-y-2">
-        <div className="text-lg font-medium">{pluginInfo.name}</div>
-        <div className="text-sm text-gray-500 pb-2">
-          {i18nObj(pluginInfo.description)}
+        <div className="text-lg font-medium">
+          {i18nObj(pluginInfo.manifest.manifest.metadata.label)}
         </div>
-        {pluginInfo.config_schema.length > 0 && (
+        <div className="text-sm text-gray-500 pb-2">
+          {i18nObj(
+            pluginInfo.manifest.manifest.metadata.description ?? {
+              en_US: '',
+              zh_Hans: '',
+            },
+          )}
+        </div>
+        {/* @ts-ignore */}
+        {pluginInfo.manifest.manifest.spec.config.length > 0 && (
           <DynamicFormComponent
-            itemConfigList={pluginInfo.config_schema}
+            // @ts-ignore
+            itemConfigList={pluginInfo.manifest.manifest.spec.config}
             initialValues={pluginConfig.config as Record<string, object>}
             onSubmit={(values) => {
               let config = pluginConfig.config;
@@ -203,7 +213,8 @@ export default function PluginForm({
             }}
           />
         )}
-        {pluginInfo.config_schema.length === 0 && (
+        {/* @ts-ignore */}
+        {pluginInfo.manifest.manifest.spec.config.length === 0 && (
           <div className="text-sm text-gray-500">
             {t('plugins.pluginNoConfig')}
           </div>

web/src/app/infra/entities/api/index.ts

@@ -2,6 +2,7 @@ import { IDynamicFormItemSchema } from '@/app/infra/entities/form/dynamic';
 import { PipelineConfigTab } from '@/app/infra/entities/pipeline';
 import { I18nLabel } from '@/app/infra/entities/common';
 import { Message } from '@/app/infra/entities/message';
+import { Plugin } from '@/app/infra/entities/plugin';
 
 export interface ApiResponse<T> {
   code: number;
@@ -119,22 +120,22 @@ export interface ApiRespPlugin {
   plugin: Plugin;
 }
 
-export interface Plugin {
-  author: string;
-  name: string;
-  description: I18nLabel;
-  label: I18nLabel;
-  version: string;
-  enabled: boolean;
-  priority: number;
-  status: string;
-  tools: object[];
-  event_handlers: object;
-  main_file: string;
-  pkg_path: string;
-  repository: string;
-  config_schema: IDynamicFormItemSchema[];
-}
+// export interface Plugin {
+//   author: string;
+//   name: string;
+//   description: I18nLabel;
+//   label: I18nLabel;
+//   version: string;
+//   enabled: boolean;
+//   priority: number;
+//   status: string;
+//   tools: object[];
+//   event_handlers: object;
+//   main_file: string;
+//   pkg_path: string;
+//   repository: string;
+//   config_schema: IDynamicFormItemSchema[];
+// }
 
 export interface ApiRespPluginConfig {
   config: object;

web/src/app/infra/entities/common.ts

@@ -3,3 +3,18 @@ export interface I18nLabel {
   zh_Hans: string;
   ja_JP?: string;
 }
+
+export interface ComponentManifest {
+  apiVersion: string;
+  kind: string;
+  metadata: {
+    name: string;
+    label: I18nLabel;
+    description?: I18nLabel;
+    icon?: string;
+    repository?: string;
+    version?: string;
+    author?: string;
+  };
+  spec: object;
+}

web/src/app/infra/entities/plugin/index.ts

@@ -0,0 +1,17 @@
+import { ComponentManifest } from '@/app/infra/entities/common';
+
+export interface Plugin {
+  status: 'intialized' | 'mounted' | 'unmounted';
+  priority: number;
+  plugin_config: object;
+  manifest: {
+    manifest: ComponentManifest;
+  };
+  enabled: boolean;
+  components: {
+    component_config: object;
+    manifest: {
+      manifest: ComponentManifest;
+    };
+  };
+}