@tanstack/react-router 0.0.1-beta.216 → 0.0.1-beta.218

package/build/types/RouterProvider.d.ts

@@ -76,6 +76,7 @@ export interface RouteMatch<TRouteTree extends AnyRoute = AnyRoute, TRouteId ext
     routeSearch: RouteById<TRouteTree, TRouteId>['types']['searchSchema'];
     search: FullSearchSchema<TRouteTree> & RouteById<TRouteTree, TRouteId>['types']['fullSearchSchema'];
     fetchedAt: number;
+    shouldReloadDeps: any;
     abortController: AbortController;
 }
 export type AnyRouteMatch = RouteMatch<any>;

package/build/types/route.d.ts

@@ -34,7 +34,7 @@ export type ParamsFallback<TPath extends string, TParams> = unknown extends TPar
 export type BaseRouteOptions<TParentRoute extends AnyRoute = AnyRoute, TCustomId extends string = string, TPath extends string = string, TSearchSchema extends Record<string, any> = {}, TFullSearchSchema extends Record<string, any> = TSearchSchema, TParams extends AnyPathParams = {}, TAllParams = ParamsFallback<TPath, TParams>, TRouteContext extends RouteContext = RouteContext, TAllContext extends Record<string, any> = AnyContext, TLoaderData extends any = unknown> = RoutePathOptions<TCustomId, TPath> & {
     getParentRoute: () => TParentRoute;
     validateSearch?: SearchSchemaValidator<TSearchSchema>;
-    shouldReload?: (match: LoaderFnContext<TAllParams, TFullSearchSchema, TAllContext, TRouteContext>) => any;
+    shouldReload?: boolean | ((match: LoaderFnContext<TAllParams, TFullSearchSchema, TAllContext, TRouteContext>) => any);
 } & (keyof PickRequired<RouteContext> extends never ? {
     beforeLoad?: BeforeLoadFn<TFullSearchSchema, TParentRoute, TAllParams, TRouteContext>;
 } : {

package/build/types/utils.d.ts

@@ -48,7 +48,7 @@ export declare function pick<T, K extends keyof T>(parent: T, keys: K[]): Pick<T
  */
 export declare function replaceEqualDeep<T>(prev: any, _next: T): T;
 export declare function isPlainObject(o: any): boolean;
-export declare function partialDeepEqual(a: any, b: any): boolean;
+export declare function deepEqual(a: any, b: any, partial?: boolean): boolean;
 export declare function useStableCallback<T extends (...args: any[]) => any>(fn: T): T;
 export declare function shallow<T>(objA: T, objB: T): boolean;
 export type StrictOrFrom<TFrom> = {

package/build/umd/index.development.js

@@ -558,7 +558,7 @@
   function hasObjectPrototype(o) {
     return Object.prototype.toString.call(o) === '[object Object]';
   }
-  function partialDeepEqual(a, b) {
+  function deepEqual(a, b, partial = false) {
     if (a === b) {
       return true;
     }
@@ -566,10 +566,15 @@
       return false;
     }
     if (isPlainObject(a) && isPlainObject(b)) {
-      return !Object.keys(b).some(key => !partialDeepEqual(a[key], b[key]));
+      const aKeys = Object.keys(a);
+      const bKeys = Object.keys(b);
+      if (!partial && aKeys.length !== bKeys.length) {
+        return false;
+      }
+      return !bKeys.some(key => !(key in a) || !deepEqual(a[key], b[key], partial));
     }
     if (Array.isArray(a) && Array.isArray(b)) {
-      return !(a.length !== b.length || a.some((item, index) => !partialDeepEqual(item, b[index])));
+      return !a.some((item, index) => !deepEqual(item, b[index], partial));
     }
     return false;
   }
@@ -1356,6 +1361,7 @@
           loadPromise: Promise.resolve(),
           context: undefined,
           abortController: new AbortController(),
+          shouldReloadDeps: undefined,
           fetchedAt: 0
         };
         return routeMatch;
@@ -1704,7 +1710,16 @@
             };
 
             // Default to reloading the route all the time
-            const shouldReload = route.options.shouldReload?.(loaderContext) ?? true;
+            let shouldReload = true;
+            let shouldReloadDeps = typeof route.options.shouldReload === 'function' ? route.options.shouldReload?.(loaderContext) : !!route.options.shouldReload;
+            if (typeof shouldReloadDeps === 'object') {
+              // compare the deps to see if they've changed
+              shouldReload = !deepEqual(shouldReloadDeps, match.shouldReloadDeps);
+              console.log(shouldReloadDeps, match.shouldReloadDeps, shouldReload);
+              match.shouldReloadDeps = shouldReloadDeps;
+            } else {
+              shouldReload = !!shouldReloadDeps;
+            }
 
             // If the user doesn't want the route to reload, just
             // resolve with the existing loader data
@@ -1907,7 +1922,7 @@
       // Combine the matches based on user options
       const pathTest = activeOptions?.exact ? latestLocationRef.current.pathname === next.pathname : pathIsFuzzyEqual;
       const hashTest = activeOptions?.includeHash ? latestLocationRef.current.hash === next.hash : true;
-      const searchTest = activeOptions?.includeSearch ?? true ? partialDeepEqual(latestLocationRef.current.search, next.search) : true;
+      const searchTest = activeOptions?.includeSearch ?? true ? deepEqual(latestLocationRef.current.search, next.search, true) : true;
 
       // The final "active" test
       const isActive = pathTest && hashTest && searchTest;
@@ -2038,7 +2053,7 @@
         return false;
       }
       if (match && (opts?.includeSearch ?? true)) {
-        return partialDeepEqual(baseLocation.search, next.search) ? match : false;
+        return deepEqual(baseLocation.search, next.search, true) ? match : false;
       }
       return match;
     });
@@ -2126,7 +2141,7 @@
     const PendingComponent = route.options.pendingComponent ?? options.defaultPendingComponent ?? defaultPending;
     const routeErrorComponent = route.options.errorComponent ?? options.defaultErrorComponent ?? ErrorComponent;
     const ResolvedSuspenseBoundary = route.options.wrapInSuspense ? React__namespace.Suspense : SafeFragment;
-    const errorComponent = React__namespace.useCallback(props => {
+    const errorComponent = routeErrorComponent ? React__namespace.useCallback(props => {
       return /*#__PURE__*/React__namespace.createElement(routeErrorComponent, {
         ...props,
         useMatch: route.useMatch,
@@ -2134,7 +2149,7 @@
         useSearch: route.useSearch,
         useParams: route.useParams
       });
-    }, [route]);
+    }, [route]) : undefined;
     return /*#__PURE__*/React__namespace.createElement(matchesContext.Provider, {
       value: matches
     }, /*#__PURE__*/React__namespace.createElement(ResolvedSuspenseBoundary, {
@@ -2144,7 +2159,7 @@
         useSearch: route.useSearch,
         useParams: route.useParams
       })
-    }, /*#__PURE__*/React__namespace.createElement(CatchBoundary, {
+    }, errorComponent ? /*#__PURE__*/React__namespace.createElement(CatchBoundary, {
       resetKey: locationKey,
       errorComponent: errorComponent,
       onCatch: () => {
@@ -2152,6 +2167,8 @@
       }
     }, /*#__PURE__*/React__namespace.createElement(MatchInner, {
       match: match
+    })) : /*#__PURE__*/React__namespace.createElement(SafeFragment, null, /*#__PURE__*/React__namespace.createElement(MatchInner, {
+      match: match
     }))));
   }
   function MatchInner({
@@ -2764,6 +2781,7 @@
   exports.createMemoryHistory = createMemoryHistory;
   exports.createRouteMask = createRouteMask;
   exports.decode = decode;
+  exports.deepEqual = deepEqual;
   exports.defaultParseSearch = defaultParseSearch;
   exports.defaultStringifySearch = defaultStringifySearch;
   exports.encode = encode;
@@ -2784,7 +2802,6 @@
   exports.matchesContext = matchesContext;
   exports.parsePathname = parsePathname;
   exports.parseSearchWith = parseSearchWith;
-  exports.partialDeepEqual = partialDeepEqual;
   exports.pick = pick;
   exports.redirect = redirect;
   exports.replaceEqualDeep = replaceEqualDeep;