@stoker-platform/web-app 0.5.157 → 0.5.158

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @stoker-platform/web-app
 
+## 0.5.158
+
+### Patch Changes
+
+- fix: improve preload cache expansion handling
+
 ## 0.5.157
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@stoker-platform/web-app",
-    "version": "0.5.157",
+    "version": "0.5.158",
     "type": "module",
     "license": "SEE LICENSE IN LICENSE.md",
     "scripts": {

package/src/DateRange.tsx

@@ -51,8 +51,9 @@ export function DateRangeSelector({
     const { filters, setFilters } = useFilters()
     const [, setState] = useStokerState()
     const [isInitialized, setIsInitialized] = useState(false)
+    const [isExpandingCache, setIsExpandingCache] = useState(false)
 
-    const { isRouteLoading, isRouteLoadingImmediate } = useRouteLoading()
+    const { isRouteLoading, isRouteLoadingImmediate, setIsRouteLoading } = useRouteLoading()
 
     useEffect(() => {
         if (filters.length === 0 || isInitialized) return
@@ -134,7 +135,7 @@ export function DateRangeSelector({
                 if (!relationList) {
                     setState(`collection-range-${labels.collection.toLowerCase()}`, "range", JSON.stringify(value))
                 }
-                expandCache(collection, value, preloadRange, setPreloadRange)
+                expandCache(collection, value, preloadRange, setPreloadRange, setIsExpandingCache, setIsRouteLoading)
             })
         },
         [preloadRange, rangeFilter, rangeSelector, isInitialized, currentField],
@@ -145,6 +146,7 @@ export function DateRangeSelector({
     const disabled =
         isRouteLoading.has(location.pathname) ||
         (isPreloadCacheEnabled && !preloadRange) ||
+        (isPreloadCacheEnabled && isExpandingCache) ||
         connectionStatus === "offline" ||
         tryFunction(customization.admin?.disableRangeSelector)
     const preventChange = isRouteLoadingImmediate.has(location.pathname)

package/src/utils/expandCache.ts

@@ -4,7 +4,7 @@ import cloneDeep from "lodash/cloneDeep.js"
 import { getRange } from "@stoker-platform/utils"
 import { getTimezone, preloadCollection } from "@stoker-platform/web-client"
 
-export const expandCache = (
+export const expandCache = async (
     collection: CollectionSchema,
     newRange: DateRange,
     preloadRange: DateRange | undefined,
@@ -16,6 +16,8 @@ export const expandCache = (
             | undefined
         >
     >,
+    setIsExpandingCache?: React.Dispatch<React.SetStateAction<boolean>>,
+    setIsRouteLoading?: (operation: "+" | "-", route: string, immediate?: boolean) => void,
 ) => {
     const { labels, preloadCache } = collection
     const timezone = getTimezone()
@@ -40,16 +42,23 @@ export const expandCache = (
             } else if (preloadCacheRangeDates.end) {
                 preloadCacheRange.end = preloadRange.to as Date
             }
-            preloadCollection(labels.collection, undefined, preloadCacheRange)
-            setPreloadRange((prev) => {
-                return {
-                    ...prev,
-                    [labels.collection]: {
-                        from: preloadCacheRange.start as Date,
-                        to: preloadCacheRange.end as Date,
-                    },
-                }
-            })
+            setIsExpandingCache?.(true)
+            setIsRouteLoading?.("+", location.pathname, true)
+            try {
+                await preloadCollection(labels.collection, undefined, preloadCacheRange)
+                setPreloadRange((prev) => {
+                    return {
+                        ...prev,
+                        [labels.collection]: {
+                            from: preloadCacheRange.start as Date,
+                            to: preloadCacheRange.end as Date,
+                        },
+                    }
+                })
+            } finally {
+                setIsExpandingCache?.(false)
+                setIsRouteLoading?.("-", location.pathname)
+            }
         }
     }
 }