getting connected nodes

space_flow/src/CustomNodes/GenericNode/index.tsx

@@ -10,7 +10,6 @@ import { nodeColors, nodeIcons, snakeToNormalCase } from "../../utils";
 import Tooltip from "../../components/TooltipComponent";
 
 export default function GenericNode({ data }) {
-  console.log(data)
   const Icon = nodeIcons[data.type];
   return (
     <div className="prompt-node relative bg-white w-96 rounded-lg solid border flex flex-col justify-center">

space_flow/src/pages/FlowPage/index.tsx

@@ -11,19 +11,12 @@ import ExtraSidebar from "./components/extraSidebarComponent";
 import Chat from "../../components/chatComponent";
 import GenericNode from "../../CustomNodes/GenericNode";
 import connection from "./components/connection";
+import { getConnectedNodes } from "../../utils";
 const nodeTypes = {
   genericNode:GenericNode,
 };
 
 export default function FlowPage() {
-  // getPrompts().then(result=>result.forEach(prompt=>console.log(prompt)))
-  // getChains().then(result=>console.log(result))
-  // getAgents().then(result=>console.log(result))
-  // getMemories().then(result=>console.log(result))
-  // getModels().then(result=>result.forEach(model=>console.log(model)))
-
-  // outside component to avoid render trigger
-
   
 
   const reactFlowWrapper = useRef(null);
@@ -43,8 +36,13 @@ export default function FlowPage() {
   const [edges, setEdges, onEdgesChange] = useEdgesState([]);
   const [reactFlowInstance, setReactFlowInstance] = useState(null);
   const onConnect = useCallback(
-    (params) => setEdges((eds) => addEdge(params, eds)),
-    []
+    (params) => {
+      console.log(params)
+      console.log(reactFlowInstance.getNodes())
+      console.log(getConnectedNodes(params,reactFlowInstance.getNodes()))
+      setEdges((eds) => addEdge({...params,style:{stroke:"red"}}, eds))
+    },
+    [reactFlowInstance]
   );
   const onDragOver = useCallback((event) => {
     event.preventDefault();

space_flow/src/utils.ts

@@ -1,4 +1,5 @@
 import { RocketLaunchIcon, LinkIcon, CpuChipIcon, LightBulbIcon, CommandLineIcon, WrenchScrewdriverIcon } from "@heroicons/react/24/outline";
+import { Edge, Node } from "reactflow";
 
 export function classNames(...classes) {
     return classes.filter(Boolean).join(" ");
@@ -290,4 +291,11 @@ export function classNames(...classes) {
   export function roundNumber(x, decimals){
     return Math.round(x * Math.pow(10, decimals))/Math.pow(10, decimals)
   }
-  
+  
+
+  export function getConnectedNodes(edge:Edge,nodes:Array<Node>):Array<Node>{
+    const sourceId = edge.source;
+    const targetId = edge.target;
+    const connectedNodes = nodes.filter(node=>node.id===sourceId||node.id===targetId)
+    return connectedNodes
+  }