@@ -7,6 +7,7 @@ export default function Input({title, placeholder, onChange}){
0?value:""}
type="text"
className="block w-full form-input rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm"
placeholder={placeholder}
diff --git a/space_flow/src/pages/FlowPage/components/connection/index.tsx b/space_flow/src/pages/FlowPage/components/connection/index.tsx
new file mode 100644
index 000000000..bcb657c61
--- /dev/null
+++ b/space_flow/src/pages/FlowPage/components/connection/index.tsx
@@ -0,0 +1,50 @@
+import { CSSProperties, FC } from 'react';
+import { Node } from 'reactflow';
+
+interface ConnectionLineComponentProps {
+ fromX: number;
+ fromY: number;
+ fromPosition: string;
+ toX: number;
+ toY: number;
+ fromNode:Node;
+ toPosition: string;
+ connectionLineType: string;
+ connectionLineStyle: CSSProperties;
+}
+
+const ConnectionLineComponent = ({
+ fromX,
+ fromY,
+ fromPosition,
+ toX,
+ toY,
+ toPosition,
+ connectionLineType,
+ fromNode={},
+ connectionLineStyle = {} // provide a default value for connectionLineStyle
+}) => {
+ console.log(fromNode)
+ return (
+
+
+
+
+ );
+};
+
+export default ConnectionLineComponent;
diff --git a/space_flow/src/pages/FlowPage/index.tsx b/space_flow/src/pages/FlowPage/index.tsx
index d99d8866f..c4ab88369 100644
--- a/space_flow/src/pages/FlowPage/index.tsx
+++ b/space_flow/src/pages/FlowPage/index.tsx
@@ -10,7 +10,7 @@ import { locationContext } from "../../contexts/locationContext";
import ExtraSidebar from "./components/extraSidebarComponent";
import Chat from "../../components/chatComponent";
import GenericNode from "../../CustomNodes/GenericNode";
-
+import connection from "./components/connection";
const nodeTypes = {
genericNode:GenericNode,
};
@@ -83,6 +83,7 @@ export default function FlowPage() {
onConnect={onConnect}
onInit={setReactFlowInstance}
nodeTypes={nodeTypes}
+ connectionLineComponent={connection}
onDragOver={onDragOver}
onDrop={onDrop}
fitView