chore(tests): wording graph => flow

This commit is contained in:
moklick
2020-07-15 10:34:52 +02:00
parent b51a25191f
commit 6f87d848d7
11 changed files with 46 additions and 64 deletions
+13 -22
View File
@@ -3,30 +3,29 @@ import React, { useState } from 'react';
import ReactFlow, { removeElements, addEdge, MiniMap, isNode, Controls, Background } from 'react-flow-renderer';
import { getElements } from './utils';
const onLoad = reactFlowInstance => {
const onLoad = (reactFlowInstance) => {
reactFlowInstance.fitView();
console.log(reactFlowInstance.getElements());
}
};
const initialElements = getElements(10, 10);
const StressGraph = () => {
const StressFlow = () => {
const [elements, setElements] = useState(initialElements);
const onElementsRemove = (elementsToRemove) =>
setElements(els => removeElements(elementsToRemove, els));
const onConnect = (params) => setElements(els => addEdge(params, els));
const onElementsRemove = (elementsToRemove) => setElements((els) => removeElements(elementsToRemove, els));
const onConnect = (params) => setElements((els) => addEdge(params, els));
const updatePos = () => {
setElements(elms => {
return elms.map(el => {
setElements((elms) => {
return elms.map((el) => {
if (isNode(el)) {
return {
...el,
position: {
x: Math.random() * window.innerWidth,
y: Math.random() * window.innerHeight
}
y: Math.random() * window.innerHeight,
},
};
}
@@ -36,24 +35,16 @@ const StressGraph = () => {
};
return (
<ReactFlow
elements={elements}
onLoad={onLoad}
onElementsRemove={onElementsRemove}
onConnect={onConnect}
>
<ReactFlow elements={elements} onLoad={onLoad} onElementsRemove={onElementsRemove} onConnect={onConnect}>
<MiniMap />
<Controls />
<Background />
<button
onClick={updatePos}
style={{ position: 'absolute', right: 10, top: 30, zIndex: 4 }}
>
<button onClick={updatePos} style={{ position: 'absolute', right: 10, top: 30, zIndex: 4 }}>
change pos
</button>
</ReactFlow>
);
}
};
export default StressGraph;
export default StressFlow;