@mui/x-tree-view-pro 8.11.0 → 8.11.2

package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.js

@@ -42,54 +42,44 @@ const useTreeViewLazyLoading = ({
     if (!isLazyLoadingEnabled) {
       return;
     }
-    store.update(prevState => {
-      if (!prevState.lazyLoading.dataSource.loading[itemId] && !isLoading) {
-        return prevState;
-      }
-      const loading = (0, _extends2.default)({}, prevState.lazyLoading.dataSource.loading);
-      if (isLoading === false) {
-        delete loading[itemId];
-      } else {
-        loading[itemId] = isLoading;
-      }
-      return (0, _extends2.default)({}, prevState, {
-        lazyLoading: (0, _extends2.default)({}, prevState.lazyLoading, {
-          dataSource: (0, _extends2.default)({}, prevState.lazyLoading.dataSource, {
-            loading
-          })
-        })
-      });
-    });
+    if (_internals.lazyLoadingSelectors.isItemLoading(store.state, itemId) === isLoading) {
+      return;
+    }
+    const loadingState = (0, _extends2.default)({}, store.state.lazyLoading.dataSource.loading);
+    if (isLoading === false) {
+      delete loadingState[itemId];
+    } else {
+      loadingState[itemId] = isLoading;
+    }
+    store.set('lazyLoading', (0, _extends2.default)({}, store.state.lazyLoading, {
+      dataSource: (0, _extends2.default)({}, store.state.lazyLoading.dataSource, {
+        loading: loadingState
+      })
+    }));
   });
   const setDataSourceError = (itemId, error) => {
     if (!isLazyLoadingEnabled) {
       return;
     }
-    store.update(prevState => {
-      const errors = (0, _extends2.default)({}, prevState.lazyLoading.dataSource.errors);
-      if (error === null && errors[itemId] !== undefined) {
-        delete errors[itemId];
-      } else {
-        errors[itemId] = error;
-      }
+    const errors = (0, _extends2.default)({}, store.state.lazyLoading.dataSource.errors);
+    if (error === null && errors[itemId] !== undefined) {
+      delete errors[itemId];
+    } else {
       errors[itemId] = error;
-      return (0, _extends2.default)({}, prevState, {
-        lazyLoading: (0, _extends2.default)({}, prevState.lazyLoading, {
-          dataSource: (0, _extends2.default)({}, prevState.lazyLoading.dataSource, {
-            errors
-          })
-        })
-      });
-    });
+    }
+    errors[itemId] = error;
+    store.set('lazyLoading', (0, _extends2.default)({}, store.state.lazyLoading, {
+      dataSource: (0, _extends2.default)({}, store.state.lazyLoading.dataSource, {
+        errors
+      })
+    }));
   };
   const resetDataSourceState = (0, _useEventCallback.default)(() => {
     if (!isLazyLoadingEnabled) {
       return;
     }
-    store.update(prevState => (0, _extends2.default)({}, prevState, {
-      lazyLoading: (0, _extends2.default)({}, prevState.lazyLoading, {
-        dataSource: INITIAL_STATE
-      })
+    store.set('lazyLoading', (0, _extends2.default)({}, store.state.lazyLoading, {
+      dataSource: INITIAL_STATE
     }));
   });
   const fetchItems = (0, _useEventCallback.default)(async parentIds => {
@@ -109,7 +99,7 @@ const useTreeViewLazyLoading = ({
     // handle loading here
     instance.setTreeViewLoading(true);
     // reset the state if we are refetching the first visible items
-    if ((0, _internals.selectorDataSourceState)(store.value) !== INITIAL_STATE) {
+    if (_internals.lazyLoadingSelectors.dataSource(store.state) !== INITIAL_STATE) {
       resetDataSourceState();
     }
     // handle caching here
@@ -149,70 +139,83 @@ const useTreeViewLazyLoading = ({
       instance.setTreeViewLoading(false);
     }
   });
-  const fetchItemChildren = (0, _useEventCallback.default)(async id => {
+  const fetchItemChildren = (0, _useEventCallback.default)(async ({
+    itemId,
+    forceRefresh
+  }) => {
     if (!isLazyLoadingEnabled) {
       return;
     }
     const getChildrenCount = params.dataSource?.getChildrenCount || (() => 0);
     const getTreeItems = params.dataSource?.getTreeItems;
     if (!getTreeItems) {
-      nestedDataManager.clearPendingRequest(id);
+      nestedDataManager.clearPendingRequest(itemId);
       return;
     }
-    const parent = (0, _internals.selectorItemMeta)(store.value, id);
+    const parent = _internals.itemsSelectors.itemMeta(store.state, itemId);
     if (!parent) {
-      nestedDataManager.clearPendingRequest(id);
+      nestedDataManager.clearPendingRequest(itemId);
       return;
     }
     const depth = parent.depth ? parent.depth + 1 : 1;
 
     // handle loading here
-    instance.setDataSourceLoading(id, true);
+    instance.setDataSourceLoading(itemId, true);
 
     // handle caching here
-    const cachedData = cacheRef.current.get(id);
-    if (cachedData !== undefined && cachedData !== -1) {
-      nestedDataManager.setRequestSettled(id);
-      instance.addItems({
-        items: cachedData,
-        depth,
-        parentId: id,
-        getChildrenCount
-      });
-      instance.setDataSourceLoading(id, false);
-      return;
-    }
-    if (cachedData === -1) {
-      instance.removeChildren(id);
+    if (!forceRefresh) {
+      const cachedData = cacheRef.current.get(itemId);
+      if (cachedData !== undefined && cachedData !== -1) {
+        nestedDataManager.setRequestSettled(itemId);
+        instance.addItems({
+          items: cachedData,
+          depth,
+          parentId: itemId,
+          getChildrenCount
+        });
+        instance.setDataSourceLoading(itemId, false);
+        return;
+      }
+      if (cachedData === -1) {
+        instance.removeChildren(itemId);
+      }
     }
-    const existingError = (0, _internals.selectorGetTreeItemError)(store.value, id) ?? null;
-    if (existingError) {
-      instance.setDataSourceError(id, null);
+    if (_internals.lazyLoadingSelectors.itemHasError(store.state, itemId)) {
+      instance.setDataSourceError(itemId, null);
     }
     try {
-      const getTreeItemsResponse = await getTreeItems(id);
-      nestedDataManager.setRequestSettled(id);
+      const getTreeItemsResponse = await getTreeItems(itemId);
+      nestedDataManager.setRequestSettled(itemId);
 
       // set caching
-      cacheRef.current.set(id, getTreeItemsResponse);
+      cacheRef.current.set(itemId, getTreeItemsResponse);
       // update the items in the state
+      if (forceRefresh) {
+        instance.removeChildren(itemId);
+      }
       instance.addItems({
         items: getTreeItemsResponse,
         depth,
-        parentId: id,
+        parentId: itemId,
         getChildrenCount
       });
     } catch (error) {
       const childrenFetchError = error;
       // handle errors here
-      instance.setDataSourceError(id, childrenFetchError);
-      instance.removeChildren(id);
+      instance.setDataSourceError(itemId, childrenFetchError);
+      instance.removeChildren(itemId);
     } finally {
       // unset loading
-      instance.setDataSourceLoading(id, false);
-      nestedDataManager.setRequestSettled(id);
+      instance.setDataSourceLoading(itemId, false);
+      nestedDataManager.setRequestSettled(itemId);
     }
   });
+  const updateItemChildren = (0, _useEventCallback.default)(itemId => {
+    return instance.fetchItemChildren({
+      itemId,
+      forceRefresh: true
+    });
+  });
   (0, _internals.useInstanceEventHandler)(instance, 'beforeItemToggleExpansion', async eventParameters => {
     if (!isLazyLoadingEnabled || !eventParameters.shouldBeExpanded) {
       return;
@@ -221,14 +224,14 @@ const useTreeViewLazyLoading = ({
 
     eventParameters.isExpansionPrevented = true;
     await instance.fetchItems([eventParameters.itemId]);
-    const fetchErrors = Boolean((0, _internals.selectorGetTreeItemError)(store.value, eventParameters.itemId));
-    if (!fetchErrors) {
+    const itemHasError = _internals.lazyLoadingSelectors.itemHasError(store.state, eventParameters.itemId);
+    if (!itemHasError) {
       instance.applyItemExpansion({
         itemId: eventParameters.itemId,
         shouldBeExpanded: true,
         event: eventParameters.event
       });
-      if ((0, _internals.selectorIsItemSelected)(store.value, eventParameters.itemId)) {
+      if (_internals.selectionSelectors.isItemSelected(store.state, eventParameters.itemId)) {
         // make sure selection propagation works correctly
         instance.setItemSelection({
           event: eventParameters.event,
@@ -241,10 +244,8 @@ const useTreeViewLazyLoading = ({
   });
   React.useEffect(() => {
     if (isLazyLoadingEnabled && firstRenderRef.current) {
-      store.update(prevState => (0, _extends2.default)({}, prevState, {
-        lazyLoading: (0, _extends2.default)({}, prevState.lazyLoading, {
-          enabled: true
-        })
+      store.set('lazyLoading', (0, _extends2.default)({}, store.state.lazyLoading, {
+        enabled: true
       }));
       if (params.items.length) {
         const getChildrenCount = params.dataSource?.getChildrenCount || (() => 0);
@@ -254,7 +255,7 @@ const useTreeViewLazyLoading = ({
           getChildrenCount
         });
       } else {
-        const expandedItems = (0, _internals.selectorExpandedItems)(store.value);
+        const expandedItems = _internals.expansionSelectors.expandedItemsRaw(store.state);
         if (expandedItems.length > 0) {
           instance.resetItemExpansion();
         }
@@ -270,10 +271,13 @@ const useTreeViewLazyLoading = ({
     instance: {
       fetchItemChildren,
       fetchItems,
+      updateItemChildren,
       setDataSourceLoading,
       setDataSourceError
     },
-    publicAPI: {}
+    publicAPI: {
+      updateItemChildren
+    }
   };
 };
 exports.useTreeViewLazyLoading = useTreeViewLazyLoading;

package/internals/plugins/useTreeViewLazyLoading/utils.js

@@ -45,7 +45,9 @@ class NestedDataManager {
       const id = fetchQueue[i];
       this.queuedRequests.delete(id);
       this.pendingRequests.add(id);
-      fetchPromises.push(this.instance.fetchItemChildren(id));
+      fetchPromises.push(this.instance.fetchItemChildren({
+        itemId: id
+      }));
     }
     await Promise.all(fetchPromises);
   };

package/package.json

@@ -1,9 +1,8 @@
 {
   "name": "@mui/x-tree-view-pro",
-  "version": "8.11.0",
+  "version": "8.11.2",
   "author": "MUI Team",
   "description": "The Pro plan edition of the MUI X Tree View components.",
-  "main": "./index.js",
   "license": "SEE LICENSE IN LICENSE",
   "bugs": {
     "url": "https://github.com/mui/mui-x/issues"
@@ -33,16 +32,17 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.28.2",
-    "@mui/utils": "^7.3.1",
+    "@base-ui-components/utils": "0.1.1",
+    "@mui/utils": "^7.3.2",
     "@types/react-transition-group": "^4.4.12",
     "clsx": "^2.1.1",
     "prop-types": "^15.8.1",
     "react-transition-group": "^4.4.5",
     "reselect": "^5.1.1",
     "use-sync-external-store": "^1.5.0",
-    "@mui/x-internals": "8.11.0",
-    "@mui/x-license": "8.11.0",
-    "@mui/x-tree-view": "8.11.0"
+    "@mui/x-license": "8.11.2",
+    "@mui/x-tree-view": "8.11.2",
+    "@mui/x-internals": "8.11.2"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",
@@ -64,27 +64,28 @@
     "node": ">=14.0.0"
   },
   "type": "commonjs",
+  "main": "./index.js",
   "types": "./index.d.ts",
   "exports": {
     "./package.json": "./package.json",
     ".": {
-      "import": {
-        "types": "./esm/index.d.ts",
-        "default": "./esm/index.js"
-      },
       "require": {
         "types": "./index.d.ts",
         "default": "./index.js"
+      },
+      "default": {
+        "types": "./esm/index.d.ts",
+        "default": "./esm/index.js"
       }
     },
     "./*": {
-      "import": {
-        "types": "./esm/*/index.d.ts",
-        "default": "./esm/*/index.js"
-      },
       "require": {
         "types": "./*/index.d.ts",
         "default": "./*/index.js"
+      },
+      "default": {
+        "types": "./esm/*/index.d.ts",
+        "default": "./esm/*/index.js"
       }
     },
     "./esm": null