delete logic changed to work even after page refresh

space_flow/src/CustomNodes/BooleanNode/index.tsx

@@ -8,7 +8,7 @@ import { typesContext } from "../../contexts/typesContext";
 
 export default function BooleanNode({ data }) {
   const [enabled, setEnabled] = useState(false);
-  const {types} = useContext(typesContext);
+  const {types, deleteNode} = useContext(typesContext);
   return (
     <div className="prompt-node relative bg-white rounded-lg solid border flex flex-col justify-center">
       <div className="w-full flex items-center justify-between gap-8 p-4 bg-gray-50 border-b ">
@@ -21,7 +21,7 @@ export default function BooleanNode({ data }) {
         </div>
         <button
           onClick={() => {
-            data.onDelete(data);
+            deleteNode(data.id);
           }}
         >
           <TrashIcon className="text-gray-600 w-6 h-6 hover:text-red-500"></TrashIcon>

space_flow/src/CustomNodes/GenericNode/index.tsx

@@ -11,8 +11,7 @@ import { typesContext } from "../../contexts/typesContext";
 import { useContext } from "react";
 
 export default function GenericNode({ data }) {
-  const {types} = useContext(typesContext);
-  console.log(types, data.type)
+  const {types, deleteNode} = useContext(typesContext);
   const Icon = nodeIcons[types[data.type]];
 
 
@@ -26,7 +25,7 @@ export default function GenericNode({ data }) {
           />
           <div className="truncate">{data.type}</div>
         </div>
-        <button onClick={data.onDelete}>
+        <button onClick={() => {deleteNode(data.id)}}>
           <TrashIcon className="w-6 h-6 hover:text-red-500"></TrashIcon>
         </button>
       </div>

space_flow/src/CustomNodes/InputNode/index.tsx

@@ -12,7 +12,7 @@ import Tooltip from "../../components/TooltipComponent";
 import { typesContext } from "../../contexts/typesContext";
 
 export default function InputNode({ data }) {
-  const {types} = useContext(typesContext);
+  const {types, deleteNode} = useContext(typesContext);
   return (
     <div className="prompt-node relative bg-white w-96 rounded-lg solid border flex flex-col justify-center">
       <Tooltip title="Prefix: str">
@@ -38,7 +38,7 @@ export default function InputNode({ data }) {
         </div>
         <button
           onClick={() => {
-            data.onDelete(data);
+            deleteNode(data.id)
           }}
         >
           <TrashIcon className="text-gray-600 w-6 h-6 hover:text-red-500"></TrashIcon>

space_flow/src/contexts/typesContext.tsx

@@ -5,6 +5,7 @@ type typesContextType=
 {
     reactFlowInstance: ReactFlowInstance;
     setReactFlowInstance: any;
+    deleteNode:(idx:number)=>void;
     types: {};
     setTypes:(newState:{})=>void;
 }
@@ -12,6 +13,7 @@ type typesContextType=
 const initialValue= {
     reactFlowInstance: null,
     setReactFlowInstance: ()=>{},
+    deleteNode: ()=>{},
     types: {},
     setTypes:()=>{},
 }
@@ -21,8 +23,13 @@ export const typesContext = createContext<typesContextType>(initialValue);
 export function TypesProvider({children}){
     const [types, setTypes] = useState({});
     const [reactFlowInstance, setReactFlowInstance] = useState(null);
+    function deleteNode(idx){
+        reactFlowInstance.setNodes(
+            reactFlowInstance.getNodes().filter((n) => n.id !== idx)
+          );
+    }
     return (
-        <typesContext.Provider value={{ types, setTypes, reactFlowInstance, setReactFlowInstance}}>
+        <typesContext.Provider value={{ types, setTypes, reactFlowInstance, setReactFlowInstance, deleteNode}}>
             {children}
         </typesContext.Provider>
     )

space_flow/src/pages/FlowPage/components/extraSidebarComponent/index.tsx

@@ -12,7 +12,7 @@ import { typesContext } from "../../../../contexts/typesContext";
 
 export default function ExtraSidebar() {
   const [data, setData] = useState({});
-  const { setTypes, types } = useContext(typesContext);
+  const { setTypes} = useContext(typesContext);
 
   async function getTypes(){
     let d = await getAll();
@@ -43,30 +43,6 @@ export default function ExtraSidebar() {
   }, []);
 
 
-  useEffect(() => {
-    if(data){
-      setTypes(
-        Object.keys(data).reduce(
-          (acc, curr) => {
-            Object.keys(data[curr]).forEach((c) => {
-              acc[c] = curr;
-              data[curr][c].base_classes?.forEach((b) => {
-                acc[b] = curr;
-              });
-            });
-            return acc;
-          },
-          {
-            str: "advanced",
-            bool: "advanced",
-            chatOutput: "chat",
-            chatInput: "chat",
-          }
-        )
-      );
-    }
-  }, [data, setTypes])
-
   function onDragStart(event: React.DragEvent<any>, data) {
     event.dataTransfer.effectAllowed = "move";
     event.dataTransfer.setData("json", JSON.stringify(data));

space_flow/src/pages/FlowPage/index.tsx

@@ -133,11 +133,6 @@ export default function FlowPage({ flow }) {
             ...data,
             id: newId,
             value: null,
-            onDelete: () => {
-              setNodes(
-                reactFlowInstance.getNodes().filter((n) => n.id !== newId)
-              );
-            },
           },
         };
         setNodes((nds) => nds.concat(newNode));
@@ -153,7 +148,7 @@ export default function FlowPage({ flow }) {
 
   return (
     <div className="w-full h-full" ref={reactFlowWrapper}>
-      {Object.keys(types).length > 4 ? (
+      {Object.keys(types).length > 0 ? (
         <>
           <ReactFlow
             nodes={nodes}