diff --git a/space_flow/src/CustomNodes/ModelNode/index.tsx b/space_flow/src/CustomNodes/ModelNode/index.tsx new file mode 100644 index 000000000..542fe7f88 --- /dev/null +++ b/space_flow/src/CustomNodes/ModelNode/index.tsx @@ -0,0 +1,17 @@ +import { Handle, Position } from "reactflow"; + +export default function ModelNode({ data }) { + console.log(data) + return ( +
+ + +
+ {data.llm.model_name} +
+ +
+ ); +} diff --git a/space_flow/src/CustomNodes/PromptNode/index.tsx b/space_flow/src/CustomNodes/PromptNode/index.tsx index ef25fa932..c9f26d21e 100644 --- a/space_flow/src/CustomNodes/PromptNode/index.tsx +++ b/space_flow/src/CustomNodes/PromptNode/index.tsx @@ -10,16 +10,14 @@ export default function PromptNode({ data }) { onClick={()=>openPopUp(
teste
)} className="prompt-Node relative bg-white h-16 w-40 border rounded-sm solid border-black flex flex-col justify-center" > - +
- {" "} {data.template}
- + ); } diff --git a/space_flow/src/components/sidebar.tsx b/space_flow/src/components/sidebar.tsx index d7b9333c9..f56b5f74d 100644 --- a/space_flow/src/components/sidebar.tsx +++ b/space_flow/src/components/sidebar.tsx @@ -1,16 +1,25 @@ import { prompt } from "../data_assets/prompt"; +import { llm_chain } from "../data_assets/llm_chain"; export function Sidebar(){ function onDragStart(event:React.DragEvent,nodeType){ + let json; event.dataTransfer.setData('application/reactflow',nodeType) event.dataTransfer.effectAllowed = 'move' - event.dataTransfer.setData('json',JSON.stringify(prompt)); + if(nodeType==="promptNode"){ + json = JSON.stringify(prompt) + } + if(nodeType==="modelNode"){ + json = JSON.stringify(llm_chain) + } + event.dataTransfer.setData('json',json); } return(
onDragStart(event,'promptNode')}> prompt Node
+
onDragStart(event,'modelNode')}> Model Node
) } \ No newline at end of file diff --git a/space_flow/src/flow/index.tsx b/space_flow/src/flow/index.tsx index 94a47db7b..f2e07245c 100644 --- a/space_flow/src/flow/index.tsx +++ b/space_flow/src/flow/index.tsx @@ -7,8 +7,9 @@ import '../CustomNodes/inputTextFolder/inputText.css' import PromptNode from '../CustomNodes/PromptNode'; import { prompt } from '../data_assets/prompt'; import { Sidebar } from '../components/sidebar'; +import ModelNode from '../CustomNodes/ModelNode'; // outside component to avoid render trigger - const nodeTypes = {textUpdater:TextUpdaterNode, promptNode:PromptNode} + const nodeTypes = {textUpdater:TextUpdaterNode, promptNode:PromptNode,modelNode:ModelNode} const rfStyle={ backgroundCOlor:"#B8CEFF"