From 633881c652a156d12f3ac91e48eb265f3129300c Mon Sep 17 00:00:00 2001 From: anovazzi1 Date: Mon, 18 Mar 2024 16:39:24 -0300 Subject: [PATCH 01/26] Add setSuccessData function to handleAddFlow and add duplicate flow functionality --- .../components/menuBar/index.tsx | 29 ++++++++++++++++--- 1 file changed, 25 insertions(+), 4 deletions(-) diff --git a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx index 2cd06f65c..8faf442db 100644 --- a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx +++ b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx @@ -29,6 +29,7 @@ export const MenuBar = ({ const addFlow = useFlowsManagerStore((state) => state.addFlow); const currentFlow = useFlowsManagerStore((state) => state.currentFlow); const setErrorData = useAlertStore((state) => state.setErrorData); + const setSuccessData = useAlertStore((state) => state.setSuccessData); const undo = useFlowsManagerStore((state) => state.undo); const redo = useFlowsManagerStore((state) => state.redo); const saveLoading = useFlowsManagerStore((state) => state.saveLoading); @@ -38,11 +39,22 @@ export const MenuBar = ({ const navigate = useNavigate(); const isBuilding = useFlowStore((state) => state.isBuilding); - function handleAddFlow() { + function handleAddFlow(duplicate?: boolean) { try { - addFlow(true).then((id) => { - navigate("/flow/" + id); - }); + if(duplicate) { + if (!currentFlow) { + throw new Error("No flow to duplicate"); + } + addFlow(true, currentFlow).then((_) => { + setSuccessData({title:"Flow duplicated successfully"}); + }); + } + else + { + addFlow(true).then((id) => { + navigate("/flow/" + id); + }); + } } catch (err) { setErrorData(err as { title: string; list?: Array }); } @@ -88,6 +100,15 @@ export const MenuBar = ({ New + { + handleAddFlow(true); + }} + className="cursor-pointer" + > + + Duplicate + { From 35198a3abb75f95a169e3e29e6c64ae43529eccf Mon Sep 17 00:00:00 2001 From: cristhianzl Date: Tue, 19 Mar 2024 15:00:46 -0300 Subject: [PATCH 02/26] =?UTF-8?q?=E2=9C=A8=20(codeAreaModal/index.tsx):=20?= =?UTF-8?q?add=20event=20listener=20to=20prevent=20the=20Escape=20key=20fr?= =?UTF-8?q?om=20closing=20the=20modal=20=F0=9F=93=9D=20(codeAreaModal/inde?= =?UTF-8?q?x.tsx):=20improve=20code=20readability=20by=20adding=20line=20b?= =?UTF-8?q?reaks=20and=20indentation=20for=20better=20code=20organization?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/modals/codeAreaModal/index.tsx | 140 +++++++++--------- 1 file changed, 74 insertions(+), 66 deletions(-) diff --git a/src/frontend/src/modals/codeAreaModal/index.tsx b/src/frontend/src/modals/codeAreaModal/index.tsx index e68592efa..2766853f8 100644 --- a/src/frontend/src/modals/codeAreaModal/index.tsx +++ b/src/frontend/src/modals/codeAreaModal/index.tsx @@ -146,75 +146,83 @@ export default function CodeAreaModal({ setCode(value); }, [value, open]); + const handlePreventEsc = (e: React.KeyboardEvent) => { + if (e.key === "Escape") { + e.preventDefault(); + } + }; + return ( - - {children} - - {EDIT_CODE_TITLE} - - - -
-
- { - setCode(value); - }} - className="h-full w-full rounded-lg border-[1px] border-gray-300 custom-scroll dark:border-gray-600" - /> -
-
-
-

- {error?.detail?.error} -

-
- - {error?.detail?.traceback} - +
handlePreventEsc(e)}> + + {children} + + {EDIT_CODE_TITLE} + + + +
+
+ { + setCode(value); + }} + className="h-full w-full rounded-lg border-[1px] border-gray-300 custom-scroll dark:border-gray-600" + /> +
+
+
+

+ {error?.detail?.error} +

+
+ + {error?.detail?.traceback} + +
+
+ +
-
- -
-
- - + + +
); } From 19f60ba17a6a265e25d966f5e16715014477e6ad Mon Sep 17 00:00:00 2001 From: igorrCarvalho Date: Tue, 19 Mar 2024 16:45:57 -0300 Subject: [PATCH 03/26] Feat: Add shortcut to group node (ctrl G) --- .../components/PageComponent/index.tsx | 54 ++++++++++++++++++- 1 file changed, 53 insertions(+), 1 deletion(-) diff --git a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx index a05803359..e283a01e3 100644 --- a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx @@ -97,6 +97,58 @@ export default function Page({ useEffect(() => { const onKeyDown = (event: KeyboardEvent) => { const selectedNode = nodes.filter((obj) => obj.selected); + if ( + selectionMenuVisible && + (event.ctrlKey || event.metaKey) && + event.key === "g" + ) { + event.preventDefault(); + takeSnapshot(); + if ( + validateSelection(lastSelection!, edges).length === 0 + ) { + const { newFlow, removedEdges } = generateFlow( + lastSelection!, + nodes, + edges, + getRandomName() + ); + const newGroupNode = generateNodeFromFlow( + newFlow, + getNodeId + ); + const newEdges = reconnectEdges( + newGroupNode, + removedEdges + ); + setNodes((oldNodes) => [ + ...oldNodes.filter( + (oldNodes) => + !lastSelection?.nodes.some( + (selectionNode) => + selectionNode.id === oldNodes.id + ) + ), + newGroupNode, + ]); + setEdges((oldEdges) => [ + ...oldEdges.filter( + (oldEdge) => + !lastSelection!.nodes.some( + (selectionNode) => + selectionNode.id === oldEdge.target || + selectionNode.id === oldEdge.source + ) + ), + ...newEdges, + ]); + } else { + setErrorData({ + title: INVALID_SELECTION_ERROR_ALERT, + list: validateSelection(lastSelection!, edges), + }); + } + } if ( (event.ctrlKey || event.metaKey) && event.key === "p" && @@ -201,7 +253,7 @@ export default function Page({ document.removeEventListener("keydown", onKeyDown); document.removeEventListener("mousemove", handleMouseMove); }; - }, [lastCopiedSelection, lastSelection, takeSnapshot]); + }, [lastCopiedSelection, lastSelection, takeSnapshot, selectionMenuVisible]); useEffect(() => { if (reactFlowInstance && currentFlowId) { From a02b2e1776f9eff20eadf939139a08f2cd99afa2 Mon Sep 17 00:00:00 2001 From: anovazzi1 Date: Tue, 19 Mar 2024 18:08:21 -0300 Subject: [PATCH 04/26] Fix flow duplication and navigation bug in MenuBar component --- .../components/headerComponent/components/menuBar/index.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx index 8faf442db..eb242bebf 100644 --- a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx +++ b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx @@ -45,8 +45,9 @@ export const MenuBar = ({ if (!currentFlow) { throw new Error("No flow to duplicate"); } - addFlow(true, currentFlow).then((_) => { + addFlow(true, currentFlow).then((id) => { setSuccessData({title:"Flow duplicated successfully"}); + navigate("/flow/" + id); }); } else @@ -74,7 +75,7 @@ export const MenuBar = ({