v4.6.2-alpah (#511)

projects/app/src/pages/plugin/edit/Header.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback } from 'react';
+import React from 'react';
 import { Box, Flex, IconButton, useTheme, useDisclosure } from '@chakra-ui/react';
 import { PluginItemSchema } from '@fastgpt/global/core/plugin/type';
 import { useRequest } from '@/web/common/hooks/useRequest';
@@ -42,12 +42,21 @@ const Header = ({ plugin, onClose }: Props) => {
             return Promise.reject(t('module.Plugin input must connect'));
           }
         }
-
-        if (item.inputs.find((input) => input.required && !input.connected)) {
-          return Promise.reject(`【${item.name}】存在未连接的必填输入`);
+        if (
+          item.flowType === FlowNodeTypeEnum.pluginOutput &&
+          item.inputs.find((input) => !input.connected)
+        ) {
+          return Promise.reject(t('core.module.Plugin output must connect'));
         }
-        if (item.inputs.find((input) => input.valueCheck && !input.valueCheck(input.value))) {
-          return Promise.reject(`【${item.name}】存在为填写的必填项`);
+
+        if (
+          item.inputs.find((input) => {
+            if (!input.required || input.connected) return false;
+            if (!input.value || input.value === '' || input.value?.length === 0) return true;
+            return false;
+          })
+        ) {
+          return Promise.reject(`【${item.name}】存在未填或未连接参数`);
         }
       }
 

projects/app/src/pages/plugin/edit/Preview.tsx

@@ -3,7 +3,7 @@ import ReactFlow, { Background, ReactFlowProvider, useNodesState } from 'reactfl
 import { FlowModuleItemType, ModuleItemType } from '@fastgpt/global/core/module/type';
 import { FlowNodeTypeEnum } from '@fastgpt/global/core/module/node/constant';
 import dynamic from 'next/dynamic';
-import { formatPluginIOModules } from '@fastgpt/global/core/module/utils';
+import { formatPluginToPreviewModule } from '@fastgpt/global/core/module/utils';
 import MyModal from '@/components/MyModal';
 import { Box } from '@chakra-ui/react';
 import { useTranslation } from 'next-i18next';
@@ -12,7 +12,7 @@ import { appModule2FlowNode } from '@/utils/adapt';
 
 const nodeTypes = {
   [FlowNodeTypeEnum.pluginModule]: dynamic(
-    () => import('@/components/core/module/Flow/components/nodes/NodePreviewPlugin')
+    () => import('@/components/core/module/Flow/components/nodes/NodeSimple')
   )
 };
 
@@ -36,16 +36,21 @@ const PreviewPlugin = ({
           flowType: FlowNodeTypeEnum.pluginModule,
           logo: plugin.avatar,
           name: plugin.name,
-          description: plugin.intro,
           intro: plugin.intro,
-          ...formatPluginIOModules(plugin._id, modules)
+          ...formatPluginToPreviewModule(plugin._id, modules)
         }
       })
     ]);
   }, [modules, plugin, setNodes]);
 
   return (
-    <MyModal isOpen title={t('module.Preview Plugin')} onClose={onClose} isCentered>
+    <MyModal
+      isOpen
+      title={t('module.Preview Plugin')}
+      iconSrc="/imgs/modal/preview.svg"
+      onClose={onClose}
+      isCentered
+    >
       <Box h={'400px'} w={'400px'}>
         <ReactFlowProvider>
           <ReactFlow

projects/app/src/pages/plugin/edit/index.tsx

@@ -3,12 +3,12 @@ import { useRouter } from 'next/router';
 import Header from './Header';
 import Flow from '@/components/core/module/Flow';
 import FlowProvider, { useFlowProviderStore } from '@/components/core/module/Flow/FlowProvider';
-import { SystemModuleTemplateType } from '@fastgpt/global/core/module/type.d';
-import { PluginModuleTemplates } from '@/constants/flow/ModuleTemplate';
+import { FlowModuleTemplateType } from '@fastgpt/global/core/module/type.d';
+import { pluginSystemModuleTemplates } from '@/web/core/modules/template/system';
 import { FlowNodeTypeEnum } from '@fastgpt/global/core/module/node/constant';
 import { serviceSideProps } from '@/web/common/utils/i18n';
 import { useQuery } from '@tanstack/react-query';
-import { getOnePlugin, getUserPlugs2ModuleTemplates } from '@/web/core/plugin/api';
+import { getOnePlugin } from '@/web/core/plugin/api';
 import { useToast } from '@/web/common/hooks/useToast';
 import Loading from '@/components/Loading';
 import { getErrText } from '@fastgpt/global/common/error/utils';
@@ -22,11 +22,11 @@ const Render = ({ pluginId }: Props) => {
   const router = useRouter();
   const { toast } = useToast();
   const { nodes = [] } = useFlowProviderStore();
-  const { pluginModuleTemplates, loadPluginModuleTemplates } = usePluginStore();
+  const { pluginModuleTemplates, loadPluginTemplates } = usePluginStore();
 
   const filterTemplates = useMemo(() => {
-    const copyTemplates: SystemModuleTemplateType = JSON.parse(
-      JSON.stringify(PluginModuleTemplates)
+    const copyTemplates: FlowModuleTemplateType[] = JSON.parse(
+      JSON.stringify(pluginSystemModuleTemplates)
     );
     const filterType: Record<string, 1> = {
       [FlowNodeTypeEnum.userGuide]: 1,
@@ -37,12 +37,10 @@ const Render = ({ pluginId }: Props) => {
     // filter some template
     nodes.forEach((node) => {
       if (node.type && filterType[node.type]) {
-        copyTemplates.forEach((item) => {
-          item.list.forEach((module, index) => {
-            if (module.flowType === node.type) {
-              item.list.splice(index, 1);
-            }
-          });
+        copyTemplates.forEach((module, index) => {
+          if (module.flowType === node.type) {
+            copyTemplates.splice(index, 1);
+          }
         });
       }
     });
@@ -60,16 +58,15 @@ const Render = ({ pluginId }: Props) => {
     }
   });
 
-  useQuery(['getUserPlugs2ModuleTemplates'], () => loadPluginModuleTemplates());
-  const filterPlugins = useMemo(
-    () => pluginModuleTemplates.filter((item) => item.id !== pluginId),
-    [pluginId, pluginModuleTemplates]
-  );
+  useQuery(['getPlugTemplates'], () => loadPluginTemplates());
+  const filterPlugins = useMemo(() => {
+    return pluginModuleTemplates.filter((item) => item.id !== pluginId);
+  }, [pluginId, pluginModuleTemplates]);
 
   return data ? (
     <Flow
       systemTemplates={filterTemplates}
-      pluginTemplates={[{ label: '', list: filterPlugins }]}
+      pluginTemplates={filterPlugins}
       modules={data?.modules || []}
       Header={<Header plugin={data} onClose={() => router.back()} />}
     />
@@ -80,7 +77,7 @@ const Render = ({ pluginId }: Props) => {
 
 export default function AdEdit(props: any) {
   return (
-    <FlowProvider filterAppIds={[]}>
+    <FlowProvider mode={'plugin'} filterAppIds={[]}>
       <Render {...props} />
     </FlowProvider>
   );

projects/app/src/pages/plugin/list/component/EditModal.tsx

@@ -134,10 +134,13 @@ const CreateModal = ({
   }, [defaultValue.id, onClose, toast, t, onDelete]);
 
   return (
-    <MyModal isOpen onClose={onClose} isCentered={!isPc}>
-      <ModalHeader fontSize={'2xl'}>
-        {defaultValue.id ? t('plugin.Update Your Plugin') : t('plugin.Create Your Plugin')}
-      </ModalHeader>
+    <MyModal
+      isOpen
+      onClose={onClose}
+      iconSrc="/imgs/modal/edit.svg"
+      title={defaultValue.id ? t('plugin.Update Your Plugin') : t('plugin.Create Your Plugin')}
+      isCentered={!isPc}
+    >
       <ModalBody>
         <Box color={'myGray.800'} fontWeight={'bold'}>
           {t('plugin.Set Name')}