4.8.13 test (#3102)

* fix: loop index;edge parent check

* perf: reference invalid check

* fix: ts

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

@@ -18,6 +18,7 @@ import { OutLinkChatAuthProps } from '@fastgpt/global/support/permission/chat';
 import { ChatBoxInputFormType } from '../ChatBox/type';
 import { chats2GPTMessages } from '@fastgpt/global/core/chat/adapt';
 import { getPluginRunUserQuery } from '@fastgpt/global/core/workflow/utils';
+import { cloneDeep } from 'lodash';
 
 type PluginRunContextType = OutLinkChatAuthProps &
   PluginRunBoxProps & {
@@ -226,13 +227,25 @@ const PluginRunContextProvider = ({
       });
 
       try {
+        // Remove files icon
+        const formatVariables = cloneDeep(variables);
+        for (const key in formatVariables) {
+          if (Array.isArray(formatVariables[key])) {
+            formatVariables[key].forEach((item) => {
+              if (item.url && item.icon) {
+                delete item.icon;
+              }
+            });
+          }
+        }
+
         const { responseData } = await onStartChat({
           messages,
           controller: chatController.current,
           generatingMessage,
           variables: {
-            files: files,
-            ...variables
+            files,
+            ...formatVariables
           }
         });
         if (responseData?.[responseData.length - 1]?.error) {

projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/components/ButtonEdge.tsx

@@ -34,9 +34,12 @@ const ButtonEdge = (props: EdgeProps) => {
 
   // If parentNode is folded, the edge will not be displayed
   const parentNode = useMemo(() => {
-    return nodeList.find(
-      (node) => (node.nodeId === source || node.nodeId === target) && node.parentNodeId
-    );
+    for (const node of nodeList) {
+      if ((node.nodeId === source || node.nodeId === target) && node.parentNodeId) {
+        return nodeList.find((parent) => parent.nodeId === node.parentNodeId);
+      }
+    }
+    return undefined;
   }, [nodeList, source, target]);
 
   const defaultZIndex = useMemo(

projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/hooks/useWorkflow.tsx

@@ -294,7 +294,20 @@ export const useWorkflow = () => {
 
   // Loop node size and position
   const resetParentNodeSizeAndPosition = useMemoizedFn((parentId: string) => {
-    const childNodes = nodes.filter((node) => node.data.parentNodeId === parentId);
+    const { childNodes, loopNode } = nodes.reduce(
+      (acc, node) => {
+        if (node.data.parentNodeId === parentId) {
+          acc.childNodes.push(node);
+        }
+        if (node.id === parentId) {
+          acc.loopNode = node;
+        }
+        return acc;
+      },
+      { childNodes: [] as Node[], loopNode: undefined as Node | undefined }
+    );
+
+    if (!loopNode) return;
 
     const rect = getNodesBounds(childNodes);
     // Calculate parent node size with minimum width/height constraints
@@ -320,7 +333,6 @@ export const useWorkflow = () => {
         value: height
       }
     });
-
     // Update parentNode position
     onNodesChange([
       {

projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/Loop/NodeLoop.tsx

@@ -103,6 +103,7 @@ const NodeLoop = ({ data, selected }: NodeProps<FlowNodeItemType>) => {
       nodeList.filter((node) => node.parentNodeId === nodeId).map((node) => node.nodeId)
     );
   }, [nodeId, nodeList]);
+
   useEffect(() => {
     onChangeNode({
       nodeId,
@@ -143,7 +144,6 @@ const NodeLoop = ({ data, selected }: NodeProps<FlowNodeItemType>) => {
         }
       };
     });
-    console.log(childNodesChange);
 
     onNodesChange(childNodesChange);
   }, [size?.height]);

projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/Loop/NodeLoopStart.tsx

@@ -121,7 +121,7 @@ const NodeLoopStart = ({ data, selected }: NodeProps<FlowNodeItemType>) => {
                             mr={1}
                             color={'primary.600'}
                           />
-                          {t(output.label)}
+                          {t(output.label as any)}
                         </Flex>
                       </Td>
                       {output.valueType && <Td>{FlowValueTypeMap[output.valueType]?.label}</Td>}

projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/render/RenderInput/templates/Reference.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useMemo } from 'react';
+import React, { useCallback, useEffect, useMemo } from 'react';
 import type { RenderInputProps } from '../type';
 import { Flex, Box, ButtonProps, Grid } from '@chakra-ui/react';
 import MyIcon from '@fastgpt/web/components/common/Icon';
@@ -240,25 +240,42 @@ const MultipleReferenceSelector = ({
     [list]
   );
 
-  const ArraySelector = useMemo(() => {
-    const selectorVal = value as ReferenceItemValueType[];
-    const validSelectValue = selectorVal && selectorVal.length > 0;
+  // Get valid item and remove invalid item
+  const formatList = useMemo(() => {
+    if (!value) return [];
 
+    return value?.map((item) => {
+      const [nodeName, outputName] = getSelectValue(item);
+      return {
+        rawValue: item,
+        nodeName,
+        outputName
+      };
+    });
+  }, [getSelectValue, value]);
+
+  useEffect(() => {
+    const validList = formatList.filter((item) => item.nodeName && item.outputName);
+    if (validList.length !== value?.length) {
+      onSelect(validList.map((item) => item.rawValue));
+    }
+  }, [formatList, onSelect, value]);
+
+  const ArraySelector = useMemo(() => {
     return (
       <MultipleRowArraySelect
         label={
-          validSelectValue ? (
+          formatList.length > 0 ? (
             <Grid py={3} gridTemplateColumns={'1fr 1fr'} gap={2} fontSize={'sm'}>
-              {selectorVal?.map((item, index) => {
-                const [nodeName, outputName] = getSelectValue(item);
-                const isInvalidItem = !nodeName || !outputName;
+              {formatList.map(({ nodeName, outputName }, index) => {
+                if (!nodeName || !outputName) return null;
 
                 return (
                   <Flex
                     alignItems={'center'}
                     key={index}
-                    bg={isInvalidItem ? 'red.50' : 'primary.50'}
-                    color={isInvalidItem ? 'red.500' : 'myGray.900'}
+                    bg={'primary.50'}
+                    color={'myGray.900'}
                     py={1}
                     px={1.5}
                     rounded={'sm'}
@@ -269,27 +286,21 @@ const MultipleReferenceSelector = ({
                       maxW={'200px'}
                       className="textEllipsis"
                     >
-                      {isInvalidItem ? (
-                        <>{t('common:invalid_variable')}</>
-                      ) : (
-                        <>
-                          {nodeName}
-                          <MyIcon
-                            name={'common/rightArrowLight'}
-                            mx={1}
-                            w={'12px'}
-                            color={'myGray.500'}
-                          />
-                          {outputName}
-                        </>
-                      )}
+                      {nodeName}
+                      <MyIcon
+                        name={'common/rightArrowLight'}
+                        mx={1}
+                        w={'12px'}
+                        color={'myGray.500'}
+                      />
+                      {outputName}
                     </Flex>
                     <MyIcon
                       name={'common/closeLight'}
                       w={'1rem'}
                       ml={1}
                       cursor={'pointer'}
-                      color={isInvalidItem ? 'red.500' : 'myGray.500'}
+                      color={'myGray.500'}
                       _hover={{
                         color: 'red.600'
                       }}
@@ -308,13 +319,13 @@ const MultipleReferenceSelector = ({
             </Box>
           )
         }
-        value={selectorVal as any}
+        value={value as any}
         list={list}
         onSelect={onSelect as any}
         popDirection={popDirection}
       />
     );
-  }, [getSelectValue, list, onSelect, placeholder, popDirection, t, value]);
+  }, [formatList, list, onSelect, placeholder, popDirection, value]);
 
   return ArraySelector;
 };

projects/app/src/pages/app/detail/components/WorkflowComponents/context/index.tsx

@@ -364,7 +364,6 @@ const WorkflowContextProvider = ({
     WorkflowNodeEdgeContext,
     (state) => state.nodeListString
   );
-
   const nodeList = useMemo(
     () => JSON.parse(nodeListString) as FlowNodeItemType[],
     [nodeListString]

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

@@ -413,8 +413,10 @@ export const checkWorkflowNodeAndConnection = ({
               return true;
             }
 
-            return input.required && !isValidArrayReferenceValue(input.value, nodeIds);
+            return !isValidArrayReferenceValue(input.value, nodeIds);
           }
+
+          // Single reference
           return input.required && !isValidReferenceValue(input.value, nodeIds);
         }
         return false;