chore(react): cleanup
This commit is contained in:
@@ -1,4 +1,4 @@
|
|||||||
import { useState, CSSProperties, useCallback } from 'react';
|
import { useState, useCallback } from 'react';
|
||||||
import {
|
import {
|
||||||
ReactFlow,
|
ReactFlow,
|
||||||
ReactFlowInstance,
|
ReactFlowInstance,
|
||||||
@@ -13,17 +13,11 @@ import {
|
|||||||
Controls,
|
Controls,
|
||||||
Background,
|
Background,
|
||||||
MiniMap,
|
MiniMap,
|
||||||
|
Panel,
|
||||||
} from '@xyflow/react';
|
} from '@xyflow/react';
|
||||||
|
|
||||||
import { getNodesAndEdges } from './utils';
|
import { getNodesAndEdges } from './utils';
|
||||||
|
|
||||||
const buttonWrapperStyles: CSSProperties = {
|
|
||||||
position: 'absolute',
|
|
||||||
right: 10,
|
|
||||||
top: 10,
|
|
||||||
zIndex: 4,
|
|
||||||
};
|
|
||||||
|
|
||||||
const onInit = (reactFlowInstance: ReactFlowInstance) => {
|
const onInit = (reactFlowInstance: ReactFlowInstance) => {
|
||||||
reactFlowInstance.fitView();
|
reactFlowInstance.fitView();
|
||||||
console.log(reactFlowInstance.getNodes());
|
console.log(reactFlowInstance.getNodes());
|
||||||
@@ -80,12 +74,10 @@ const StressFlow = () => {
|
|||||||
<Controls />
|
<Controls />
|
||||||
<Background />
|
<Background />
|
||||||
|
|
||||||
<div style={buttonWrapperStyles}>
|
<Panel position="top-right">
|
||||||
<button onClick={updatePos} style={{ marginRight: 5 }}>
|
<button onClick={updatePos}>change pos</button>
|
||||||
change pos
|
|
||||||
</button>
|
|
||||||
<button onClick={updateElements}>update elements</button>
|
<button onClick={updateElements}>update elements</button>
|
||||||
</div>
|
</Panel>
|
||||||
</ReactFlow>
|
</ReactFlow>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -11,7 +11,7 @@ import UserSelection from '../../components/UserSelection';
|
|||||||
import { containerStyle } from '../../styles';
|
import { containerStyle } from '../../styles';
|
||||||
import { useStore, useStoreApi } from '../../hooks/useStore';
|
import { useStore, useStoreApi } from '../../hooks/useStore';
|
||||||
import { getSelectionChanges, getConnectedEdges } from '../../utils';
|
import { getSelectionChanges, getConnectedEdges } from '../../utils';
|
||||||
import type { ReactFlowProps, ReactFlowState, NodeChange, EdgeChange, Node } from '../../types';
|
import type { ReactFlowProps, ReactFlowState, NodeChange, EdgeChange } from '../../types';
|
||||||
|
|
||||||
type PaneProps = {
|
type PaneProps = {
|
||||||
isSelecting: boolean;
|
isSelecting: boolean;
|
||||||
@@ -148,7 +148,7 @@ const Pane = memo(
|
|||||||
height: Math.abs(mousePos.y - startY),
|
height: Math.abs(mousePos.y - startY),
|
||||||
};
|
};
|
||||||
|
|
||||||
const selectedNodes = getNodesInside<Node>(
|
const selectedNodes = getNodesInside(
|
||||||
nodes,
|
nodes,
|
||||||
nextUserSelectRect,
|
nextUserSelectRect,
|
||||||
transform,
|
transform,
|
||||||
|
|||||||
@@ -112,7 +112,6 @@ const createRFStore = () =>
|
|||||||
const nextFitViewOnInitDone =
|
const nextFitViewOnInitDone =
|
||||||
fitViewOnInitDone ||
|
fitViewOnInitDone ||
|
||||||
(fitViewOnInit &&
|
(fitViewOnInit &&
|
||||||
!fitViewOnInitDone &&
|
|
||||||
!!panZoom &&
|
!!panZoom &&
|
||||||
fitView(
|
fitView(
|
||||||
{
|
{
|
||||||
@@ -133,8 +132,6 @@ const createRFStore = () =>
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
updateNodePositions: (nodeDragItems, positionChanged = true, dragging = false) => {
|
updateNodePositions: (nodeDragItems, positionChanged = true, dragging = false) => {
|
||||||
const { triggerNodeChanges } = get();
|
|
||||||
|
|
||||||
const changes = nodeDragItems.map((node) => {
|
const changes = nodeDragItems.map((node) => {
|
||||||
const change: NodePositionChange = {
|
const change: NodePositionChange = {
|
||||||
id: node.id,
|
id: node.id,
|
||||||
@@ -150,7 +147,7 @@ const createRFStore = () =>
|
|||||||
return change;
|
return change;
|
||||||
});
|
});
|
||||||
|
|
||||||
triggerNodeChanges(changes);
|
get().triggerNodeChanges(changes);
|
||||||
},
|
},
|
||||||
|
|
||||||
triggerNodeChanges: (changes) => {
|
triggerNodeChanges: (changes) => {
|
||||||
|
|||||||
Reference in New Issue
Block a user