Merge branch 'develop' into feature/history_zy

web/src/views/Workflow/hooks/useWorkflowGraph.ts

@@ -19,6 +19,7 @@ import type { FeaturesConfigForm } from '@/views/ApplicationConfig/types';
 import { conditionNodeHeight, conditionNodeItemHeight, conditionNodePortItemArgsY, defaultAbsolutePortGroups, defaultPortItems, edgeAttrs, edgeHoverTool, edge_color, edge_selected_color, edge_width, graphNodeLibrary, nodeLibrary, nodeRegisterLibrary, nodeWidth, notesConfig, portAttrs, portItemArgsY, portMarkup, portTextAttrs, unknownNode } from '../constant';
 import type { ChatVariable, NodeProperties, WorkflowConfig } from '../types';
 import { calcConditionNodeTotalHeight, getConditionNodeCasePortY } from '../utils';
+import { useWorkflowStore } from '@/store/workflow';
 
 /**
  * Props for useWorkflowGraph hook
@@ -103,6 +104,8 @@ export const useWorkflowGraph = ({
   const { message } = App.useApp();
   const { t } = useTranslation()
   const { user } = useUser();
+  const { chatHistoryMap } = useWorkflowStore()
+  const chatHistory = Object.values(chatHistoryMap).at(-1) ?? []
 
   // Refs
   const graphRef = useRef<Graph>();
@@ -122,6 +125,7 @@ export const useWorkflowGraph = ({
     graphRef.current.getNodes().forEach(node => {
       const data = node.getData()
       if (data?.type === 'if-else' || data?.type === 'question-classifier') {
+        console.log('chatVariables', chatVariables)
         node.setData({ ...data, chatVariables }, { silent: true })
       }
     })
@@ -214,7 +218,7 @@ export const useWorkflowGraph = ({
                 ? Object.entries(group_variables as Record<string, any>).map(([key, value]) => ({ key, value }))
                 : group_variables
             } else if (type === 'http-request' && (key === 'headers' || key === 'params') && config[key] && typeof config[key] === 'object' && !Array.isArray(config[key]) && nodeLibraryConfig.config && nodeLibraryConfig.config[key]) {
-              nodeLibraryConfig.config[key].defaultValue = Object.entries(config[key]).map(([name, value]) => ({ name, value }))
+              nodeLibraryConfig.config[key].defaultValue = Object.entries(config[key]).map(([key, value]) => ({ key, value }))
             } else if (type === 'code' && key === 'code' && config[key] && nodeLibraryConfig.config && nodeLibraryConfig.config[key]) {
               try {
                 nodeLibraryConfig.config[key].defaultValue = decodeURIComponent(atob(config[key] as string))
@@ -1051,24 +1055,39 @@ export const useWorkflowGraph = ({
 
     graphRef.current.on('node:removed', blankClick)
     // When edge connected, bring connected nodes' ports to front
-    graphRef.current.on('edge:connected', ({ isNew }) => {
-      // Bring edge to front first, then bring child nodes above edges
-      // Parent (loop/iteration) nodes stay behind to avoid covering edges
-      // Reset any port hover state left from dragging
+    graphRef.current.on('edge:connected', ({ isNew, edge }) => {
       if (isNew) {
-        graphRef.current?.getNodes().forEach(node => {
-          if (!node.getData()?.cycle) node.toFront();
-        });
-        graphRef.current?.getEdges().forEach(edge => {
-          const sourceCell = graphRef.current?.getCellById(edge.getSourceCellId());
-          const targetCell = graphRef.current?.getCellById(edge.getTargetCellId());
-          if (sourceCell?.getData()?.cycle || targetCell?.getData()?.cycle) {
-            edge.toFront();
-          }
-        });
-        graphRef.current?.getNodes().forEach(node => {
-          if (node.getData()?.cycle) node.toFront();
-        });
+        const sourceCellId = edge.getSourceCellId()
+        const targetCellId = edge.getTargetCellId()
+        const sourceCell = graphRef.current?.getCellById(sourceCellId);
+        const targetCell = graphRef.current?.getCellById(targetCellId);
+
+        sourceCell?.toFront();
+        targetCell?.toFront()
+        if (['loop', 'iteration'].includes(sourceCell?.getData()?.type)) {
+          graphRef.current?.getEdges().forEach(edge => {
+            const edgeSourceCell = graphRef.current?.getCellById(edge.getSourceCellId());
+            const edgeTargetCell = graphRef.current?.getCellById(edge.getTargetCellId());
+            if (edgeSourceCell?.getData()?.cycle === sourceCellId || edgeTargetCell?.getData()?.cycle === sourceCellId) {
+              edge.toFront();
+            }
+          });
+          graphRef.current?.getNodes().forEach(node => {
+            if (node.getData()?.cycle === sourceCellId) node.toFront();
+          });
+        }
+        if (['loop', 'iteration'].includes(targetCell?.getData()?.type)) {
+          graphRef.current?.getEdges().forEach(edge => {
+            const edgeSourceCell = graphRef.current?.getCellById(edge.getSourceCellId());
+            const edgeTargetCell = graphRef.current?.getCellById(edge.getTargetCellId());
+            if (edgeSourceCell?.getData()?.cycle === targetCellId || edgeTargetCell?.getData()?.cycle === targetCellId) {
+              edge.toFront();
+            }
+          });
+          graphRef.current?.getNodes().forEach(node => {
+            if (node.getData()?.cycle === targetCellId) node.toFront();
+          });
+        }
       }
     });
 
@@ -1216,9 +1235,6 @@ export const useWorkflowGraph = ({
       }) || [];
       const edges = graphRef.current?.getEdges() || []
 
-
-      console.log('config', config)
-
       const params = {
         ...config,
         features: featuresRef.current,
@@ -1275,9 +1291,17 @@ export const useWorkflowGraph = ({
                 itemConfig[key] = {}
                 if (value.length > 0) {
                   value.forEach((vo: any) => {
-                    itemConfig[key][vo.name] = vo.value
+                    itemConfig[key][vo.key] = vo.value
                   })
                 }
+              } else if (data.type === 'http-request' && key === 'body' && data.config[key] && 'defaultValue' in data.config[key]) {
+                const value = data.config[key].defaultValue
+                itemConfig[key] = value
+                if (value.content_type === 'json' && value.data && value.data !== '') {
+                  itemConfig[key].data = value.data.replace(/\u00a0/g, ' ')
+                } else {
+                  itemConfig[key].data = value.data
+                }
               } else if (data.config[key] && 'defaultValue' in data.config[key] && key !== 'knowledge_retrieval') {
                 itemConfig[key] = data.config[key].defaultValue
               } else if (key === 'knowledge_retrieval' && data.config[key] && 'defaultValue' in data.config[key]) {
@@ -1460,6 +1484,31 @@ export const useWorkflowGraph = ({
       }
     }
   }
+  useEffect(() => {
+    if (!graphRef.current) return;
+    const nodes = graphRef.current.getNodes();
+
+    const lastWithSub = [...chatHistory].reverse().find(item => item.subContent?.length);
+    // Reset all node execution status first
+    nodes.forEach(node => {
+      const data = node.getData();
+      if (typeof data.status === 'string') {
+        node.setData({ ...data, executionStatus: undefined });
+      }
+    });
+    if (!lastWithSub?.subContent) return;
+    // Build a nodeId -> status map first
+    const statusMap: Record<string, string> = {};
+    lastWithSub.subContent.forEach(sub => {
+      if (typeof sub.status === 'string') {
+        statusMap[sub.node_id] = sub.status;
+        const node = nodes.find(n => n.getData()?.id === sub.node_id);
+        if (node) {
+          node.setData({ ...node.getData(), executionStatus: sub.status });
+        }
+      }
+    });
+  }, [chatHistory, graphRef.current]);
 
   return {
     config,