Support simpleApp select workflow (#2772)

* fix: share page id error

* feat: simple workflow support childApp tool

* perf: aichat box animation

docSite/content/zh-cn/docs/development/upgrading/4811.md

@@ -92,7 +92,7 @@ weight: 813
 6. 新增 - 支持 Openai o1 模型，需增加模型的 `defaultConfig` 配置，覆盖 `temperature`、`max_tokens` 和 `stream`配置，o1 不支持 stream 模式, 详细可重新拉取 `config.json` 配置文件查看。
 7. 新增 - AI 对话节点知识库引用，支持配置 role=system 和 role=user，已配置的过自定义提示词的节点将会保持 user 模式，其余用户将转成 system 模式。
 8. 新增 - 插件支持上传系统文件。
-9. 新增 - 支持工作流嵌套子应用时，可以设置`非流模式`。
+9. 新增 - 支持工作流嵌套子应用时，可以设置`非流模式`，同时简易模式也可以选择工作流作为插件了，简易模式调用子应用时，都将强制使用非流模式。
 10. 新增 - 调试模式下，子应用调用，支持返回详细运行数据。
 11. 新增 - 保留所有模式下子应用嵌套调用的日志。
 12. 优化 - 工作流嵌套层级限制 20 层，避免因编排不合理导致的无限死循环。

packages/global/core/workflow/template/input.ts

@@ -23,6 +23,7 @@ export const Input_Template_UserChatInput: FlowNodeInputItemType = {
   renderTypeList: [FlowNodeInputTypeEnum.reference, FlowNodeInputTypeEnum.textarea],
   valueType: WorkflowIOValueTypeEnum.string,
   label: i18nT('workflow:user_question'),
+  toolDescription: i18nT('workflow:user_question'),
   required: true
 };
 

packages/service/core/app/plugin/controller.ts

@@ -89,7 +89,7 @@ export async function getChildAppPreviewNode({
     intro: app.intro,
     inputExplanationUrl: app.inputExplanationUrl,
     showStatus: app.showStatus,
-    isTool: isPlugin,
+    isTool: true,
     version: app.version,
     sourceHandle: getHandleConfig(true, true, true, true),
     targetHandle: getHandleConfig(true, true, true, true),

packages/web/i18n/zh/app.json

@@ -81,7 +81,7 @@
   "permission.des.write": "可查看和编辑应用",
   "plugin_cost_per_times": "{{cost}}/次",
   "plugin_dispatch": "插件调用",
-  "plugin_dispatch_tip": "给模型附加额外的能力，具体调用哪些插件，将由模型自主决定。\n若选择了插件，知识库调用将自动作为一个特殊的插件。",
+  "plugin_dispatch_tip": "给模型附加获取外部数据的能力，具体调用哪些插件，将由模型自主决定，所有插件都将以非流模式运行。\n若选择了插件，知识库调用将自动作为一个特殊的插件。",
   "publish_channel": "发布渠道",
   "publish_success": "发布成功",
   "saved_success": "保存成功",
@@ -155,4 +155,4 @@
   "workflow.user_file_input_desc": "用户上传的文档和图片链接",
   "workflow.user_select": "用户选择",
   "workflow.user_select_tip": "该模块可配置多个选项，以供对话时选择。不同选项可导向不同工作流支线"
-}
+}

projects/app/src/components/core/chat/ChatContainer/ChatBox/components/ChatItem.tsx

@@ -95,7 +95,7 @@ const AIContentCard = React.memo(function AIContentCard({
           <AIResponseBox
             key={key}
             value={value}
-            isLastChild={isLastChild && i === chatValue.length - 1}
+            isLastResponseValue={isLastChild && i === chatValue.length - 1}
             isChatting={isChatting}
           />
         );

projects/app/src/components/core/chat/ChatContainer/PluginRunBox/components/RenderOutput.tsx

@@ -33,7 +33,7 @@ const RenderOutput = () => {
                   <AIResponseBox
                     key={key}
                     value={value}
-                    isLastChild={true}
+                    isLastResponseValue={true}
                     isChatting={isChatting}
                   />
                 );

projects/app/src/components/core/chat/ChatContainer/PluginRunBox/components/renderPluginInput.tsx

@@ -110,9 +110,9 @@ const RenderPluginInput = ({
               *
             </Box>
           )}
-          {input.label}
+          {t(input.label as any)}
         </Box>
-        {input.description && <QuestionTip ml={2} label={input.description} />}
+        {input.description && <QuestionTip ml={2} label={t(input.description as any)} />}
       </Flex>
       {render}
     </Box>

projects/app/src/components/core/chat/components/AIResponseBox.tsx

@@ -24,7 +24,7 @@ import { onSendPrompt } from '../ChatContainer/useChat';
 
 type props = {
   value: UserChatItemValueItemType | AIChatItemValueItemType;
-  isLastChild: boolean;
+  isLastResponseValue: boolean;
   isChatting: boolean;
 };
 
@@ -167,11 +167,13 @@ const RenderInteractive = React.memo(function RenderInteractive({
   );
 });
 
-const AIResponseBox = ({ value, isLastChild, isChatting }: props) => {
+const AIResponseBox = ({ value, isLastResponseValue, isChatting }: props) => {
   if (value.type === ChatItemValueTypeEnum.text && value.text)
-    return <RenderText showAnimation={isChatting && isLastChild} text={value.text.content} />;
+    return (
+      <RenderText showAnimation={isChatting && isLastResponseValue} text={value.text.content} />
+    );
   if (value.type === ChatItemValueTypeEnum.tool && value.tools)
-    return <RenderTool showAnimation={isChatting && isLastChild} tools={value.tools} />;
+    return <RenderTool showAnimation={isChatting} tools={value.tools} />;
   if (
     value.type === ChatItemValueTypeEnum.interactive &&
     value.interactive &&

projects/app/src/pages/app/detail/components/Publish/Link/SelectUsingWayModal.tsx

@@ -120,6 +120,7 @@ console.log("Chat box loaded")
   return (
     <MyModal
       isOpen
+      isCentered
       iconSrc="/imgs/modal/usingWay.svg"
       title={t('common:core.app.outLink.Select Using Way')}
       onClose={onClose}

projects/app/src/pages/app/detail/components/SimpleApp/components/ToolSelectModal.tsx

@@ -11,17 +11,10 @@ import {
   InputGroup,
   InputLeftElement,
   ModalBody,
-  ModalFooter,
+  ModalFooter
-  NumberDecrementStepper,
-  NumberIncrementStepper,
-  NumberInput,
-  NumberInputField,
-  NumberInputStepper,
-  Switch,
-  Textarea
 } from '@chakra-ui/react';
 import FillRowTabs from '@fastgpt/web/components/common/Tabs/FillRowTabs';
-import { useRequest, useRequest2 } from '@fastgpt/web/hooks/useRequest';
+import { useRequest2 } from '@fastgpt/web/hooks/useRequest';
 import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
 import {
   FlowNodeTemplateType,
@@ -39,14 +32,15 @@ import MyBox from '@fastgpt/web/components/common/MyBox';
 import { Controller, useForm } from 'react-hook-form';
 import { getTeamPlugTemplates } from '@/web/core/app/api/plugin';
 import { ParentIdType } from '@fastgpt/global/common/parentFolder/type';
-import { AppTypeEnum } from '@fastgpt/global/core/app/constants';
 import { getAppFolderPath } from '@/web/core/app/api/app';
 import FolderPath from '@/components/common/folder/Path';
 import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
 import CostTooltip from '@/components/core/app/plugin/CostTooltip';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import RenderPluginInput from '@/components/core/chat/ChatContainer/PluginRunBox/components/renderPluginInput';
-import { WorkflowIOValueTypeEnum } from '@fastgpt/global/core/workflow/constants';
+import { NodeInputKeyEnum, WorkflowIOValueTypeEnum } from '@fastgpt/global/core/workflow/constants';
+import { useContextSelector } from 'use-context-selector';
+import { AppContext } from '../../context';
 
 type Props = {
   selectedTools: FlowNodeTemplateType[];
@@ -54,6 +48,13 @@ type Props = {
   onRemoveTool: (tool: NodeTemplateListItemType) => void;
 };
 
+const childAppSystemKey: string[] = [
+  NodeInputKeyEnum.forbidStream,
+  NodeInputKeyEnum.history,
+  NodeInputKeyEnum.historyMaxAmount,
+  NodeInputKeyEnum.userChatInput
+];
+
 enum TemplateTypeEnum {
   'systemPlugin' = 'systemPlugin',
   'teamPlugin' = 'teamPlugin'
@@ -61,6 +62,7 @@ enum TemplateTypeEnum {
 
 const ToolSelectModal = ({ onClose, ...props }: Props & { onClose: () => void }) => {
   const { t } = useTranslation();
+  const { appDetail } = useContextSelector(AppContext, (v) => v);
 
   const [templateType, setTemplateType] = useState(TemplateTypeEnum.teamPlugin);
   const [parentId, setParentId] = useState<ParentIdType>('');
@@ -85,9 +87,8 @@ const ToolSelectModal = ({ onClose, ...props }: Props & { onClose: () => void })
       } else if (type === TemplateTypeEnum.teamPlugin) {
         return getTeamPlugTemplates({
           parentId,
-          searchKey: searchVal,
+          searchKey: searchVal
-          type: [AppTypeEnum.folder, AppTypeEnum.httpPlugin, AppTypeEnum.plugin]
+        }).then((res) => res.filter((app) => app.id !== appDetail._id));
-        });
       }
     },
     {
@@ -238,20 +239,24 @@ const RenderList = React.memo(function RenderList({
     }
   }, [configTool, reset]);
 
-  const { mutate: onClickAdd, isLoading } = useRequest({
+  const { runAsync: onClickAdd, loading: isLoading } = useRequest2(
-    mutationFn: async (template: FlowNodeTemplateType) => {
+    async (template: NodeTemplateListItemType) => {
       const res = await getPreviewPluginNode({ appId: template.id });
 
       // All input is tool params
-      if (res.inputs.every((input) => input.toolDescription)) {
+      if (
+        res.inputs.every((input) => childAppSystemKey.includes(input.key) || input.toolDescription)
+      ) {
         onAddTool(res);
       } else {
         reset();
         setConfigTool(res);
       }
     },
-    errorToast: t('common:core.module.templates.Load plugin error')
+    {
-  });
+      errorToast: t('common:core.module.templates.Load plugin error')
+    }
+  );
 
   return templates.length === 0 && !isLoadingData ? (
     <EmptyTip text={t('common:core.app.ToolCall.No plugin')} />
@@ -340,6 +345,7 @@ const RenderList = React.memo(function RenderList({
       {!!configTool && (
         <MyModal
           isOpen
+          isCentered
           title={t('common:core.app.ToolCall.Parameter setting')}
           iconSrc="core/app/toolCall"
           overflow={'auto'}
@@ -359,7 +365,7 @@ const RenderList = React.memo(function RenderList({
               )}
             </HStack>
             {configTool.inputs
-              .filter((item) => !item.toolDescription)
+              .filter((item) => !item.toolDescription && !childAppSystemKey.includes(item.key))
               .map((input) => {
                 return (
                   <Controller

projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodePluginIO/InputEditModal.tsx

@@ -250,7 +250,8 @@ const FieldEditModal = ({
         }
       }
 
-      if (isToolInput) {
+      // Focus remove toolDescription
+      if (isToolInput && data.renderTypeList.includes(FlowNodeInputTypeEnum.reference)) {
         data.toolDescription = data.description;
       } else {
         data.toolDescription = undefined;

projects/app/src/pages/chat/share.tsx

@@ -356,17 +356,13 @@ const OutLink = ({
 
 const Render = (props: Props) => {
   const { shareId, authToken } = props;
-  const { localUId, setLocalUId } = useShareChatStore();
+  const { localUId, loaded } = useShareChatStore();
 
   const contextParams = useMemo(() => {
-    if (!localUId) {
-      const localId = `shareChat-${Date.now()}-${nanoid()}`;
-      setLocalUId(localId);
-      return { shareId, outLinkUid: authToken || localId };
-    }
-
     return { shareId, outLinkUid: authToken || localUId };
-  }, []);
+  }, [authToken, localUId, shareId]);
+
+  if (!loaded || !contextParams.outLinkUid) return <></>;
 
   return (
     <ChatContextProvider params={contextParams}>
@@ -375,7 +371,7 @@ const Render = (props: Props) => {
   );
 };
 
-export default Render;
+export default React.memo(Render);
 
 export async function getServerSideProps(context: any) {
   const shareId = context?.query?.shareId || '';

projects/app/src/web/core/app/utils.ts

@@ -378,7 +378,23 @@ export function form2AppWorkflow(
               y: 545
             },
             version: tool.version,
-            inputs: tool.inputs,
+            inputs: tool.inputs.map((input) => {
+              // Special key value
+              if (input.key === NodeInputKeyEnum.forbidStream) {
+                input.value = true;
+              }
+              // Special tool
+              if (
+                tool.flowNodeType === FlowNodeTypeEnum.appModule &&
+                input.key === NodeInputKeyEnum.history
+              ) {
+                return {
+                  ...input,
+                  value: formData.aiSettings.maxHistories
+                };
+              }
+              return input;
+            }),
             outputs: tool.outputs
           }
         ],

projects/app/src/web/core/chat/storeShareChat.ts

@@ -1,25 +1,34 @@
 import { create } from 'zustand';
 import { devtools, persist } from 'zustand/middleware';
 import { immer } from 'zustand/middleware/immer';
+import { customAlphabet } from 'nanoid';
+const nanoid = customAlphabet(
+  'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWSYZ1234567890_',
+  24
+);
 
 type State = {
   localUId: string;
-  setLocalUId: (id: string) => void;
+  loaded: boolean;
 };
 
 export const useShareChatStore = create<State>()(
   devtools(
     persist(
       immer((set, get) => ({
-        localUId: '',
+        localUId: `shareChat-${Date.now()}-${nanoid()}`,
-        setLocalUId(id) {
+        loaded: false
-          set((state) => {
-            state.localUId = id;
-          });
-        }
       })),
       {
-        name: 'shareChatStore'
+        name: 'shareChatStore',
+        onRehydrateStorage: () => (state) => {
+          if (state) {
+            state.loaded = true;
+          }
+        },
+        partialize: (state) => ({
+          localUId: state.localUId
+        })
       }
     )
   )