From 7cc262806029fc659cada5f49a7d91e1fd4c8999 Mon Sep 17 00:00:00 2001
From: Dave Page <dpage@pgadmin.org>
Date: Tue, 18 Aug 2026 09:23:52 +0100
Subject: [PATCH] Javascript dependency: Bump use-resize-observer from 9.1.0 to
 10.0.0 (#10265)

v10 removes the default export in favour of a named one, so the import in
PgTreeView had to change with it; left as it was, useResizeObserver resolves
to undefined and the Object Explorer dies when the hook is called. The rest of
the v10 changes cost us nothing: it drops the /polyfilled entrypoint and its
@juggle/resize-observer dependency, no longer takes react-dom as a peer, and
requires React >= 18.2, which is comfortably met on React 19. The hook still
returns the { ref, width, height } shape the tree destructures.

Verified by hand in Chrome and Safari with the tree expanded through
databases, schemas, tables and tablespaces, resizing the panel and the window.
---
 web/package.json                           |  2 +-
 web/pgadmin/static/js/PgTreeView/index.jsx |  2 +-
 web/yarn.lock                              | 22 ++++++----------------
 3 files changed, 8 insertions(+), 18 deletions(-)

diff --git a/web/package.json b/web/package.json
index 77762e17614..649bff60e8e 100644
--- a/web/package.json
+++ b/web/package.json
@@ -152,7 +152,7 @@
     "sql-formatter": "^15.8.2",
     "uplot": "^1.6.32",
     "uplot-react": "^1.2.4",
-    "use-resize-observer": "^9.1.0",
+    "use-resize-observer": "^10.0.0",
     "valid-filename": "^4.0.0",
     "vanilla-jsoneditor": "^3.12.0",
     "wkx": "^0.5.0",
diff --git a/web/pgadmin/static/js/PgTreeView/index.jsx b/web/pgadmin/static/js/PgTreeView/index.jsx
index 529361cda2f..97172dda494 100644
--- a/web/pgadmin/static/js/PgTreeView/index.jsx
+++ b/web/pgadmin/static/js/PgTreeView/index.jsx
@@ -16,7 +16,7 @@ import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
 import ChevronRightIcon from '@mui/icons-material/ChevronRight';
 import PropTypes from 'prop-types';
 import EmptyPanelMessage from '../components/EmptyPanelMessage';
-import useResizeObserver from 'use-resize-observer';
+import { useResizeObserver } from 'use-resize-observer';
 
 
 const Root = styled('div')(({ theme }) => ({
diff --git a/web/yarn.lock b/web/yarn.lock
index 75fe204cdaf..477ca0f3e38 100644
--- a/web/yarn.lock
+++ b/web/yarn.lock
@@ -2910,13 +2910,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@juggle/resize-observer@npm:^3.3.1":
-  version: 3.4.0
-  resolution: "@juggle/resize-observer@npm:3.4.0"
-  checksum: 10c0/12930242357298c6f2ad5d4ec7cf631dfb344ca7c8c830ab7f64e6ac11eb1aae486901d8d880fd08fb1b257800c160a0da3aee1e7ed9adac0ccbb9b7c5d93347
-  languageName: node
-  linkType: hard
-
 "@kurkle/color@npm:^0.3.0":
   version: 0.3.4
   resolution: "@kurkle/color@npm:0.3.4"
@@ -13333,7 +13326,7 @@ __metadata:
     uplot: "npm:^1.6.32"
     uplot-react: "npm:^1.2.4"
     url-loader: "npm:^4.1.1"
-    use-resize-observer: "npm:^9.1.0"
+    use-resize-observer: "npm:^10.0.0"
     valid-filename: "npm:^4.0.0"
     vanilla-jsoneditor: "npm:^3.12.0"
     webfonts-loader: "npm:^8.1.1"
@@ -15148,15 +15141,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"use-resize-observer@npm:^9.1.0":
-  version: 9.1.0
-  resolution: "use-resize-observer@npm:9.1.0"
-  dependencies:
-    "@juggle/resize-observer": "npm:^3.3.1"
+"use-resize-observer@npm:^10.0.0":
+  version: 10.0.0
+  resolution: "use-resize-observer@npm:10.0.0"
   peerDependencies:
-    react: 16.8.0 - 18
-    react-dom: 16.8.0 - 18
-  checksum: 10c0/6ccdeb09fe20566ec182b1635a22f189e13d46226b74610432590e69b31ef5d05d069badc3306ebd0d2bb608743b17981fb535763a1d7dc2c8ae462ee8e5999c
+    react: ">=18.2"
+  checksum: 10c0/90b3c913f18f17775fab09cc56f2b2962ce1f3aa3604bab2807b722f4ea6809ab0b987d2e9177f2643305d104f027fb4c83d79d7a77b47630ccd54df7bd32cb6
   languageName: node
   linkType: hard