@tanstack/react-router 0.0.1-beta.282 → 0.0.1-beta.284

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tanstack/react-router",
   "author": "Tanner Linsley",
-  "version": "0.0.1-beta.282",
+  "version": "0.0.1-beta.284",
   "license": "MIT",
   "repository": "tanstack/router",
   "homepage": "https://tanstack.com/router",
@@ -44,7 +44,7 @@
     "@tanstack/store": "^0.1.3",
     "tiny-invariant": "^1.3.1",
     "tiny-warning": "^1.0.3",
-    "@tanstack/history": "0.0.1-beta.282"
+    "@tanstack/history": "0.0.1-beta.284"
   },
   "scripts": {
     "build": "rollup --config rollup.config.js"

package/src/Matches.tsx

@@ -43,6 +43,7 @@ export interface RouteMatch<
   abortController: AbortController
   cause: 'preload' | 'enter' | 'stay'
   loaderDeps: RouteById<TRouteTree, TRouteId>['types']['loaderDeps']
+  preload: boolean
   invalid: boolean
 }
 

package/src/link.tsx

@@ -178,7 +178,10 @@ export type SearchParamOptions<
           >
         >
       >,
-  TFromSearchOptional = Omit<FullSearchSchema<TRouteTree>, keyof TFromSearchEnsured>,
+  TFromSearchOptional = Omit<
+    FullSearchSchema<TRouteTree>,
+    keyof TFromSearchEnsured
+  >,
   TFromSearch = Expand<TFromSearchEnsured & TFromSearchOptional>,
   TToSearch = '' extends TTo
     ? FullSearchSchema<TRouteTree>
@@ -207,15 +210,19 @@ export type PathParamOptions<
   TFromParamsOptional = Omit<AllParams<TRouteTree>, keyof TFromParamsEnsured>,
   TFromParams = Expand<TFromParamsOptional & TFromParamsEnsured>,
   TToParams = Expand<RouteByPath<TRouteTree, TTo>['types']['allParams']>,
-> = keyof PickRequired<TToParams> extends never
+> = never extends TToParams
   ? {
-      params?: true | ParamsReducer<TFromParams, TToParams>
-    }
-  : {
-      params: TFromParamsEnsured extends PickRequired<TToParams>
-        ? true | ParamsReducer<TFromParams, TToParams>
-        : ParamsReducer<TFromParams, TToParams>
+      params?: true | ParamsReducer<Partial<TFromParams>, Partial<TFromParams>>
     }
+  : keyof PickRequired<TToParams> extends never
+    ? {
+        params?: true | ParamsReducer<TFromParams, TToParams>
+      }
+    : {
+        params: TFromParamsEnsured extends PickRequired<TToParams>
+          ? true | ParamsReducer<TFromParams, TToParams>
+          : ParamsReducer<TFromParams, TToParams>
+      }
 
 type ParamsReducer<TFrom, TTo> = TTo | ((current: TFrom) => TTo)
 

package/src/router.ts

@@ -669,6 +669,7 @@ export class Router<
             cause,
             loaderDeps,
             invalid: false,
+            preload: false,
           }
 
       // Regardless of whether we're reusing an existing match or creating
@@ -1257,6 +1258,12 @@ export class Router<
               ? shouldReloadOption(loaderContext)
               : shouldReloadOption
 
+          matches[index] = match = {
+            ...match,
+            preload:
+              !!preload && !this.state.matches.find((d) => d.id === match.id),
+          }
+
           if (match.status !== 'success') {
             // If we need to potentially show the pending component,
             // start a timer to show it after the pendingMs
@@ -1328,23 +1335,7 @@ export class Router<
       const previousMatches = this.state.matches
 
       this.__store.batch(() => {
-        // This is where all of the garbage collection magic happens
-        this.__store.setState((s) => {
-          return {
-            ...s,
-            cachedMatches: s.cachedMatches.filter((d) => {
-              const route = this.looseRoutesById[d.routeId]!
-
-              return (
-                d.status !== 'error' &&
-                Date.now() - d.updatedAt <
-                  (route.options.gcTime ??
-                    this.options.defaultGcTime ??
-                    5 * 60 * 1000)
-              )
-            }),
-          }
-        })
+        this.cleanCache()
 
         // Match the routes
         pendingMatches = this.matchRoutes(next.pathname, next.search, {
@@ -1393,16 +1384,19 @@ export class Router<
 
         // Commit the pending matches. If a previous match was
         // removed, place it in the cachedMatches
-        this.__store.setState((s) => ({
-          ...s,
-          isLoading: false,
-          matches: pendingMatches,
-          pendingMatches: undefined,
-          cachedMatches: [
-            ...s.cachedMatches,
-            ...exitingMatches.filter((d) => d.status !== 'error'),
-          ],
-        }))
+        this.__store.batch(() => {
+          this.__store.setState((s) => ({
+            ...s,
+            isLoading: false,
+            matches: s.pendingMatches!,
+            pendingMatches: undefined,
+            cachedMatches: [
+              ...s.cachedMatches,
+              ...exitingMatches.filter((d) => d.status !== 'error'),
+            ],
+          }))
+          this.cleanCache()
+        })
 
         //
         ;(
@@ -1440,6 +1434,32 @@ export class Router<
     return this.latestLoadPromise
   }
 
+  cleanCache = () => {
+    // This is where all of the garbage collection magic happens
+    this.__store.setState((s) => {
+      return {
+        ...s,
+        cachedMatches: s.cachedMatches.filter((d) => {
+          const route = this.looseRoutesById[d.routeId]!
+
+          if (!route.options.loader) {
+            return false
+          }
+
+          // If the route was preloaded, use the preloadGcTime
+          // otherwise, use the gcTime
+          const gcTime =
+            (d.preload
+              ? route.options.preloadGcTime ?? this.options.defaultPreloadGcTime
+              : route.options.gcTime ?? this.options.defaultGcTime) ??
+            5 * 60 * 1000
+
+          return d.status !== 'error' && Date.now() - d.updatedAt < gcTime
+        }),
+      }
+    })
+  }
+
   preloadRoute = async (
     navigateOpts: ToOptions<TRouteTree> = this.state.location as any,
   ) => {