@tanstack/router-core 1.120.4 → 1.120.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/router-core",
-  "version": "1.120.4",
+  "version": "1.120.5",
   "description": "Modern and scalable routing for React applications",
   "author": "Tanner Linsley",
   "license": "MIT",

package/src/route.ts

@@ -960,7 +960,7 @@ type AssetFnContextOptions<
     TLoaderDeps
   >
   params: ResolveAllParamsFromParent<TParentRoute, TParams>
-  loaderData: ResolveLoaderData<TLoaderFn>
+  loaderData?: ResolveLoaderData<TLoaderFn>
 }
 
 export interface DefaultUpdatableRouteOptionsExtensions {
@@ -1070,9 +1070,20 @@ export interface UpdatableRouteOptions<
       TLoaderDeps
     >,
   ) => void
-  headers?: (ctx: {
-    loaderData: ResolveLoaderData<TLoaderFn>
-  }) => Record<string, string>
+  headers?: (
+    ctx: AssetFnContextOptions<
+      TRouteId,
+      TFullPath,
+      TParentRoute,
+      TParams,
+      TSearchValidator,
+      TLoaderFn,
+      TRouterContext,
+      TRouteContextFn,
+      TBeforeLoadFn,
+      TLoaderDeps
+    >,
+  ) => Record<string, string>
   head?: (
     ctx: AssetFnContextOptions<
       TRouteId,

package/src/router.ts

@@ -1447,26 +1447,6 @@ export class RouterCore<
           ...match.__beforeLoadContext,
         }
       }
-
-      // If it's already a success, update headers and head content
-      // These may get updated again if the match is refreshed
-      // due to being stale
-      if (match.status === 'success') {
-        match.headers = route.options.headers?.({
-          loaderData: match.loaderData,
-        })
-        const assetContext = {
-          matches,
-          match,
-          params: match.params,
-          loaderData: match.loaderData,
-        }
-        const headFnContent = route.options.head?.(assetContext)
-        match.links = headFnContent?.links
-        match.headScripts = headFnContent?.scripts
-        match.meta = headFnContent?.meta
-        match.scripts = route.options.scripts?.(assetContext)
-      }
     })
 
     return matches
@@ -2609,6 +2589,35 @@ export class RouterCore<
                         !this.state.matches.find((d) => d.id === matchId),
                     }))
 
+                    const executeHead = () => {
+                      const match = this.getMatch(matchId)
+                      // in case of a redirecting match during preload, the match does not exist
+                      if (!match) {
+                        return
+                      }
+                      const assetContext = {
+                        matches,
+                        match,
+                        params: match.params,
+                        loaderData: match.loaderData,
+                      }
+                      const headFnContent = route.options.head?.(assetContext)
+                      const meta = headFnContent?.meta
+                      const links = headFnContent?.links
+                      const headScripts = headFnContent?.scripts
+
+                      const scripts = route.options.scripts?.(assetContext)
+                      const headers = route.options.headers?.(assetContext)
+                      updateMatch(matchId, (prev) => ({
+                        ...prev,
+                        meta,
+                        links,
+                        headScripts,
+                        headers,
+                        scripts,
+                      }))
+                    }
+
                     const runLoader = async () => {
                       try {
                         // If the Matches component rendered
@@ -2649,40 +2658,21 @@ export class RouterCore<
 
                           await potentialPendingMinPromise()
 
-                          const assetContext = {
-                            matches,
-                            match: this.getMatch(matchId)!,
-                            params: this.getMatch(matchId)!.params,
-                            loaderData,
-                          }
-                          const headFnContent =
-                            route.options.head?.(assetContext)
-                          const meta = headFnContent?.meta
-                          const links = headFnContent?.links
-                          const headScripts = headFnContent?.scripts
-
-                          const scripts = route.options.scripts?.(assetContext)
-                          const headers = route.options.headers?.({
-                            loaderData,
-                          })
-
                           // Last but not least, wait for the the components
                           // to be preloaded before we resolve the match
                           await route._componentsPromise
 
-                          updateMatch(matchId, (prev) => ({
-                            ...prev,
-                            error: undefined,
-                            status: 'success',
-                            isFetching: false,
-                            updatedAt: Date.now(),
-                            loaderData,
-                            meta,
-                            links,
-                            headScripts,
-                            headers,
-                            scripts,
-                          }))
+                          batch(() => {
+                            updateMatch(matchId, (prev) => ({
+                              ...prev,
+                              error: undefined,
+                              status: 'success',
+                              isFetching: false,
+                              updatedAt: Date.now(),
+                              loaderData,
+                            }))
+                            executeHead()
+                          })
                         } catch (e) {
                           let error = e
 
@@ -2700,12 +2690,15 @@ export class RouterCore<
                             )
                           }
 
-                          updateMatch(matchId, (prev) => ({
-                            ...prev,
-                            error,
-                            status: 'error',
-                            isFetching: false,
-                          }))
+                          batch(() => {
+                            updateMatch(matchId, (prev) => ({
+                              ...prev,
+                              error,
+                              status: 'error',
+                              isFetching: false,
+                            }))
+                            executeHead()
+                          })
                         }
 
                         this.serverSsr?.onMatchSettled({
@@ -2713,10 +2706,13 @@ export class RouterCore<
                           match: this.getMatch(matchId)!,
                         })
                       } catch (err) {
-                        updateMatch(matchId, (prev) => ({
-                          ...prev,
-                          loaderPromise: undefined,
-                        }))
+                        batch(() => {
+                          updateMatch(matchId, (prev) => ({
+                            ...prev,
+                            loaderPromise: undefined,
+                          }))
+                          executeHead()
+                        })
                         handleRedirectAndNotFound(this.getMatch(matchId)!, err)
                       }
                     }
@@ -2752,6 +2748,11 @@ export class RouterCore<
                       (loaderShouldRunAsync && sync)
                     ) {
                       await runLoader()
+                    } else {
+                      // if the loader did not run, still update head.
+                      // reason: parent's beforeLoad may have changed the route context
+                      // and only now do we know the route context (and that the loader would not run)
+                      executeHead()
                     }
                   }
                   if (!loaderIsRunningAsync) {