diff --git a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx index fe5d7ee358a3..48f2273e652c 100644 --- a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx +++ b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx @@ -53,8 +53,7 @@ export const MenuBar = ({}: {}): JSX.Element => { const stopBuilding = useFlowStore((state) => state.stopBuilding); const changesNotSaved = - customStringify(currentFlow) !== customStringify(currentSavedFlow) && - !autoSaving; + customStringify(currentFlow) !== customStringify(currentSavedFlow); const savedText = updatedAt && changesNotSaved diff --git a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx index 3683113ca753..5fb644af47ed 100644 --- a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx @@ -26,7 +26,6 @@ import ReactFlow, { Controls, Edge, NodeDragHandler, - OnMove, OnSelectionChangeParams, SelectionDragHandler, updateEdge, @@ -306,12 +305,6 @@ export default function Page({ view }: { view?: boolean }): JSX.Element { // 👉 you can place your event handlers here }, [takeSnapshot]); - const onMoveEnd: OnMove = useCallback(() => { - // 👇 make moving the canvas undoable - autoSaveFlow(); - updateCurrentFlow({ viewport: reactFlowInstance?.getViewport() }); - }, [takeSnapshot, autoSaveFlow, nodes, edges, reactFlowInstance]); - const onNodeDragStop: NodeDragHandler = useCallback(() => { // 👇 make moving the canvas undoable autoSaveFlow(); @@ -465,7 +458,6 @@ export default function Page({ view }: { view?: boolean }): JSX.Element { onSelectionStart={onSelectionStart} connectionLineComponent={ConnectionLineComponent} onDragOver={onDragOver} - onMoveEnd={onMoveEnd} onNodeDragStop={onNodeDragStop} onDrop={onDrop} onSelectionChange={onSelectionChange} @@ -488,7 +480,6 @@ export default function Page({ view }: { view?: boolean }): JSX.Element { data-testid="add_note" onClick={() => { const wrapper = reactFlowWrapper.current!; - const viewport = reactFlowInstance?.getViewport(); const x = wrapper.getBoundingClientRect().width / 2; const y = wrapper.getBoundingClientRect().height / 2; const nodePosition = diff --git a/src/frontend/src/stores/flowStore.ts b/src/frontend/src/stores/flowStore.ts index 184217d77371..6fa47d093967 100644 --- a/src/frontend/src/stores/flowStore.ts +++ b/src/frontend/src/stores/flowStore.ts @@ -160,7 +160,6 @@ const useFlowStore = create((set, get) => ({ resetFlow: (flow) => { const nodes = flow?.data?.nodes ?? []; const edges = flow?.data?.edges ?? []; - const viewport = flow?.data?.viewport ?? { zoom: 1, x: 0, y: 0 }; let brokenEdges = detectBrokenEdgesEdges(nodes, edges); if (brokenEdges.length > 0) { useAlertStore.getState().setErrorData({ @@ -181,7 +180,6 @@ const useFlowStore = create((set, get) => ({ flowPool: {}, currentFlow: flow, }); - get().reactFlowInstance?.setViewport(viewport); }, setIsBuilding: (isBuilding) => { set({ isBuilding }); @@ -198,16 +196,7 @@ const useFlowStore = create((set, get) => ({ }, setReactFlowInstance: (newState) => { set({ reactFlowInstance: newState }); - const viewport = get().currentFlow?.data?.viewport ?? { - zoom: 1, - x: 0, - y: 0, - }; - if (viewport.x == 0 && viewport.y == 0) { - newState.fitView(); - } else { - newState.setViewport(viewport); - } + get().reactFlowInstance?.fitView(); }, onNodesChange: (changes: NodeChange[]) => { set({ @@ -753,19 +742,18 @@ const useFlowStore = create((set, get) => ({ setCurrentFlow: (flow) => { set({ currentFlow: flow }); }, - updateCurrentFlow: ({ nodes, edges, viewport }) => { + updateCurrentFlow: ({ nodes, edges }) => { set({ currentFlow: { ...get().currentFlow!, data: { nodes: nodes ?? get().currentFlow?.data?.nodes ?? [], edges: edges ?? get().currentFlow?.data?.edges ?? [], - viewport: viewport ?? - get().currentFlow?.data?.viewport ?? { - x: 0, - y: 0, - zoom: 1, - }, + viewport: get().currentFlow?.data?.viewport ?? { + x: 0, + y: 0, + zoom: 1, + }, }, }, });