Merge branch 'tabs' into dev

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/components/parameterComponent/index.tsx

@@ -5,11 +5,12 @@ import {
   nodeColors,
   snakeToNormalCase,
 } from "../../../../utils";
-import { useEffect, useRef, useState } from "react";
+import { useContext, useEffect, useRef, useState } from "react";
 import InputComponent from "../../../../components/inputComponent";
 import ToggleComponent from "../../../../components/toggleComponent";
 import InputListComponent from "../../../../components/inputListComponent";
 import TextAreaComponent from "../../../../components/textAreaComponent";
+import { typesContext } from "../../../../contexts/typesContext";
 
 export default function ParameterComponent({
   left,
@@ -38,7 +39,8 @@ export default function ParameterComponent({
   }, [data.id, position, updateNodeInternals]);
 
   const [enabled, setEnabled] = useState(data.node.template[name]?.value ?? false);
-  let disabled = data.reactFlowInstance.getEdges().some((e) => (e.targetHandle === id));
+  const {reactFlowInstance} = useContext(typesContext);
+  let disabled = reactFlowInstance?.getEdges().some((e) => (e.targetHandle === id)) ?? false;
 
   return (
     <div ref={ref} className="w-full flex flex-wrap justify-between items-center bg-gray-50 mt-1 px-5 py-2">
@@ -50,7 +52,7 @@ export default function ParameterComponent({
             position={left ? Position.Left : Position.Right}
             id={id}
             isValidConnection={(connection) =>
-              isValidConnection(data, connection)
+              isValidConnection(connection,reactFlowInstance)
             }
             className={
               (left ? "-ml-0.5 " : "-mr-0.5 ") +

space_flow/src/CustomNodes/GenericNode/index.tsx

@@ -11,9 +11,10 @@ import { typesContext } from "../../contexts/typesContext";
 import { useContext } from "react";
 
 export default function GenericNode({ data }) {
-  const {types} = useContext(typesContext);
+  const {types, deleteNode} = useContext(typesContext);
   const Icon = nodeIcons[types[data.type]];
 
+
   return (
     <div className="prompt-node relative bg-white w-96 rounded-lg solid border flex flex-col justify-center">
       <div className="w-full flex items-center justify-between p-4 gap-8 bg-gray-50 border-b ">
@@ -24,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

@@ -13,7 +13,7 @@ import { typesContext } from "../../contexts/typesContext";
 import TextAreaComponent from "../../components/textAreaComponent";
 
 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">
@@ -39,7 +39,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>