11666592870

Committed 04 Nov 2024 02:46PM UTC coverage: 95.825% (-0.7%) from 96.476%

Build # 11666592870

Build Type

push

github

Committed by

web-flow

Commit Message

Merge pull request #34 from waldiez/dev

Dev

Run Details

2113 of 2324 branches covered (90.92%)

Branch coverage included in aggregate %.

440 of 466 new or added lines in 24 files covered. (94.42%)

73 existing lines in 4 files now uncovered.

12508 of 12934 relevant lines covered (96.71%)

469.33 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

86.15

/src/waldiez/components/flow/index.tsx

/* eslint-disable max-lines-per-function */
import {
  Edge,
  EdgeChange,
  Node,
  NodeChange,
  ReactFlowInstance,
  Viewport,
  XYPosition,
  useReactFlow
} from '@xyflow/react';

import { KeyboardEvent, useCallback, useEffect, useState } from 'react';
import { useHotkeys } from 'react-hotkeys-hook';

import { WaldiezFlowProps } from '@waldiez/components/flow/types';
import { WaldiezFlowView } from '@waldiez/components/flow/view';
import { showSnackbar } from '@waldiez/components/snackbar';
import { WaldiezAgentNodeType, WaldiezNodeType } from '@waldiez/models';
import { useTemporalStore, useWaldiezContext } from '@waldiez/store';
import { selector } from '@waldiez/store/selector';
import { isDarkMode, setDarkMode, toggleThemeMode } from '@waldiez/theme';

export const WaldiezFlow = (props: WaldiezFlowProps) => {
  const { flowId, storageId, onRun, onChange, inputPrompt, onUserInput } = props;
  const store = useWaldiezContext(selector);
  const { undo, redo, futureStates, pastStates } = useTemporalStore(state => state);
  const { screenToFlowPosition, getIntersectingNodes } = useReactFlow();
  const darkTheme = isDarkMode(flowId, storageId);
  const [isDark, setIsDark] = useState<boolean>(darkTheme);
  const [isModalOpen, setModalOpen] = useState(false);
  const isFlowVisible = () => {
    const rootDiv = document.getElementById(`rf-root-${flowId}`);
    if (!rootDiv) {
      return false;
    }
    const clientRect = rootDiv.getBoundingClientRect();
    return clientRect.width > 0 && clientRect.height > 0;
  };
  useHotkeys(
    'mod+z',
    () => {
      if (pastStates.length > 0) {
        if (isFlowVisible()) {
          undo();
        }
      }
    },
    { scopes: flowId }
  );
  useHotkeys(
    ['shift+mod+z', 'mod+y'],
    () => {
      if (futureStates.length > 0) {
        if (isFlowVisible()) {
          redo();
        }
      }
    },
    { scopes: flowId }
  );
  useEffect(() => {
    store.showNodes('agent');
    setDarkMode(flowId, storageId, isDarkMode(flowId, storageId));
  }, []);
  const [selectedNodeType, setSelectedNodeType] = useState<WaldiezNodeType>('agent');
  const onFlowChanged = () => {
    const flow = getFlow();
    if (flow && onChange) {
      onChange(JSON.stringify(flow));
    }
    return flow;
  };
  const getFlow = (hideSecrets: boolean = false) => {
    return store.exportFlow(hideSecrets);
  };
  const canRun = () => {
    const agentsCount = store.getAgents().length;
    if (agentsCount < 2) {
      const msg = agentsCount === 0 ? 'No agents' : 'Only one agent';
      showSnackbar(flowId, `${msg} found in the flow`, 'error', 3000);
      return false;
    }
    const [orderedEdges, _] = store.getFlowEdges();
    return orderedEdges.length > 0;
  };
  const onFlowInit = (instance: ReactFlowInstance) => {
    store.setRfInstance(instance);
    const rootDiv = document.getElementById(`rf-root-${flowId}`);
    if (rootDiv) {
      const viewport = instance.getViewport();
      instance.fitView({
        minZoom: viewport.zoom,
        maxZoom: viewport.zoom,
        includeHiddenNodes: false,
        padding: 10,
        duration: 100
      });
    }
  };
  const handleRun = () => {
    if (typeof onRun === 'function') {
      if (onRun) {
        if (canRun()) {
          const flow = onFlowChanged();
          if (flow) {
            onRun(JSON.stringify(flow));
          }
        } else {
          setModalOpen(true);
        }
      }
    }
  };
  const deleteNode = (target: Element) => {
    const nodeId = target.getAttribute('data-id');
    if (nodeId) {
      const isAgent = target.classList.contains('react-flow__node-agent');
      const isModel = target.classList.contains('react-flow__node-model');
      const isSkill = target.classList.contains('react-flow__node-skill');
      if (isAgent) {
        store.deleteAgent(nodeId);
      } else {
        if (isModel) {
          store.deleteModel(nodeId);
        } else {
          if (isSkill) {
            store.deleteSkill(nodeId);
          }
        }
      }
    }
  };
  const deleteEdge = (target: Element) => {
    const edgeId = target.getAttribute('data-id');
    if (edgeId) {
      store.deleteEdge(edgeId);
    }
  };
  const onDeleteKey = (event: KeyboardEvent) => {
    const target = event.target;
    const isNode = target instanceof Element && target.classList.contains('react-flow__node');
    if (isNode) {
      deleteNode(target);
      onFlowChanged();
    } else {
      const isEdge =
        target instanceof Element &&
        (target.classList.contains('react-flow__edge') || target.classList.contains('edge-data-view'));
      if (isEdge) {
        deleteEdge(target);
        onFlowChanged();
      }
    }
  };
  const onKeyDown = (event: KeyboardEvent | undefined) => {
    if (event?.key === 'Delete') {
      onDeleteKey(event);
    }
  };
  const onDragOver = useCallback((event: React.DragEvent<HTMLDivElement>) => {
    event.preventDefault();
    event.dataTransfer.dropEffect = 'move';
  }, []);
  const getIntersectingManager = (intersectingNodes: Node[]) => {
    let parent: Node | undefined;
    const isIntersectingWithManager = intersectingNodes.some(
      node => node.type === 'agent' && node.data.agentType === 'manager'
    );
    if (isIntersectingWithManager) {
      const managerNode = intersectingNodes.find(
        node => node.type === 'agent' && node.data.agentType === 'manager'
      );
      if (managerNode) {
        parent = managerNode;
      }
    }
    return parent;
  };
  const getDroppedAgentParent = (agentType: WaldiezAgentNodeType, position: XYPosition) => {
    let parent: Node | undefined;
    if (agentType !== 'manager') {
      const { x, y } = position;
      const nodeRect = {
        x,
        y,
        width: 100,
        height: 100
      };
      let intersectingNodes: Node[] = [];
      try {
        intersectingNodes = getIntersectingNodes(nodeRect);
      } catch (_) {
        // testing/no dom: Cannot read properties of undefined (reading 'parentId')
      }
      if (intersectingNodes.length > 0) {
        parent = getIntersectingManager(intersectingNodes);
      }
    }
    return parent;
  };
  const getAgentType = (event: React.DragEvent<HTMLDivElement>) => {
    const nodeTypeData = event.dataTransfer.getData('application/node');
    let agentType: WaldiezAgentNodeType | undefined;
    if (nodeTypeData === 'agent') {
      const agentTypeData = event.dataTransfer.getData('application/agent');
      if (['user', 'assistant', 'manager'].includes(agentTypeData)) {
        agentType = agentTypeData as WaldiezAgentNodeType;
      }
    }
    if (nodeTypeData !== 'agent' || !agentType) {
      agentType = undefined;
    }
    return agentType;
  };
  const addAgentNode = (event: React.DragEvent<HTMLDivElement>, agentType: WaldiezAgentNodeType) => {
    let position = screenToFlowPosition({
      x: event.clientX,
      y: event.clientY
    });
    const parent = getDroppedAgentParent(agentType, position);
    if (parent) {
      position = parent.position;
    }
    const newNode = store.addAgent(agentType, position);
    if (parent) {
      addParentNodeEdge(parent, newNode);
    }
    return newNode;
  };
  const addParentNodeEdge = (parent: Node, newNode: Node) => {
    store.addEdge(parent.id, newNode.id, true);
    setTimeout(() => {
      store.setAgentGroup(newNode.id, parent.id);
    }, 0);
    setTimeout(() => {
      store.reselectNode(parent.id);
    }, 100);
  };
  const onDrop = useCallback(
    (event: React.DragEvent<HTMLDivElement>) => {
      event.preventDefault();
      const agentType = getAgentType(event);
      if (!agentType) {
        return;
      }
      addAgentNode(event, agentType);
      if (selectedNodeType !== 'agent') {
        setSelectedNodeType('agent');
        store.showNodes('agent');
      }
      onFlowChanged();
    },
    [screenToFlowPosition]
  );
  const onNodeTypeSelected = (nodeType: WaldiezNodeType) => {
    setSelectedNodeType(nodeType);
    store.showNodes(nodeType);
  };
  const onAddNode = () => {
    if (selectedNodeType === 'model') {
      store.addModel();
      onFlowChanged();
    } else if (selectedNodeType === 'skill') {
      store.addSkill();
      onFlowChanged();
    }
  };
  const onNodesChange = (changes: NodeChange<Node>[]) => {
    store.onNodesChange(changes);
    onFlowChanged();
  };
  const onEdgesChange = (changes: EdgeChange<Edge>[]) => {
    store.onEdgesChange(changes);
    onFlowChanged();
  };
  const onModalSubmit = (data: {
    name: string;
    description: string;
    tags: string[];
    requirements: string[];
    orders: { id: string; order: number }[];
  }) => {
    store.updateFlow(data);
    store.updateFlowOrder(data.orders);
    // setModalOpen(false);
    onFlowChanged();
  };
  const onNodeDoubleClick = (event: React.MouseEvent, node: Node) => {
    const target = event.target;
    if (target instanceof Element && target.tagName === 'TEXTAREA') {
      return;
    }
    store.onNodeDoubleClick(event, node);
  };
  const includeRunButton = typeof onRun === 'function';
  const onImport = (contents: any) => {
    store.importFlow(contents, selectedNodeType);
    setSelectedNodeType('agent');
    store.showNodes('agent');
    onFlowChanged();
  };
  const onThemeToggle = () => {
    setIsDark(!isDark);
    toggleThemeMode(flowId, storageId);
  };
  const onViewportChange = (viewport: Viewport) => {
    store.onViewportChange(viewport, selectedNodeType);
  };
  return (
    <WaldiezFlowView
      flowId={flowId}
      storageId={storageId}
      darkMode={isDark}
      store={store}
      selectedNodeType={selectedNodeType}
      isModalOpen={isModalOpen}
      inputPrompt={inputPrompt}
      includeRunButton={includeRunButton}
      onThemeToggle={onThemeToggle}
      onCloseModal={setModalOpen.bind(null, false)}
      getFlow={getFlow}
      onEditFlow={setModalOpen.bind(null, true)}
      onImport={onImport}
      onUserInput={onUserInput}
      onAddNode={onAddNode}
      onNodesChange={onNodesChange}
      onNodeDoubleClick={onNodeDoubleClick}
      onEdgesChange={onEdgesChange}
      onViewportChange={onViewportChange}
      onRun={handleRun}
      onModalSubmit={onModalSubmit}
      onNodeTypeSelected={onNodeTypeSelected}
      onFlowInit={onFlowInit}
      onDrop={onDrop}
      onDragOver={onDragOver}
      onkeydown={onKeyDown}
    />
  );
};

1	/* eslint-disable max-lines-per-function */	1✔
2	import {
3	Edge,
4	EdgeChange,
5	Node,
6	NodeChange,
7	ReactFlowInstance,
8	Viewport,
9	XYPosition,
10	useReactFlow
11	} from '@xyflow/react';
12
13	import { KeyboardEvent, useCallback, useEffect, useState } from 'react';
14	import { useHotkeys } from 'react-hotkeys-hook';
15
16	import { WaldiezFlowProps } from '@waldiez/components/flow/types';
17	import { WaldiezFlowView } from '@waldiez/components/flow/view';
18	import { showSnackbar } from '@waldiez/components/snackbar';
19	import { WaldiezAgentNodeType, WaldiezNodeType } from '@waldiez/models';
20	import { useTemporalStore, useWaldiezContext } from '@waldiez/store';
21	import { selector } from '@waldiez/store/selector';
22	import { isDarkMode, setDarkMode, toggleThemeMode } from '@waldiez/theme';
23
24	export const WaldiezFlow = (props: WaldiezFlowProps) => {	1✔
25	const { flowId, storageId, onRun, onChange, inputPrompt, onUserInput } = props;	389✔
26	const store = useWaldiezContext(selector);	389✔
27	const { undo, redo, futureStates, pastStates } = useTemporalStore(state => state);	389✔
28	const { screenToFlowPosition, getIntersectingNodes } = useReactFlow();	389✔
29	const darkTheme = isDarkMode(flowId, storageId);	389✔
30	const [isDark, setIsDark] = useState<boolean>(darkTheme);	389✔
31	const [isModalOpen, setModalOpen] = useState(false);	389✔
32	const isFlowVisible = () => {	389✔
33	const rootDiv = document.getElementById(`rf-root-${flowId}`);	3✔
34	if (!rootDiv) {	3!
NEW 35	return false;	×
NEW 36	}	×
37	const clientRect = rootDiv.getBoundingClientRect();	3✔
38	return clientRect.width > 0 && clientRect.height > 0;	3✔
39	};	3✔
40	useHotkeys(	389✔
41	'mod+z',	389✔
42	() => {	389✔
43	if (pastStates.length > 0) {	2✔
44	if (isFlowVisible()) {	2✔
45	undo();	2✔
46	}	2✔
47	}	2✔
48	},	2✔
49	{ scopes: flowId }	389✔
50	);	389✔
51	useHotkeys(	389✔
52	['shift+mod+z', 'mod+y'],	389✔
53	() => {	389✔
54	if (futureStates.length > 0) {	1✔
55	if (isFlowVisible()) {	1✔
56	redo();	1✔
57	}	1✔
58	}	1✔
59	},	1✔
60	{ scopes: flowId }	389✔
61	);	389✔
62	useEffect(() => {	389✔
63	store.showNodes('agent');	49✔
64	setDarkMode(flowId, storageId, isDarkMode(flowId, storageId));	49✔
65	}, []);	389✔
66	const [selectedNodeType, setSelectedNodeType] = useState<WaldiezNodeType>('agent');	389✔
67	const onFlowChanged = () => {	389✔
68	const flow = getFlow();	1,235✔
69	if (flow && onChange) {	1,235✔
70	onChange(JSON.stringify(flow));	1,235✔
71	}	1,235✔
72	return flow;	1,235✔
73	};	1,235✔
74	const getFlow = (hideSecrets: boolean = false) => {	389✔
75	return store.exportFlow(hideSecrets);	1,237✔
76	};	1,237✔
77	const canRun = () => {	389✔
78	const agentsCount = store.getAgents().length;	3✔
79	if (agentsCount < 2) {	3✔
80	const msg = agentsCount === 0 ? 'No agents' : 'Only one agent';	2✔
81	showSnackbar(flowId, `${msg} found in the flow`, 'error', 3000);	2✔
82	return false;	2✔
83	}	2✔
84	const [orderedEdges, _] = store.getFlowEdges();	1✔
85	return orderedEdges.length > 0;	1✔
86	};	3✔
87	const onFlowInit = (instance: ReactFlowInstance) => {	389✔
88	store.setRfInstance(instance);	15✔
89	const rootDiv = document.getElementById(`rf-root-${flowId}`);	15✔
90	if (rootDiv) {	15✔
91	const viewport = instance.getViewport();	15✔
92	instance.fitView({	15✔
93	minZoom: viewport.zoom,	15✔
94	maxZoom: viewport.zoom,	15✔
95	includeHiddenNodes: false,	15✔
96	padding: 10,	15✔
97	duration: 100	15✔
98	});	15✔
99	}	15✔
100	};	15✔
101	const handleRun = () => {	389✔
102	if (typeof onRun === 'function') {	3✔
103	if (onRun) {	3✔
104	if (canRun()) {	3✔
105	const flow = onFlowChanged();	1✔
106	if (flow) {	1✔
107	onRun(JSON.stringify(flow));	1✔
108	}	1✔
109	} else {	3✔
110	setModalOpen(true);	2✔
111	}	2✔
112	}	3✔
113	}	3✔
114	};	3✔
115	const deleteNode = (target: Element) => {	389✔
116	const nodeId = target.getAttribute('data-id');	3✔
117	if (nodeId) {	3✔
118	const isAgent = target.classList.contains('react-flow__node-agent');	3✔
119	const isModel = target.classList.contains('react-flow__node-model');	3✔
120	const isSkill = target.classList.contains('react-flow__node-skill');	3✔
121	if (isAgent) {	3✔
122	store.deleteAgent(nodeId);	1✔
123	} else {	3✔
124	if (isModel) {	2✔
125	store.deleteModel(nodeId);	1✔
126	} else {	1✔
127	if (isSkill) {	1✔
128	store.deleteSkill(nodeId);	1✔
129	}	1✔
130	}	1✔
131	}	2✔
132	}	3✔
133	};	3✔
134	const deleteEdge = (target: Element) => {	389✔
135	const edgeId = target.getAttribute('data-id');	1✔
136	if (edgeId) {	1✔
137	store.deleteEdge(edgeId);	1✔
138	}	1✔
139	};	1✔
140	const onDeleteKey = (event: KeyboardEvent) => {	389✔
141	const target = event.target;	4✔
142	const isNode = target instanceof Element && target.classList.contains('react-flow__node');	4✔
143	if (isNode) {	4✔
144	deleteNode(target);	3✔
145	onFlowChanged();	3✔
146	} else {	4✔
147	const isEdge =	1✔
148	target instanceof Element &&	1✔
149	(target.classList.contains('react-flow__edge') \|\| target.classList.contains('edge-data-view'));	1!
150	if (isEdge) {	1✔
151	deleteEdge(target);	1✔
152	onFlowChanged();	1✔
153	}	1✔
154	}	1✔
155	};	4✔
156	const onKeyDown = (event: KeyboardEvent \| undefined) => {	389✔
157	if (event?.key === 'Delete') {	4✔
158	onDeleteKey(event);	4✔
159	}	4✔
160	};	4✔
161	const onDragOver = useCallback((event: React.DragEvent<HTMLDivElement>) => {	389✔
162	event.preventDefault();	4✔
163	event.dataTransfer.dropEffect = 'move';	4✔
164	}, []);	389✔
165	const getIntersectingManager = (intersectingNodes: Node[]) => {	389✔
166	let parent: Node \| undefined;	×
167	const isIntersectingWithManager = intersectingNodes.some(	×
168	node => node.type === 'agent' && node.data.agentType === 'manager'	×
169	);	×
170	if (isIntersectingWithManager) {	×
171	const managerNode = intersectingNodes.find(	×
172	node => node.type === 'agent' && node.data.agentType === 'manager'	×
173	);	×
174	if (managerNode) {	×
175	parent = managerNode;	×
176	}	×
177	}	×
178	return parent;	×
179	};	×
180	const getDroppedAgentParent = (agentType: WaldiezAgentNodeType, position: XYPosition) => {	389✔
181	let parent: Node \| undefined;	4✔
182	if (agentType !== 'manager') {	4✔
183	const { x, y } = position;	2✔
184	const nodeRect = {	2✔
185	x,	2✔
186	y,	2✔
187	width: 100,	2✔
188	height: 100	2✔
189	};	2✔
190	let intersectingNodes: Node[] = [];	2✔
191	try {	2✔
192	intersectingNodes = getIntersectingNodes(nodeRect);	2✔
193	} catch (_) {	2✔
194	// testing/no dom: Cannot read properties of undefined (reading 'parentId')
195	}	2✔
196	if (intersectingNodes.length > 0) {	2!
197	parent = getIntersectingManager(intersectingNodes);	×
198	}	×
199	}	2✔
200	return parent;	4✔
201	};	4✔
202	const getAgentType = (event: React.DragEvent<HTMLDivElement>) => {	389✔
203	const nodeTypeData = event.dataTransfer.getData('application/node');	4✔
204	let agentType: WaldiezAgentNodeType \| undefined;	4✔
205	if (nodeTypeData === 'agent') {	4✔
206	const agentTypeData = event.dataTransfer.getData('application/agent');	4✔
207	if (['user', 'assistant', 'manager'].includes(agentTypeData)) {	4✔
208	agentType = agentTypeData as WaldiezAgentNodeType;	4✔
209	}	4✔
210	}	4✔
211	if (nodeTypeData !== 'agent' \|\| !agentType) {	4!
212	agentType = undefined;	×
213	}	×
214	return agentType;	4✔
215	};	4✔
216	const addAgentNode = (event: React.DragEvent<HTMLDivElement>, agentType: WaldiezAgentNodeType) => {	389✔
217	let position = screenToFlowPosition({	4✔
218	x: event.clientX,	4✔
219	y: event.clientY	4✔
220	});	4✔
221	const parent = getDroppedAgentParent(agentType, position);	4✔
222	if (parent) {	4!
223	position = parent.position;	×
224	}	×
225	const newNode = store.addAgent(agentType, position);	4✔
226	if (parent) {	4!
227	addParentNodeEdge(parent, newNode);	×
228	}	×
229	return newNode;	4✔
230	};	4✔
231	const addParentNodeEdge = (parent: Node, newNode: Node) => {	389✔
232	store.addEdge(parent.id, newNode.id, true);	×
233	setTimeout(() => {	×
234	store.setAgentGroup(newNode.id, parent.id);	×
235	}, 0);	×
236	setTimeout(() => {	×
237	store.reselectNode(parent.id);	×
238	}, 100);	×
239	};	×
240	const onDrop = useCallback(	389✔
241	(event: React.DragEvent<HTMLDivElement>) => {	389✔
242	event.preventDefault();	4✔
243	const agentType = getAgentType(event);	4✔
244	if (!agentType) {	4!
245	return;	×
246	}	×
247	addAgentNode(event, agentType);	4✔
248	if (selectedNodeType !== 'agent') {	4!
NEW 249	setSelectedNodeType('agent');	×
NEW 250	store.showNodes('agent');	×
NEW 251	}	×
252	onFlowChanged();	4✔
253	},	4✔
254	[screenToFlowPosition]	389✔
255	);	389✔
256	const onNodeTypeSelected = (nodeType: WaldiezNodeType) => {	389✔
257	setSelectedNodeType(nodeType);	13✔
258	store.showNodes(nodeType);	13✔
259	};	13✔
260	const onAddNode = () => {	389✔
261	if (selectedNodeType === 'model') {	8✔
262	store.addModel();	4✔
263	onFlowChanged();	4✔
264	} else if (selectedNodeType === 'skill') {	4✔
265	store.addSkill();	4✔
266	onFlowChanged();	4✔
267	}	4✔
268	};	8✔
269	const onNodesChange = (changes: NodeChange<Node>[]) => {	389✔
270	store.onNodesChange(changes);	1,215✔
271	onFlowChanged();	1,215✔
272	};	1,215✔
273	const onEdgesChange = (changes: EdgeChange<Edge>[]) => {	389✔
274	store.onEdgesChange(changes);	2✔
275	onFlowChanged();	2✔
276	};	2✔
277	const onModalSubmit = (data: {	389✔
278	name: string;
279	description: string;
280	tags: string[];
281	requirements: string[];
282	orders: { id: string; order: number }[];
UNCOV 283	}) => {	×
UNCOV 284	store.updateFlow(data);	×
UNCOV 285	store.updateFlowOrder(data.orders);	×
286	// setModalOpen(false);
UNCOV 287	onFlowChanged();	×
UNCOV 288	};	×
289	const onNodeDoubleClick = (event: React.MouseEvent, node: Node) => {	389✔
290	const target = event.target;	4✔
291	if (target instanceof Element && target.tagName === 'TEXTAREA') {	4✔
292	return;	1✔
293	}	1✔
294	store.onNodeDoubleClick(event, node);	3✔
295	};	4✔
296	const includeRunButton = typeof onRun === 'function';	389✔
297	const onImport = (contents: any) => {	389✔
298	store.importFlow(contents, selectedNodeType);	1✔
299	setSelectedNodeType('agent');	1✔
300	store.showNodes('agent');	1✔
301	onFlowChanged();	1✔
302	};	1✔
303	const onThemeToggle = () => {	389✔
304	setIsDark(!isDark);	1✔
305	toggleThemeMode(flowId, storageId);	1✔
306	};	1✔
307	const onViewportChange = (viewport: Viewport) => {	389✔
308	store.onViewportChange(viewport, selectedNodeType);	156✔
309	};	156✔
310	return (	389✔
311	<WaldiezFlowView	389✔
312	flowId={flowId}	389✔
313	storageId={storageId}	389✔
314	darkMode={isDark}	389✔
315	store={store}	389✔
316	selectedNodeType={selectedNodeType}	389✔
317	isModalOpen={isModalOpen}	389✔
318	inputPrompt={inputPrompt}	389✔
319	includeRunButton={includeRunButton}	389✔
320	onThemeToggle={onThemeToggle}	389✔
321	onCloseModal={setModalOpen.bind(null, false)}	389✔
322	getFlow={getFlow}	389✔
323	onEditFlow={setModalOpen.bind(null, true)}	389✔
324	onImport={onImport}	389✔
325	onUserInput={onUserInput}	389✔
326	onAddNode={onAddNode}	389✔
327	onNodesChange={onNodesChange}	389✔
328	onNodeDoubleClick={onNodeDoubleClick}	389✔
329	onEdgesChange={onEdgesChange}	389✔
330	onViewportChange={onViewportChange}	389✔
331	onRun={handleRun}	389✔
332	onModalSubmit={onModalSubmit}	389✔
333	onNodeTypeSelected={onNodeTypeSelected}	389✔
334	onFlowInit={onFlowInit}	389✔
335	onDrop={onDrop}	389✔
336	onDragOver={onDragOver}	389✔
337	onkeydown={onKeyDown}	389✔
338	/>	389✔
339	);
340	};	389✔

waldiez / react / 11666592870

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous