From 03f19368f66f57553f3324f89ab1c1892bb61116 Mon Sep 17 00:00:00 2001
From: ali asaria <aliasaria@users.noreply.github.com>
Date: Thu, 27 Feb 2025 14:05:20 -0500
Subject: [PATCH] support delete node
---
.../Experiment/Workflows/WorkflowCanvas.tsx | 54 ++++++++++---------
.../components/Experiment/Workflows/index.tsx | 1 +
src/renderer/lib/transformerlab-api-sdk.ts | 19 ++++---
3 files changed, 42 insertions(+), 32 deletions(-)
diff --git a/src/renderer/components/Experiment/Workflows/WorkflowCanvas.tsx b/src/renderer/components/Experiment/Workflows/WorkflowCanvas.tsx
index e6353b58..f07d2ab8 100644
--- a/src/renderer/components/Experiment/Workflows/WorkflowCanvas.tsx
+++ b/src/renderer/components/Experiment/Workflows/WorkflowCanvas.tsx
@@ -10,6 +10,8 @@ import {
import { PlusCircleIcon } from 'lucide-react';
import { useEffect } from 'react';
import CustomNode from './CustomNode';
+import * as chatAPI from '../../../lib/transformerlab-api-sdk';
+import { mutate } from 'swr';
const nodeTypes = { customNode: CustomNode };
@@ -26,22 +28,15 @@ function generateNodes(workflow: any) {
console.log(workflowConfig);
- while (currentTask != 'END') {
- let currentNode = {};
- workflowConfig.nodes.forEach((node) => {
- if (node.id == currentTask) {
- currentNode = node;
- }
- });
-
- // console.log(currentNode);
-
+ for (let i = 0; i < workflowConfig.nodes.length; i++) {
+ const node = workflowConfig.nodes[i];
+ console.log(node);
const data = {
- id: currentNode?.id,
- label: currentNode.name,
- jobType: currentNode.type,
- template: currentNode.template,
- metadata: currentNode?.metadata,
+ id: node?.id,
+ label: node.name,
+ jobType: node.type,
+ template: node.template,
+ metadata: node?.metadata,
};
const nextNode = {
id: currentTask,
@@ -51,7 +46,7 @@ function generateNodes(workflow: any) {
};
out.push(nextNode);
position += 120;
- currentTask = currentNode.out;
+ currentTask = node.out;
}
return out;
@@ -69,13 +64,8 @@ function generateEdges(workflow: any) {
console.log(workflowConfig);
- while (currentTask != 'END') {
- let currentNode = {};
- workflowConfig.nodes.forEach((node) => {
- if (node.id == currentTask) {
- currentNode = node;
- }
- });
+ for (let i = 0; i < workflowConfig.nodes.length; i++) {
+ const currentNode = workflowConfig.nodes[i];
out.push({
id: ids,
@@ -92,8 +82,14 @@ function generateEdges(workflow: any) {
return out;
}
-const Flow = ({ selectedWorkflow, setNewNodeModalOpen = (x) => {} }) => {
+const Flow = ({
+ selectedWorkflow,
+ setNewNodeModalOpen = (x) => {},
+ mutateWorkflows,
+}) => {
const reactFlowInstance = useReactFlow();
+
+ const workflowId = selectedWorkflow?.id;
// Use fitView after the component mounts
useEffect(() => {
// Wait a moment to ensure the flow is rendered before fitting
@@ -118,10 +114,14 @@ const Flow = ({ selectedWorkflow, setNewNodeModalOpen = (x) => {} }) => {
zoomOnPinch={false}
zoomOnDoubleClick={false}
panOnScroll={false}
- onDelete={({ nodes, edges }) => {
+ onDelete={async ({ nodes, edges }) => {
for (const node of nodes) {
- alert('delete node: ' + node?.id);
+ console.log('delete node: ' + node?.id);
+ await fetch(
+ chatAPI.Endpoints.Workflows.DeleteNode(workflowId, node?.id)
+ );
}
+ mutateWorkflows();
}}
style={{
backgroundColor: 'var(--joy-palette-background-level2)',
@@ -159,6 +159,7 @@ const Flow = ({ selectedWorkflow, setNewNodeModalOpen = (x) => {} }) => {
export default function WorkflowCanvas({
selectedWorkflow,
setNewNodeModalOpen = () => {},
+ mutateWorkflows,
}) {
if (!selectedWorkflow) {
return null;
@@ -168,6 +169,7 @@ export default function WorkflowCanvas({
<Flow
selectedWorkflow={selectedWorkflow}
setNewNodeModalOpen={setNewNodeModalOpen}
+ mutateWorkflows={mutateWorkflows}
/>
</ReactFlowProvider>
);
diff --git a/src/renderer/components/Experiment/Workflows/index.tsx b/src/renderer/components/Experiment/Workflows/index.tsx
index 050c8e21..f883eedc 100644
--- a/src/renderer/components/Experiment/Workflows/index.tsx
+++ b/src/renderer/components/Experiment/Workflows/index.tsx
@@ -197,6 +197,7 @@ export default function Workflows({ experimentInfo }) {
<WorkflowCanvas
selectedWorkflow={selectedWorkflow}
setNewNodeModalOpen={setNewNodeflowModalOpen}
+ mutateWorkflows={mutateWorkflows}
/>
) : (
<Box sx={{ width: '100%', backgroundColor: '#F7F9FB' }} p={4}>
diff --git a/src/renderer/lib/transformerlab-api-sdk.ts b/src/renderer/lib/transformerlab-api-sdk.ts
index 8542afad..36ae8bba 100644
--- a/src/renderer/lib/transformerlab-api-sdk.ts
+++ b/src/renderer/lib/transformerlab-api-sdk.ts
@@ -1018,12 +1018,19 @@ Endpoints.Workflows = {
'&experiment_id=' +
experimentId,
AddNode: (workflowId: string, node: string) =>
- API_URL() +
- 'workflows/add_node' +
- '?workflow_id=' +
- workflowId +
- '&node=' +
- node,
+ API_URL() +
+ 'workflows/add_node' +
+ '?workflow_id=' +
+ workflowId +
+ '&node=' +
+ node,
+ DeleteNode: (workflowId: string, nodeId: string) =>
+ API_URL() +
+ 'workflows/delete_node' +
+ '?workflow_id=' +
+ workflowId +
+ '&node_id=' +
+ nodeId,
RunWorkflow: (workflowId: string) =>
API_URL() + 'workflows/start/' + workflowId,
};
--
GitLab