chore(react): cleanup

This commit is contained in:
moklick
2023-06-12 17:21:02 +02:00
parent c6501aff62
commit a41ec8f1bc
3 changed files with 8 additions and 19 deletions
@@ -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>
); );
}; };
+2 -2
View File
@@ -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,
+1 -4
View File
@@ -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) => {