diff --git a/space_flow/src/contexts/tabsContext.tsx b/space_flow/src/contexts/tabsContext.tsx index 6dcf32c47..76aac3106 100644 --- a/space_flow/src/contexts/tabsContext.tsx +++ b/space_flow/src/contexts/tabsContext.tsx @@ -9,6 +9,8 @@ type TabsContextType={ removeFlow:(id:string)=>void; addFlow:()=>void; updateFlow:(newFlow:flow)=>void; + setNodeId:(newState:any)=>void; + nodeId:number; } const TabsContextInitialValue = { @@ -17,7 +19,9 @@ const TabsContextInitialValue = { flows:[], removeFlow:(id:string)=>{}, addFlow:()=>{}, - updateFlow:(newFlow:flow)=>{} + updateFlow:(newFlow:flow)=>{}, + setNodeId:(newState:any)=>{}, + nodeId:0, } @@ -28,10 +32,11 @@ export function TabsProvider({children}){ const [tabIndex,setTabIndex] = useState(0) const [flows,setFlows] = useState>([]) const [id, setId] = useState(0); + const [nodeId, setNodeId] = useState(0); useEffect(() => { if(flows.length !== 0) - window.localStorage.setItem('tabsData', JSON.stringify({tabIndex, flows, id})); - }, [flows, id, tabIndex]); + window.localStorage.setItem('tabsData', JSON.stringify({tabIndex, flows, id, nodeId})); + }, [flows, id, nodeId, tabIndex]); useEffect(() => { let cookie = window.localStorage.getItem('tabsData'); @@ -40,6 +45,7 @@ export function TabsProvider({children}){ setTabIndex(cookieObject.tabIndex); setFlows(cookieObject.flows) setId(cookieObject.id) + setNodeId(cookieObject.nodeId) } }, []) @@ -83,7 +89,7 @@ export function TabsProvider({children}){ } return( - + {children} ) diff --git a/space_flow/src/contexts/typesContext.tsx b/space_flow/src/contexts/typesContext.tsx index bcb128099..5f83a4e33 100644 --- a/space_flow/src/contexts/typesContext.tsx +++ b/space_flow/src/contexts/typesContext.tsx @@ -8,6 +8,7 @@ type typesContextType= deleteNode:(idx:number)=>void; types: {}; setTypes:(newState:{})=>void; + } const initialValue= { diff --git a/space_flow/src/pages/FlowPage/index.tsx b/space_flow/src/pages/FlowPage/index.tsx index 381673432..f05749384 100644 --- a/space_flow/src/pages/FlowPage/index.tsx +++ b/space_flow/src/pages/FlowPage/index.tsx @@ -32,11 +32,16 @@ const nodeTypes = { var _ = require("lodash"); export default function FlowPage({ flow }) { - const { updateFlow } = useContext(TabsContext); - const { types, reactFlowInstance, setReactFlowInstance } = useContext(typesContext); + const { updateFlow, nodeId, setNodeId } = useContext(TabsContext); + const { types, reactFlowInstance, setReactFlowInstance } = + useContext(typesContext); const reactFlowWrapper = useRef(null); - const getId = () => `dndnode_${_.uniqueId()}`; + const getId = () => { + console.log(nodeId); + setNodeId(old => old + 1); + return `dndnode_${nodeId}`; + }; const { setExtraComponent, setExtraNavigation } = useContext(locationContext); const { setErrorData } = useContext(alertContext);