From 52df90c1109f3c2dd84bfb10281579d5aa9ff680 Mon Sep 17 00:00:00 2001 From: anovazzi1 Date: Mon, 11 Mar 2024 17:59:18 -0300 Subject: [PATCH] Fix and updateNodeOnScreen --- .../src/CustomNodes/GenericNode/index.tsx | 14 ++++---------- .../components/nodeToolbarComponent/index.tsx | 4 +--- src/frontend/src/stores/flowStore.ts | 15 --------------- src/frontend/src/types/components/index.ts | 5 +++-- src/frontend/src/types/zustand/flow/index.ts | 3 --- 5 files changed, 8 insertions(+), 33 deletions(-) diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx index 122ea7d3f..38de618de 100644 --- a/src/frontend/src/CustomNodes/GenericNode/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx @@ -47,11 +47,7 @@ export default function GenericNode({ const flowPool = useFlowStore((state) => state.flowPool); const buildFlow = useFlowStore((state) => state.buildFlow); const setNode = useFlowStore((state) => state.setNode); - const addToOutdatedNodes = useFlowStore((state) => state.addToOutdatedNodes); const updateNodeInternals = useUpdateNodeInternals(); - const removeFromOutdatedNodes = useFlowStore( - (state) => state.removeFromOutdatedNodes - ); const setErrorData = useAlertStore((state) => state.setErrorData); const name = nodeIconsLucide[data.type] ? data.type : types[data.type]; const [inputName, setInputName] = useState(false); @@ -79,20 +75,16 @@ export default function GenericNode({ // This one should run only once // first check if data.type in NATIVE_CATEGORIES // if not return - if (!NATIVE_CATEGORIES.includes(types[data.type])) return; + if (!NATIVE_CATEGORIES.includes(types[data.type]) || !data.node?.template?.code?.value) return; const thisNodeTemplate = templates[data.type].template; // if the template does not have a code key // return if (!thisNodeTemplate.code) return; - const currentCode = thisNodeTemplate.code?.value; const thisNodesCode = data.node!.template?.code?.value; if (currentCode !== thisNodesCode) { - addToOutdatedNodes(data.id); setIsOutdated(true); } else { - // remove the node from the outdatedNodes - removeFromOutdatedNodes(data.id); setIsOutdated(false); } // template.code can be undefined @@ -111,13 +103,14 @@ export default function GenericNode({ }; newNode.data.node.template[name].value = code; + setIsOutdated(false); return newNode; }); updateNodeInternals(data.id); }, - [data.id, data.node, setNode] + [data.id, data.node, setNode,setIsOutdated] ); if (!data.node!.template) { @@ -361,6 +354,7 @@ export default function GenericNode({ openAdvancedModal={false} onCloseAdvancedModal={() => {}} updateNodeCode={updateNodeCode} + isOutdated={isOutdated} selected={selected} > diff --git a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx index 21b07d813..fa2c4757b 100644 --- a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx @@ -43,6 +43,7 @@ export default function NodeToolbarComponent({ updateNodeCode, setShowState, onCloseAdvancedModal, + isOutdated, }: nodeToolbarPropsType): JSX.Element { const nodeLength = Object.keys(data.node!.template).filter( (templateField) => @@ -83,9 +84,6 @@ export default function NodeToolbarComponent({ const [showModalAdvanced, setShowModalAdvanced] = useState(false); const [showconfirmShare, setShowconfirmShare] = useState(false); const [showOverrideModal, setShowOverrideModal] = useState(false); - const isOutdated = useFlowStore((state) => state.outDatedNodes).includes( - data.id - ); const [flowComponent, setFlowComponent] = useState(); const openInNewTab = (url) => { diff --git a/src/frontend/src/stores/flowStore.ts b/src/frontend/src/stores/flowStore.ts index 8a691019f..16f6b75f4 100644 --- a/src/frontend/src/stores/flowStore.ts +++ b/src/frontend/src/stores/flowStore.ts @@ -581,21 +581,6 @@ const useFlowStore = create((set, get) => ({ } }); }, - outDatedNodes: [], - addToOutdatedNodes: (nodeId) => { - // add the nodes to the list of outdated nodes - // without removing the previous ones - let oldOutDatedNodes = get().outDatedNodes; - // filter out the nodes that are already in the list - if (!oldOutDatedNodes.includes(nodeId)) { - set({ outDatedNodes: [...oldOutDatedNodes, nodeId] }); - } - }, - removeFromOutdatedNodes: (nodeId) => { - // remove the nodes from the list of outdated nodes - let oldOutDatedNodes = get().outDatedNodes; - set({ outDatedNodes: oldOutDatedNodes.filter((id) => id !== nodeId) }); - }, })); export default useFlowStore; diff --git a/src/frontend/src/types/components/index.ts b/src/frontend/src/types/components/index.ts index 0f5c056c7..379f5be30 100644 --- a/src/frontend/src/types/components/index.ts +++ b/src/frontend/src/types/components/index.ts @@ -493,10 +493,11 @@ export type nodeToolbarPropsType = { selected: boolean; updateNodeCode?: ( newNodeClass: APIClassType, - code?: string, - name?: string + code: string, + name: string ) => void; setShowState: (show: boolean | SetStateAction) => void; + isOutdated?: boolean; }; export type parsedDataType = { diff --git a/src/frontend/src/types/zustand/flow/index.ts b/src/frontend/src/types/zustand/flow/index.ts index 01cac5516..0f5fe6ecc 100644 --- a/src/frontend/src/types/zustand/flow/index.ts +++ b/src/frontend/src/types/zustand/flow/index.ts @@ -124,7 +124,4 @@ export type FlowStoreType = { data: FlowPoolObjectType | ChatOutputType | chatInputType, buildId?: string ) => void; - outDatedNodes: string[]; - addToOutdatedNodes: (nodeId: string) => void; - removeFromOutdatedNodes: (nodeId: string) => void; };