minor fix

This commit is contained in:
Ian Arawjo 2023-05-01 11:12:07 -04:00
parent 1a4a5db239
commit c663c7ab92
4 changed files with 26 additions and 5 deletions

View File

@ -13,6 +13,7 @@
"@mantine/core": "^6.0.9",
"@reactflow/background": "^11.2.0",
"@reactflow/controls": "^11.1.11",
"@reactflow/core": "^11.7.0",
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",

View File

@ -8,6 +8,7 @@
"@mantine/core": "^6.0.9",
"@reactflow/background": "^11.2.0",
"@reactflow/controls": "^11.1.11",
"@reactflow/core": "^11.7.0",
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",

View File

@ -6,6 +6,7 @@ import ReactFlow, {
Controls,
Background,
useReactFlow,
useViewport
} from 'react-flow-renderer';
// import axios from 'axios';
import TextFieldsNode from './TextFieldsNode'; // Import a custom node
@ -47,6 +48,7 @@ const App = () => {
// Get nodes, edges, etc. state from the Zustand store:
const { nodes, edges, onNodesChange, onEdgesChange, onConnect, addNode, setNodes, setEdges } = useStore(selector, shallow);
// const [nodes, setNodes] = useState(initialNodes);
// const [edges, setEdges] = useState(initialEdges);
@ -103,20 +105,36 @@ const App = () => {
console.log(event);
};
const getWindowSize = () => ({width: window.innerWidth, height: window.innerHeight});
const getWindowCenter = () => {
const { width, height } = getWindowSize();
return ({centerX: width/2.0, centerY: height/2.0});
}
const getViewportCenter = () => {
const { centerX, centerY } = getWindowCenter();
const { x, y, zoom } = rfInstance.getViewport();
return ({x: -x+centerX, y:-y+centerY});
}
const addTextFieldsNode = (event) => {
addNode({ id: 'textFieldsNode-'+Date.now(), type: 'textfields', data: {}, position: { x: 25, y: 50 } });
const { x, y } = getViewportCenter();
addNode({ id: 'textFieldsNode-'+Date.now(), type: 'textfields', data: {}, position: {x: x-200, y:y-100} });
};
const addPromptNode = (event) => {
addNode({ id: 'promptNode-'+Date.now(), type: 'prompt', data: { prompt: '' }, position: { x: 25, y: 50 } });
const { x, y } = getViewportCenter();
addNode({ id: 'promptNode-'+Date.now(), type: 'prompt', data: { prompt: '' }, position: {x: x-200, y:y-100} });
};
const addEvalNode = (event) => {
addNode({ id: 'evalNode-'+Date.now(), type: 'evaluator', data: { code: "def evaluate(response):\n return len(response.text)" }, position: { x: 25, y: 50 } });
const { x, y } = getViewportCenter();
addNode({ id: 'evalNode-'+Date.now(), type: 'evaluator', data: { code: "def evaluate(response):\n return len(response.text)" }, position: {x: x-200, y:y-100} });
};
const addVisNode = (event) => {
addNode({ id: 'visNode-'+Date.now(), type: 'vis', data: {}, position: { x: 25, y: 50 } });
const { x, y } = getViewportCenter();
addNode({ id: 'visNode-'+Date.now(), type: 'vis', data: {}, position: {x: x-200, y:y-100} });
};
const addInspectNode = (event) => {
addNode({ id: 'inspectNode-'+Date.now(), type: 'inspect', data: {}, position: { x: 25, y: 50 } });
const { x, y } = getViewportCenter();
addNode({ id: 'inspectNode-'+Date.now(), type: 'inspect', data: {}, position: {x: x-200, y:y-100} });
};
// Saving / loading

View File

@ -11,6 +11,7 @@ import {
// OnConnect,
applyNodeChanges,
applyEdgeChanges,
useViewport,
} from 'react-flow-renderer';
// We need to create a unique ID using the current date,