@remix-run/router 1.18.0 → 1.19.0-pre.0

package/CHANGELOG.md

@@ -1,5 +1,33 @@
 # `@remix-run/router`
 
+## 1.19.0-pre.0
+
+### Minor Changes
+
+- Add a new `unstable_data()` API for usage with Remix Single Fetch ([#11836](https://github.com/remix-run/react-router/pull/11836))
+
+  - This API is not intended for direct usage in React Router SPA applications
+  - It is primarily intended for usage with `createStaticHandler.query()` to allow loaders/actions to return arbitrary data + `status`/`headers` without forcing the serialization of data into a `Response` instance
+  - This allows for more advanced serialization tactics via `unstable_dataStrategy` such as serializing via `turbo-stream` in Remix Single Fetch
+  - ⚠️ This removes the `status` field from `HandlerResult`
+    - If you need to return a specific `status` from `unstable_dataStrategy` you should instead do so via `unstable_data()`
+
+- Add a new `replace(url, init?)` alternative to `redirect(url, init?)` that performs a `history.replaceState` instead of a `history.pushState` on client-side navigation redirects ([#11811](https://github.com/remix-run/react-router/pull/11811))
+
+### Patch Changes
+
+- Fix internal cleanup of interrupted fetchers to avoid invalid revalidations on navigations ([#11839](https://github.com/remix-run/react-router/pull/11839))
+
+  - When a `fetcher.load` is interrupted by an `action` submission, we track it internally and force revalidation once the `action` completes
+  - We previously only cleared out this internal tracking info on a successful _navigation_ submission
+  - Therefore, if the `fetcher.load` was interrupted by a `fetcher.submit`, then we wouldn't remove it from this internal tracking info on successful load (incorrectly)
+  - And then on the next navigation it's presence in the internal tracking would automatically trigger execution of the `fetcher.load` again, ignoring any `shouldRevalidate` logic
+  - This fix cleans up the internal tracking so it applies to both navigation submission and fetcher submissions
+
+- Fix initial hydration behavior when using `future.v7_partialHydration` along with `unstable_patchRoutesOnMiss` ([#11838](https://github.com/remix-run/react-router/pull/11838))
+
+  - During initial hydration, `router.state.matches` will now include any partial matches so that we can render ancestor `HydrateFallback` components
+
 ## 1.18.0
 
 ### Minor Changes

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 export type { ActionFunction, ActionFunctionArgs, AgnosticDataIndexRouteObject, AgnosticDataNonIndexRouteObject, AgnosticDataRouteMatch, AgnosticDataRouteObject, AgnosticIndexRouteObject, AgnosticNonIndexRouteObject, AgnosticRouteMatch, AgnosticRouteObject, DataStrategyFunction as unstable_DataStrategyFunction, DataStrategyFunctionArgs as unstable_DataStrategyFunctionArgs, DataStrategyMatch as unstable_DataStrategyMatch, ErrorResponse, FormEncType, FormMethod, HandlerResult as unstable_HandlerResult, HTMLFormMethod, JsonFunction, LazyRouteFunction, LoaderFunction, LoaderFunctionArgs, ParamParseKey, Params, AgnosticPatchRoutesOnMissFunction as unstable_AgnosticPatchRoutesOnMissFunction, PathMatch, PathParam, PathPattern, RedirectFunction, ShouldRevalidateFunction, ShouldRevalidateFunctionArgs, TrackedPromise, UIMatch, V7_FormMethod, } from "./utils";
-export { AbortedDeferredError, defer, generatePath, getToPathname, isRouteErrorResponse, joinPaths, json, matchPath, matchRoutes, normalizePathname, redirect, redirectDocument, resolvePath, resolveTo, stripBasename, } from "./utils";
+export { AbortedDeferredError, data as unstable_data, defer, generatePath, getToPathname, isRouteErrorResponse, joinPaths, json, matchPath, matchRoutes, normalizePathname, redirect, redirectDocument, replace, resolvePath, resolveTo, stripBasename, } from "./utils";
 export type { BrowserHistory, BrowserHistoryOptions, HashHistory, HashHistoryOptions, History, InitialEntry, Location, MemoryHistory, MemoryHistoryOptions, Path, To, } from "./history";
 export { Action, createBrowserHistory, createHashHistory, createMemoryHistory, createPath, parsePath, } from "./history";
 export * from "./router";

package/dist/router.cjs.js

@@ -1,5 +1,5 @@
 /**
- * @remix-run/router v1.18.0
+ * @remix-run/router v1.19.0-pre.0
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -1327,6 +1327,23 @@ const json = function json(data, init) {
     headers
   }));
 };
+class DataWithResponseInit {
+  constructor(data, init) {
+    this.type = "DataWithResponseInit";
+    this.data = data;
+    this.init = init || null;
+  }
+}
+
+/**
+ * Create "responses" that contain `status`/`headers` without forcing
+ * serialization into an actual `Response` - used by Remix single fetch
+ */
+function data(data, init) {
+  return new DataWithResponseInit(data, typeof init === "number" ? {
+    status: init
+  } : init);
+}
 class AbortedDeferredError extends Error {}
 class DeferredData {
   constructor(data, responseInit) {
@@ -1509,6 +1526,18 @@ const redirectDocument = (url, init) => {
   response.headers.set("X-Remix-Reload-Document", "true");
   return response;
 };
+
+/**
+ * A redirect response that will perform a `history.replaceState` instead of a
+ * `history.pushState` for client-side navigation redirects.
+ * Sets the status code and the `Location` header.
+ * Defaults to "302 Found".
+ */
+const replace = (url, init) => {
+  let response = redirect(url, init);
+  response.headers.set("X-Remix-Replace", "true");
+  return response;
+};
 /**
  * @private
  * Utility class we use to hold auto-unwrapped 4xx/5xx Response bodies
@@ -1736,7 +1765,7 @@ function createRouter(init) {
   // In SSR apps (with `hydrationData`), we expect that the server will send
   // up the proper matched routes so we don't want to run lazy discovery on
   // initial hydration and want to hydrate into the splat route.
-  if (initialMatches && patchRoutesOnMissImpl && !init.hydrationData) {
+  if (initialMatches && !init.hydrationData) {
     let fogOfWar = checkFogOfWar(initialMatches, dataRoutes, init.history.location.pathname);
     if (fogOfWar.active) {
       initialMatches = null;
@@ -1744,9 +1773,18 @@ function createRouter(init) {
   }
   let initialized;
   if (!initialMatches) {
-    // We need to run patchRoutesOnMiss in initialize()
     initialized = false;
     initialMatches = [];
+
+    // If partial hydration and fog of war is enabled, we will be running
+    // `patchRoutesOnMiss` during hydration so include any partial matches as
+    // the initial matches so we can properly render `HydrateFallback`'s
+    if (future.v7_partialHydration) {
+      let fogOfWar = checkFogOfWar(null, dataRoutes, init.history.location.pathname);
+      if (fogOfWar.active && fogOfWar.matches) {
+        initialMatches = fogOfWar.matches;
+      }
+    }
   } else if (initialMatches.some(m => m.route.lazy)) {
     // All initialMatches need to be loaded before we're ready.  If we have lazy
     // functions around still then we'll need to run them in initialize()
@@ -1839,7 +1877,7 @@ function createRouter(init) {
 
   // Use this internal array to capture fetcher loads that were cancelled by an
   // action navigation and require revalidation
-  let cancelledFetcherLoads = [];
+  let cancelledFetcherLoads = new Set();
 
   // AbortControllers for any in-flight fetchers
   let fetchControllers = new Map();
@@ -2139,7 +2177,6 @@ function createRouter(init) {
     isUninterruptedRevalidation = false;
     isRevalidationRequired = false;
     cancelledDeferredRoutes = [];
-    cancelledFetcherLoads = [];
   }
 
   // Trigger a navigation event, which can either be a numerical POP or a PUSH
@@ -3141,7 +3178,7 @@ function createRouter(init) {
     // There's no need to abort on redirects, since we don't detect the
     // redirect until the action/loaders have settled
     pendingNavigationController = null;
-    let redirectHistoryAction = replace === true ? Action.Replace : Action.Push;
+    let redirectHistoryAction = replace === true || redirect.response.headers.has("X-Remix-Replace") ? Action.Replace : Action.Push;
 
     // Use the incoming submission if provided, fallback on the active one in
     // state.navigation
@@ -3235,7 +3272,7 @@ function createRouter(init) {
     // Abort in-flight fetcher loads
     fetchLoadMatches.forEach((_, key) => {
       if (fetchControllers.has(key)) {
-        cancelledFetcherLoads.push(key);
+        cancelledFetcherLoads.add(key);
         abortFetcher(key);
       }
     });
@@ -3289,6 +3326,7 @@ function createRouter(init) {
     fetchReloadIds.delete(key);
     fetchRedirectIds.delete(key);
     deletedFetchers.delete(key);
+    cancelledFetcherLoads.delete(key);
     state.fetchers.delete(key);
   }
   function deleteFetcherAndUpdateState(key) {
@@ -4404,8 +4442,9 @@ function getMatchesToLoad(history, state, matches, submission, location, isIniti
     if (fetchRedirectIds.has(key)) {
       // Never trigger a revalidation of an actively redirecting fetcher
       shouldRevalidate = false;
-    } else if (cancelledFetcherLoads.includes(key)) {
-      // Always revalidate if the fetcher was cancelled
+    } else if (cancelledFetcherLoads.has(key)) {
+      // Always mark for revalidation if the fetcher was cancelled
+      cancelledFetcherLoads.delete(key);
       shouldRevalidate = true;
     } else if (fetcher && fetcher.state !== "idle" && fetcher.data === undefined) {
       // If the fetcher hasn't ever completed loading yet, then this isn't a
@@ -4727,8 +4766,7 @@ async function callLoaderOrAction(type, request, match, manifest, mapRouteProper
 async function convertHandlerResultToDataResult(handlerResult) {
   let {
     result,
-    type,
-    status
+    type
   } = handlerResult;
   if (isResponse(result)) {
     let data;
@@ -4767,25 +4805,47 @@ async function convertHandlerResultToDataResult(handlerResult) {
     };
   }
   if (type === ResultType.error) {
+    if (isDataWithResponseInit(result)) {
+      var _result$init2;
+      if (result.data instanceof Error) {
+        var _result$init;
+        return {
+          type: ResultType.error,
+          error: result.data,
+          statusCode: (_result$init = result.init) == null ? void 0 : _result$init.status
+        };
+      }
+
+      // Convert thrown unstable_data() to ErrorResponse instances
+      result = new ErrorResponseImpl(((_result$init2 = result.init) == null ? void 0 : _result$init2.status) || 500, undefined, result.data);
+    }
     return {
       type: ResultType.error,
       error: result,
-      statusCode: isRouteErrorResponse(result) ? result.status : status
+      statusCode: isRouteErrorResponse(result) ? result.status : undefined
     };
   }
   if (isDeferredData(result)) {
-    var _result$init, _result$init2;
+    var _result$init3, _result$init4;
     return {
       type: ResultType.deferred,
       deferredData: result,
-      statusCode: (_result$init = result.init) == null ? void 0 : _result$init.status,
-      headers: ((_result$init2 = result.init) == null ? void 0 : _result$init2.headers) && new Headers(result.init.headers)
+      statusCode: (_result$init3 = result.init) == null ? void 0 : _result$init3.status,
+      headers: ((_result$init4 = result.init) == null ? void 0 : _result$init4.headers) && new Headers(result.init.headers)
+    };
+  }
+  if (isDataWithResponseInit(result)) {
+    var _result$init5, _result$init6;
+    return {
+      type: ResultType.data,
+      data: result.data,
+      statusCode: (_result$init5 = result.init) == null ? void 0 : _result$init5.status,
+      headers: (_result$init6 = result.init) != null && _result$init6.headers ? new Headers(result.init.headers) : undefined
     };
   }
   return {
     type: ResultType.data,
-    data: result,
-    statusCode: status
+    data: result
   };
 }
 
@@ -5148,6 +5208,9 @@ function isErrorResult(result) {
 function isRedirectResult(result) {
   return (result && result.type) === ResultType.redirect;
 }
+function isDataWithResponseInit(value) {
+  return typeof value === "object" && value != null && "type" in value && "data" in value && "init" in value && value.type === "DataWithResponseInit";
+}
 function isDeferredData(value) {
   let deferred = value;
   return deferred && typeof deferred === "object" && typeof deferred.data === "object" && typeof deferred.subscribe === "function" && typeof deferred.cancel === "function" && typeof deferred.resolveData === "function";
@@ -5424,6 +5487,7 @@ exports.defer = defer;
 exports.generatePath = generatePath;
 exports.getStaticContextFromError = getStaticContextFromError;
 exports.getToPathname = getToPathname;
+exports.isDataWithResponseInit = isDataWithResponseInit;
 exports.isDeferredData = isDeferredData;
 exports.isRouteErrorResponse = isRouteErrorResponse;
 exports.joinPaths = joinPaths;
@@ -5434,7 +5498,9 @@ exports.normalizePathname = normalizePathname;
 exports.parsePath = parsePath;
 exports.redirect = redirect;
 exports.redirectDocument = redirectDocument;
+exports.replace = replace;
 exports.resolvePath = resolvePath;
 exports.resolveTo = resolveTo;
 exports.stripBasename = stripBasename;
+exports.unstable_data = data;
 //# sourceMappingURL=router.cjs.js.map