@tanstack/react-router 1.16.2 → 1.16.5

package/dist/esm/router.js

@@ -2,7 +2,7 @@ import { createBrowserHistory, createMemoryHistory } from "@tanstack/history";
 import { Store } from "@tanstack/react-store";
 import { rootRouteId } from "./route.js";
 import { defaultStringifySearch, defaultParseSearch } from "./searchParams.js";
-import { replaceEqualDeep, pick, deepEqual, escapeJSON, last, functionalUpdate } from "./utils.js";
+import { replaceEqualDeep, pick, isServer, deepEqual, escapeJSON, last, functionalUpdate } from "./utils.js";
 import { getRouteMatch } from "./RouterProvider.js";
 import { trimPath, trimPathLeft, parsePathname, resolvePath, cleanPath, matchPathname, trimPathRight, interpolatePath, joinPaths } from "./path.js";
 import invariant from "tiny-invariant";
@@ -552,111 +552,94 @@ class Router {
           };
         });
       };
-      try {
-        for (let [index, match] of matches.entries()) {
-          const parentMatch = matches[index - 1];
-          const route = this.looseRoutesById[match.routeId];
-          const abortController = new AbortController();
-          const handleErrorAndRedirect = (err, code) => {
-            var _a2, _b2;
-            err.routerCode = code;
-            firstBadMatchIndex = firstBadMatchIndex ?? index;
-            if (isRedirect(err)) {
-              throw err;
-            }
-            if (isNotFound(err)) {
-              this.updateMatchesWithNotFound(matches, match, err);
-            }
-            try {
-              (_b2 = (_a2 = route.options).onError) == null ? void 0 : _b2.call(_a2, err);
-            } catch (errorHandlerErr) {
-              err = errorHandlerErr;
-              if (isRedirect(errorHandlerErr)) {
-                throw errorHandlerErr;
-              }
-            }
-            matches[index] = match = {
-              ...match,
-              error: err,
-              status: "error",
-              updatedAt: Date.now(),
-              abortController: new AbortController()
-            };
-          };
+      for (let [index, match] of matches.entries()) {
+        const parentMatch = matches[index - 1];
+        const route = this.looseRoutesById[match.routeId];
+        const abortController = new AbortController();
+        const handleError = (err, code) => {
+          var _a2, _b2;
+          err.routerCode = code;
+          firstBadMatchIndex = firstBadMatchIndex ?? index;
+          if (isRedirect(err)) {
+            throw err;
+          }
+          if (isNotFound(err)) {
+            err.routeId = match.routeId;
+            throw err;
+          }
           try {
-            if (match.paramsError) {
-              handleErrorAndRedirect(match.paramsError, "PARSE_PARAMS");
-            }
-            if (match.searchError) {
-              handleErrorAndRedirect(match.searchError, "VALIDATE_SEARCH");
-            }
-            const parentContext = (parentMatch == null ? void 0 : parentMatch.context) ?? this.options.context ?? {};
-            const pendingMs = route.options.pendingMs ?? this.options.defaultPendingMs;
-            const pendingPromise = typeof pendingMs === "number" && pendingMs <= 0 ? Promise.resolve() : new Promise((r) => setTimeout(r, pendingMs));
-            const beforeLoadContext = await ((_b = (_a = route.options).beforeLoad) == null ? void 0 : _b.call(_a, {
-              search: match.search,
-              abortController,
-              params: match.params,
-              preload: !!preload,
-              context: parentContext,
-              location: this.state.location,
-              // TOOD: just expose state and router, etc
-              navigate: (opts) => this.navigate({ ...opts, from: match.pathname }),
-              buildLocation: this.buildLocation,
-              cause: preload ? "preload" : match.cause
-            })) ?? {};
-            if (isRedirect(beforeLoadContext)) {
-              throw beforeLoadContext;
+            (_b2 = (_a2 = route.options).onError) == null ? void 0 : _b2.call(_a2, err);
+          } catch (errorHandlerErr) {
+            err = errorHandlerErr;
+            if (isRedirect(errorHandlerErr)) {
+              throw errorHandlerErr;
             }
-            const context = {
-              ...parentContext,
-              ...beforeLoadContext
-            };
-            matches[index] = match = {
-              ...match,
-              routeContext: replaceEqualDeep(
-                match.routeContext,
-                beforeLoadContext
-              ),
-              context: replaceEqualDeep(match.context, context),
-              abortController,
-              pendingPromise
-            };
-          } catch (err) {
-            handleErrorAndRedirect(err, "BEFORE_LOAD");
-            break;
           }
+          matches[index] = match = {
+            ...match,
+            error: err,
+            status: "error",
+            updatedAt: Date.now(),
+            abortController: new AbortController()
+          };
+        };
+        try {
+          if (match.paramsError) {
+            handleError(match.paramsError, "PARSE_PARAMS");
+          }
+          if (match.searchError) {
+            handleError(match.searchError, "VALIDATE_SEARCH");
+          }
+          const parentContext = (parentMatch == null ? void 0 : parentMatch.context) ?? this.options.context ?? {};
+          const pendingMs = route.options.pendingMs ?? this.options.defaultPendingMs;
+          const pendingPromise = typeof pendingMs === "number" && pendingMs <= 0 ? Promise.resolve() : new Promise((r) => setTimeout(r, pendingMs));
+          const beforeLoadContext = await ((_b = (_a = route.options).beforeLoad) == null ? void 0 : _b.call(_a, {
+            search: match.search,
+            abortController,
+            params: match.params,
+            preload: !!preload,
+            context: parentContext,
+            location: this.state.location,
+            // TOOD: just expose state and router, etc
+            navigate: (opts) => this.navigate({ ...opts, from: match.pathname }),
+            buildLocation: this.buildLocation,
+            cause: preload ? "preload" : match.cause
+          })) ?? {};
+          if (isRedirect(beforeLoadContext)) {
+            throw beforeLoadContext;
+          }
+          const context = {
+            ...parentContext,
+            ...beforeLoadContext
+          };
+          matches[index] = match = {
+            ...match,
+            routeContext: replaceEqualDeep(match.routeContext, beforeLoadContext),
+            context: replaceEqualDeep(match.context, context),
+            abortController,
+            pendingPromise
+          };
+        } catch (err) {
+          handleError(err, "BEFORE_LOAD");
+          break;
         }
-      } catch (err) {
-        if (isRedirect(err)) {
-          if (!preload)
-            this.navigate(err);
-          return matches;
-        }
-        throw err;
       }
       const validResolvedMatches = matches.slice(0, firstBadMatchIndex);
       const matchPromises = [];
       validResolvedMatches.forEach((match, index) => {
         matchPromises.push(
-          new Promise(async (resolve) => {
+          new Promise(async (resolve, reject) => {
             var _a2;
             const parentMatchPromise = matchPromises[index - 1];
             const route = this.looseRoutesById[match.routeId];
-            const handleErrorAndRedirect = (err) => {
+            const handleError = (err) => {
               if (isRedirect(err)) {
-                if (!preload) {
-                  this.navigate(err);
-                }
-                return true;
+                throw err;
               }
               if (isNotFound(err)) {
-                if (!preload) {
-                  this.updateMatchesWithNotFound(matches, match, err);
-                }
-                return true;
+                err.routeId = match.routeId;
+                throw err;
               }
-              return false;
             };
             let loadPromise;
             matches[index] = match = {
@@ -724,10 +707,7 @@ class Router {
                 const loaderData = await loadPromise;
                 if (latestPromise = checkLatest())
                   return await latestPromise;
-                if (isRedirect(loaderData) || isNotFound(loaderData)) {
-                  if (handleErrorAndRedirect(loaderData))
-                    return;
-                }
+                handleError(loaderData);
                 if (didShowPending && pendingMinMs) {
                   await new Promise((r) => setTimeout(r, pendingMinMs));
                 }
@@ -735,6 +715,7 @@ class Router {
                   return await latestPromise;
                 const [meta, headers] = await Promise.all([
                   (_d = (_c = route.options).meta) == null ? void 0 : _d.call(_c, {
+                    params: match.params,
                     loaderData
                   }),
                   (_f = (_e = route.options).headers) == null ? void 0 : _f.call(_e, {
@@ -755,14 +736,12 @@ class Router {
               } catch (error) {
                 if (latestPromise = checkLatest())
                   return await latestPromise;
-                if (handleErrorAndRedirect(error))
-                  return;
+                handleError(error);
                 try {
                   (_h = (_g = route.options).onError) == null ? void 0 : _h.call(_g, error);
                 } catch (onErrorError) {
                   error = onErrorError;
-                  if (handleErrorAndRedirect(onErrorError))
-                    return;
+                  handleError(onErrorError);
                 }
                 matches[index] = match = {
                   ...match,
@@ -782,23 +761,27 @@ class Router {
               ...match,
               preload: !!preload && !this.state.matches.find((d) => d.id === match.id)
             };
-            if (match.status !== "success") {
-              if (shouldPending) {
-                (_a2 = match.pendingPromise) == null ? void 0 : _a2.then(async () => {
-                  if (latestPromise = checkLatest())
-                    return latestPromise;
-                  didShowPending = true;
-                  matches[index] = match = {
-                    ...match,
-                    showPending: true
-                  };
-                  updateMatch(match);
-                  resolve();
-                });
+            try {
+              if (match.status !== "success") {
+                if (shouldPending) {
+                  (_a2 = match.pendingPromise) == null ? void 0 : _a2.then(async () => {
+                    if (latestPromise = checkLatest())
+                      return latestPromise;
+                    didShowPending = true;
+                    matches[index] = match = {
+                      ...match,
+                      showPending: true
+                    };
+                    updateMatch(match);
+                    resolve();
+                  });
+                }
+                await fetch();
+              } else if (match.invalid || (shouldReload ?? age > staleAge)) {
+                fetch();
               }
-              await fetch();
-            } else if (match.invalid || (shouldReload ?? age > staleAge)) {
-              fetch();
+            } catch (err) {
+              reject(err);
             }
             resolve();
           })
@@ -808,20 +791,6 @@ class Router {
       return matches;
     };
     this.invalidate = () => {
-      const invalidate = (d) => ({
-        ...d,
-        invalid: true
-      });
-      this.__store.setState((s) => {
-        var _a;
-        return {
-          ...s,
-          matches: s.matches.map(invalidate),
-          cachedMatches: s.cachedMatches.map(invalidate),
-          pendingMatches: (_a = s.pendingMatches) == null ? void 0 : _a.map(invalidate)
-        };
-      });
-      this.load();
     };
     this.load = async () => {
       const promise = new Promise(async (resolve, reject) => {
@@ -860,6 +829,11 @@ class Router {
               checkLatest: () => this.checkLatest(promise)
             });
           } catch (err) {
+            if (isRedirect(err)) {
+              this.handleRedirect(err);
+            } else if (isNotFound(err)) {
+              this.handleNotFound(pendingMatches, err);
+            }
           }
           if (latestPromise = this.checkLatest(promise)) {
             return latestPromise;
@@ -913,6 +887,15 @@ class Router {
       this.latestLoadPromise = promise;
       return this.latestLoadPromise;
     };
+    this.handleRedirect = (err) => {
+      if (!err.href) {
+        err.href = this.buildLocation(err).href;
+      }
+      if (isServer) {
+        throw err;
+      }
+      this.navigate(err);
+    };
     this.cleanCache = () => {
       this.__store.setState((s) => {
         return {
@@ -951,12 +934,19 @@ class Router {
           }
         });
       });
-      matches = await this.loadMatches({
-        matches,
-        preload: true,
-        checkLatest: () => void 0
-      });
-      return matches;
+      try {
+        matches = await this.loadMatches({
+          matches,
+          preload: true,
+          checkLatest: () => void 0
+        });
+        return matches;
+      } catch (err) {
+        if (!isRedirect(err) && !isNotFound(err)) {
+          console.error(err);
+        }
+        return void 0;
+      }
     };
     this.matchRoute = (location, opts) => {
       const matchLocation = {
@@ -1092,6 +1082,7 @@ class Router {
             ...match,
             ...dehydratedMatch,
             meta: (_b2 = (_a2 = route.options).meta) == null ? void 0 : _b2.call(_a2, {
+              params: match.params,
               loaderData: dehydratedMatch.loaderData
             }),
             links: (_d = (_c2 = route.options).links) == null ? void 0 : _d.call(_c2),
@@ -1108,27 +1099,29 @@ class Router {
         };
       });
     };
-    this.updateMatchesWithNotFound = (matches, currentMatch, err) => {
+    this.handleNotFound = (matches, err) => {
       const matchesByRouteId = Object.fromEntries(
         matches.map((match) => [match.routeId, match])
       );
-      if (err.global) {
-        matchesByRouteId[rootRouteId].notFoundError = err;
-      } else {
-        let currentRoute = this.routesById[err.route ?? currentMatch.routeId];
-        while (!currentRoute.options.notFoundComponent) {
-          currentRoute = currentRoute == null ? void 0 : currentRoute.parentRoute;
-          invariant(
-            currentRoute,
-            "Found invalid route tree while trying to find not-found handler."
-          );
-          if (currentRoute.id === rootRouteId)
-            break;
+      if (!err.global && err.routeId) {
+        let currentRoute = this.looseRoutesById[err.routeId];
+        if (currentRoute) {
+          while (!currentRoute.options.notFoundComponent) {
+            currentRoute = currentRoute == null ? void 0 : currentRoute.parentRoute;
+            invariant(
+              currentRoute,
+              "Found invalid route tree while trying to find not-found handler."
+            );
+            if (currentRoute.id === rootRouteId)
+              break;
+          }
+          const match = matchesByRouteId[currentRoute.id];
+          invariant(match, "Could not find match for route: " + currentRoute.id);
+          match.notFoundError = err;
+          return;
         }
-        const match = matchesByRouteId[currentRoute.id];
-        invariant(match, "Could not find match for route: " + currentRoute.id);
-        match.notFoundError = err;
       }
+      matchesByRouteId[rootRouteId].notFoundError = err;
     };
     this.hasNotFoundMatch = () => {
       return this.__store.state.matches.some((d) => d.notFoundError);