diff --git a/package.json b/package.json index 40bad2e..7aa6bf4 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@gillianplatform/sedap", - "version": "0.0.5", + "version": "0.0.6", "description": "Monorepo for JavaScript libraries for SEDAP", "repository":"https://github.com/gillianplatform/sedap-js", "workspaces": [ diff --git a/react/package.json b/react/package.json index 15f82e6..5bfd107 100644 --- a/react/package.json +++ b/react/package.json @@ -1,6 +1,6 @@ { "name": "@gillianplatform/sedap-react", - "version": "0.0.5", + "version": "0.0.6", "description": "React components for SEDAP", "repository":"https://github.com/gillianplatform/sedap-js", "type": "module", @@ -27,7 +27,7 @@ "@eslint/compat": "^1.2.4", "@eslint/eslintrc": "^3.2.0", "@eslint/js": "^9.17.0", - "@gillianplatform/sedap-types": "0.0.5", + "@gillianplatform/sedap-types": "0.0.6", "@storybook/addon-essentials": "^8.4.7", "@storybook/addon-interactions": "^8.4.7", "@storybook/addon-onboarding": "^8.4.7", diff --git a/react/src/components/TraceView/TraceView.tsx b/react/src/components/TraceView/TraceView.tsx index 2d73126..319a75a 100644 --- a/react/src/components/TraceView/TraceView.tsx +++ b/react/src/components/TraceView/TraceView.tsx @@ -1,8 +1,15 @@ -import { Background, BackgroundVariant, Controls, MiniMap, ReactFlow } from "@xyflow/react"; +import { + applyNodeChanges, + Background, + BackgroundVariant, + Controls, + MiniMap, + ReactFlow, +} from "@xyflow/react"; import * as Flow from "@xyflow/react"; import "@xyflow/react/dist/style.css"; -import React, { useEffect, useMemo, useState } from "react"; +import React, { useCallback, useEffect, useMemo, useState } from "react"; import computeLayout from "./layout"; import builtinNodeKinds from "../nodes"; import TraceViewContext from "./TraceViewContext"; @@ -34,10 +41,8 @@ const TraceView: React.FC = ({ reactFlowProps = DEFAULT_REACT_FLOW_PROPS, nodeTooltips = false, }: TraceViewProps) => { - const [[placedNodes, placedEdges], setPlacedGraph] = useState<[Flow.Node[], Flow.Edge[]]>([ - [], - [], - ]); + const [rfNodes, setRfNodes] = useState([]); + const [rfEdges, setRfEdges] = useState([]); const [busy, setBusy] = useState(true); const [expandedNodes, setExpandedNodes] = useState>(Set(initExpandedNodes)); @@ -55,7 +60,8 @@ const TraceView: React.FC = ({ computeLayout(root, nodes, nodeTypes, expandedNodes, layoutOptions).then( ([placedNodes, placedEdges]) => { if (isActive) { - setPlacedGraph([placedNodes, placedEdges]); + setRfNodes(placedNodes); + setRfEdges(placedEdges); setBusy(false); } }, @@ -65,6 +71,13 @@ const TraceView: React.FC = ({ }; }, [root, nodes, nodeTypes, expandedNodes, layoutOptions]); + const onNodesChange = useCallback( + (changes: Flow.NodeChange[]) => { + setRfNodes((oldNodes) => applyNodeChanges(changes, oldNodes)); + }, + [setRfNodes], + ); + const controls = showControls ? : undefined; const minimap = showMinimap ? : undefined; const background = showBackground ? ( @@ -96,8 +109,9 @@ const TraceView: React.FC = ({ diff --git a/types/package.json b/types/package.json index 9b3e0d4..90b8a12 100644 --- a/types/package.json +++ b/types/package.json @@ -1,6 +1,6 @@ { "name": "@gillianplatform/sedap-types", - "version": "0.0.5", + "version": "0.0.6", "description": "SEDAP types for TypeScript", "repository":"https://github.com/gillianplatform/sedap-js", "types": "./src/index.d.ts", diff --git a/vscode/ext/package.json b/vscode/ext/package.json index ca73d2e..a1e9f1e 100644 --- a/vscode/ext/package.json +++ b/vscode/ext/package.json @@ -1,6 +1,6 @@ { "name": "@gillianplatform/sedap-vscode-ext", - "version": "0.0.5", + "version": "0.0.6", "description": "SEDAP-related utilities for VSCode extensions", "repository":"https://github.com/gillianplatform/sedap-js", "type": "commonjs", @@ -27,8 +27,8 @@ "@eslint/compat": "^1.2.4", "@eslint/eslintrc": "^3.2.0", "@eslint/js": "^9.17.0", - "@gillianplatform/sedap-types": "0.0.5", - "@gillianplatform/sedap-vscode-types": "0.0.5", + "@gillianplatform/sedap-types": "0.0.6", + "@gillianplatform/sedap-vscode-types": "0.0.6", "@types/vscode": "^1.96.0", "@typescript-eslint/eslint-plugin": "^8.18.2", "@typescript-eslint/parser": "^8.18.2", diff --git a/vscode/types/package.json b/vscode/types/package.json index d09be0c..32b94c6 100644 --- a/vscode/types/package.json +++ b/vscode/types/package.json @@ -1,6 +1,6 @@ { "name": "@gillianplatform/sedap-vscode-types", - "version": "0.0.5", + "version": "0.0.6", "description": "Types for SEDAP VSCode helper libraries", "repository":"https://github.com/gillianplatform/sedap-js", "types": "./src/index.d.ts", @@ -8,7 +8,7 @@ "author": "", "license": "ISC", "devDependencies": { - "@gillianplatform/sedap-types": "0.0.5", + "@gillianplatform/sedap-types": "0.0.6", "typescript": "^5.7.2" } } diff --git a/vscode/ui/package.json b/vscode/ui/package.json index 04810b3..06ec01f 100644 --- a/vscode/ui/package.json +++ b/vscode/ui/package.json @@ -1,6 +1,6 @@ { "name": "@gillianplatform/sedap-vscode-ui", - "version": "0.0.5", + "version": "0.0.6", "description": "SEDAP-related utilities for webviews inside VSCode extensions", "repository":"https://github.com/gillianplatform/sedap-js", "type": "module", @@ -25,8 +25,8 @@ "@eslint/compat": "^1.2.4", "@eslint/eslintrc": "^3.2.0", "@eslint/js": "^9.17.0", - "@gillianplatform/sedap-types": "0.0.5", - "@gillianplatform/sedap-vscode-types": "0.0.5", + "@gillianplatform/sedap-types": "0.0.6", + "@gillianplatform/sedap-vscode-types": "0.0.6", "@types/react": "^19.0.2", "@types/vscode-webview": "^1.57.5", "@typescript-eslint/eslint-plugin": "^8.18.2", @@ -46,7 +46,7 @@ "vite-plugin-dts": "^4.4.0" }, "peerDependencies": { - "@gillianplatform/sedap-react": "0.0.5", + "@gillianplatform/sedap-react": "0.0.6", "react": "^19.0.0", "react-icons": "^5.4.0" },