From 0e75130af072a8e853d92cb2f20e6837148025c0 Mon Sep 17 00:00:00 2001 From: Peter Chang Date: Mon, 3 Nov 2025 15:37:05 +0000 Subject: [PATCH 1/2] Update dev dependencies Add some directives to workaround R3F v8 useThree hook issue --- client/component/package.json | 2 +- .../component/src/MulticlickSelectionTool.tsx | 2 + client/component/src/SelectionComponent.tsx | 2 + client/component/src/selections/utils.tsx | 4 +- eslint.config.mjs | 2 +- package.json | 42 ++++++++++++------- 6 files changed, 34 insertions(+), 20 deletions(-) diff --git a/client/component/package.json b/client/component/package.json index ba0f3885..48e4c480 100644 --- a/client/component/package.json +++ b/client/component/package.json @@ -73,6 +73,6 @@ "three": "^0.174.0", "typedoc": "^0.28.5", "vite-plugin-dts": "^4.5.3", - "vitest": "^3.2.4" + "vitest": "^4.0.6" } } diff --git a/client/component/src/MulticlickSelectionTool.tsx b/client/component/src/MulticlickSelectionTool.tsx index b427fbaf..381acf97 100644 --- a/client/component/src/MulticlickSelectionTool.tsx +++ b/client/component/src/MulticlickSelectionTool.tsx @@ -135,6 +135,7 @@ function MulticlickSelectionTool(props: Props) { const setPoints = useCallback( (html: Vector3[]) => { + // @ts-expect-error: workaround until r3f v9 const world = html.map((pt) => htmlToWorld(camera, pt)) as Points; const data = world.map(worldToData) as Points; setRawSelection({ html, world, data }); @@ -272,6 +273,7 @@ function MulticlickSelectionTool(props: Props) { // Compute effective selection const selection = useMemo( + // @ts-expect-error: workaround until r3f v9 () => rawSelection && transformRef.current(rawSelection, camera, context), [rawSelection, transformRef, camera, context] ); diff --git a/client/component/src/SelectionComponent.tsx b/client/component/src/SelectionComponent.tsx index c4bc75f0..cbcfa0de 100644 --- a/client/component/src/SelectionComponent.tsx +++ b/client/component/src/SelectionComponent.tsx @@ -60,7 +60,9 @@ function SelectionComponent(props: SelectionComponentProps) { const camera = useThree((state) => state.camera); const isFlipped = useMemo(() => { + // @ts-expect-error: workaround until r3f v9 const o = dataToHtml(camera, new Vector3(0, 0)); + // @ts-expect-error: workaround until r3f v9 const v = dataToHtml(camera, new Vector3(1, 1)).sub(o); return [v.x < 0, v.y < 0] as [boolean, boolean]; }, [camera, dataToHtml]); diff --git a/client/component/src/selections/utils.tsx b/client/component/src/selections/utils.tsx index 29cadbc2..ed52c389 100644 --- a/client/component/src/selections/utils.tsx +++ b/client/component/src/selections/utils.tsx @@ -395,12 +395,12 @@ interface SelectionShapeProps { function SelectionShape(props: SelectionShapeProps) { const { size, selection, updateSelection, showHandles } = props; const selectionType = getSelectionType(selection); - const context = useVisCanvasContext(); - const { htmlToData } = context; + const { htmlToData } = useVisCanvasContext(); const camera = useThree((state) => state.camera); const htmlToDataFunction = useCallback( (x: number | undefined, y: number | undefined) => { + // @ts-expect-error: workaround until r3f v9 const v = htmlToData(camera, new Vector3(x, y)); return [v.x, v.y] as [number, number]; }, diff --git a/eslint.config.mjs b/eslint.config.mjs index 3d7f78f1..dbe5f704 100644 --- a/eslint.config.mjs +++ b/eslint.config.mjs @@ -55,7 +55,7 @@ export default defineConfig([globalIgnores([ settings: { react: { - version: "19", + version: "18", }, }, diff --git a/package.json b/package.json index dd0b3b37..619d5680 100644 --- a/package.json +++ b/package.json @@ -6,7 +6,7 @@ }, "version": "1.1.0", "private": true, - "packageManager": "pnpm@10.15.1+sha512.34e538c329b5553014ca8e8f4535997f96180a1d0f614339357449935350d924e22f8614682191264ec33d1462ac21561aff97f6bb18065351c162c7e8f6de67", + "packageManager": "pnpm@10.24.0+sha512.01ff8ae71b4419903b65c60fb2dc9d34cf8bb6e06d03bde112ef38f7a34d6904c424ba66bea5cdcf12890230bf39f9580473140ed9c946fef328b6e5238a345a", "scripts": { "preinstall": "npx only-allow pnpm", "start": "pnpm --filter {client/example} start", @@ -28,27 +28,37 @@ } }, "onlyBuiltDependencies": [ - "esbuild" + "@tree-sitter-grammars/tree-sitter-yaml", + "bufferutil", + "core-js-pure", + "es5-ext", + "esbuild", + "tree-sitter", + "tree-sitter-json", + "utf-8-validate" + ], + "ignoredBuiltDependencies": [ + "@scarf/scarf" ] }, "devDependencies": { - "@eslint/compat": "^1.3.0", - "@eslint/eslintrc": "^3.3.1", - "@eslint/js": "^9.29.0", - "@typescript-eslint/eslint-plugin": "^8.34.1", - "@typescript-eslint/parser": "^8.34.1", - "@vitejs/plugin-react": "^4.6.0", + "@eslint/compat": "^1.4.1", + "@eslint/eslintrc": "^3.3.3", + "@eslint/js": "^9.39.1", + "@typescript-eslint/eslint-plugin": "^8.48.1", + "@typescript-eslint/parser": "^8.48.1", + "@vitejs/plugin-react": "^4.7.0", "acorn": "^8.15.0", - "eslint": "~9.38.0", - "eslint-config-prettier": "^10.1.5", - "eslint-plugin-prettier": "^5.5.0", + "eslint": "^9.39.1", + "eslint-config-prettier": "^10.1.8", + "eslint-plugin-prettier": "^5.5.4", "eslint-plugin-react": "^7.37.5", "eslint-plugin-react-hooks": "^5.2.0", - "eslint-plugin-react-refresh": "^0.4.20", - "globals": "^16.2.0", - "prettier": "^3.6.0", - "typescript": "~5.8.3", - "vite": "^6.3.5" + "eslint-plugin-react-refresh": "^0.4.24", + "globals": "^16.5.0", + "prettier": "^3.7.4", + "typescript": "^5.9.3", + "vite": "^6.4.1" }, "browserslist": [ ">0.2%", From 41192d952a2c9b23f16d16cd6498fe6e5905f6cd Mon Sep 17 00:00:00 2001 From: Peter Chang Date: Mon, 15 Dec 2025 16:44:30 +0000 Subject: [PATCH 2/2] Update dev dependencies again and remove directives --- client/component/package.json | 18 +++++++++--------- .../component/src/MulticlickSelectionTool.tsx | 2 -- client/component/src/SelectionComponent.tsx | 2 -- client/component/src/selections/utils.tsx | 1 - client/example/package.json | 4 ++-- package.json | 10 +++++----- storybook/package.json | 16 ++++++++-------- 7 files changed, 24 insertions(+), 29 deletions(-) diff --git a/client/component/package.json b/client/component/package.json index 48e4c480..82612fca 100644 --- a/client/component/package.json +++ b/client/component/package.json @@ -54,25 +54,25 @@ "devDependencies": { "@h5web/lib": "^15.0.0", "@react-three/drei": "^9.122.0", - "@react-three/fiber": "^8.17.0", + "@react-three/fiber": "^8.18.0", "@types/cwise": "^1.0.6", - "@types/d3-array": "^3.2.1", + "@types/d3-array": "^3.2.2", "@types/d3-format": "^3.0.4", "@types/d3-random": "^3.0.3", "@types/d3-scale": "^4.0.9", "@types/ndarray": "^1.0.14", - "@types/react": "^18.3.0", - "@types/react-dom": "^18.3.0", + "@types/react": "^18.3.27", + "@types/react-dom": "^18.3.7", "@types/three": "^0.174.0", "@types/websocket": "^1.0.10", "d3-random": "^3.0.1", "ndarray": "^1.0.19", - "react": "^18.3.0", - "react-dom": "^18.3.0", + "react": "^18.3.1", + "react-dom": "^18.3.1", "react-toastify": "^11.0.5", "three": "^0.174.0", - "typedoc": "^0.28.5", - "vite-plugin-dts": "^4.5.3", - "vitest": "^4.0.6" + "typedoc": "^0.28.15", + "vite-plugin-dts": "^4.5.4", + "vitest": "^4.0.15" } } diff --git a/client/component/src/MulticlickSelectionTool.tsx b/client/component/src/MulticlickSelectionTool.tsx index 381acf97..b427fbaf 100644 --- a/client/component/src/MulticlickSelectionTool.tsx +++ b/client/component/src/MulticlickSelectionTool.tsx @@ -135,7 +135,6 @@ function MulticlickSelectionTool(props: Props) { const setPoints = useCallback( (html: Vector3[]) => { - // @ts-expect-error: workaround until r3f v9 const world = html.map((pt) => htmlToWorld(camera, pt)) as Points; const data = world.map(worldToData) as Points; setRawSelection({ html, world, data }); @@ -273,7 +272,6 @@ function MulticlickSelectionTool(props: Props) { // Compute effective selection const selection = useMemo( - // @ts-expect-error: workaround until r3f v9 () => rawSelection && transformRef.current(rawSelection, camera, context), [rawSelection, transformRef, camera, context] ); diff --git a/client/component/src/SelectionComponent.tsx b/client/component/src/SelectionComponent.tsx index cbcfa0de..c4bc75f0 100644 --- a/client/component/src/SelectionComponent.tsx +++ b/client/component/src/SelectionComponent.tsx @@ -60,9 +60,7 @@ function SelectionComponent(props: SelectionComponentProps) { const camera = useThree((state) => state.camera); const isFlipped = useMemo(() => { - // @ts-expect-error: workaround until r3f v9 const o = dataToHtml(camera, new Vector3(0, 0)); - // @ts-expect-error: workaround until r3f v9 const v = dataToHtml(camera, new Vector3(1, 1)).sub(o); return [v.x < 0, v.y < 0] as [boolean, boolean]; }, [camera, dataToHtml]); diff --git a/client/component/src/selections/utils.tsx b/client/component/src/selections/utils.tsx index ed52c389..e6a0a54c 100644 --- a/client/component/src/selections/utils.tsx +++ b/client/component/src/selections/utils.tsx @@ -400,7 +400,6 @@ function SelectionShape(props: SelectionShapeProps) { const htmlToDataFunction = useCallback( (x: number | undefined, y: number | undefined) => { - // @ts-expect-error: workaround until r3f v9 const v = htmlToData(camera, new Vector3(x, y)); return [v.x, v.y] as [number, number]; }, diff --git a/client/example/package.json b/client/example/package.json index bc2ac0d2..05b5010a 100644 --- a/client/example/package.json +++ b/client/example/package.json @@ -21,7 +21,7 @@ }, "devDependencies": { "@types/ndarray": "^1.0.14", - "@types/react": "^18.3.0", - "@types/react-dom": "^18.3.0" + "@types/react": "^18.3.27", + "@types/react-dom": "^18.3.7" } } diff --git a/package.json b/package.json index 619d5680..5ad0daae 100644 --- a/package.json +++ b/package.json @@ -44,17 +44,17 @@ "devDependencies": { "@eslint/compat": "^1.4.1", "@eslint/eslintrc": "^3.3.3", - "@eslint/js": "^9.39.1", - "@typescript-eslint/eslint-plugin": "^8.48.1", - "@typescript-eslint/parser": "^8.48.1", + "@eslint/js": "^9.39.2", + "@typescript-eslint/eslint-plugin": "^8.49.0", + "@typescript-eslint/parser": "^8.49.0", "@vitejs/plugin-react": "^4.7.0", "acorn": "^8.15.0", - "eslint": "^9.39.1", + "eslint": "^9.39.2", "eslint-config-prettier": "^10.1.8", "eslint-plugin-prettier": "^5.5.4", "eslint-plugin-react": "^7.37.5", "eslint-plugin-react-hooks": "^5.2.0", - "eslint-plugin-react-refresh": "^0.4.24", + "eslint-plugin-react-refresh": "^0.4.25", "globals": "^16.5.0", "prettier": "^3.7.4", "typescript": "^5.9.3", diff --git a/storybook/package.json b/storybook/package.json index 64f6d053..34561aea 100644 --- a/storybook/package.json +++ b/storybook/package.json @@ -17,18 +17,18 @@ "three": "^0.174.0" }, "devDependencies": { - "@storybook/addon-links": "^9.1.5", - "@storybook/react-vite": "^9.1.5", + "@storybook/addon-docs": "^9.1.16", + "@storybook/addon-links": "^9.1.16", + "@storybook/react-vite": "^9.1.16", "@types/ndarray": "^1.0.14", - "@types/node": "^20.19.1", - "@types/react": "^18.3.23", + "@types/node": "^20.19.27", + "@types/react": "^18.3.27", "@types/react-dom": "^18.3.7", "@types/swagger-ui-react": "^4.19.0", "@types/three": "^0.164.1", - "eslint-plugin-storybook": "^9.1.5", - "storybook": "^9.1.5", - "swagger-ui-react": "^5.25.2", - "@storybook/addon-docs": "^9.1.5" + "eslint-plugin-storybook": "^9.1.16", + "storybook": "^9.1.16", + "swagger-ui-react": "^5.31.0" }, "eslintConfig": { "extends": [