Clean up types within consolidated package (#12177)

.changeset/sour-cycles-lie.md

@@ -0,0 +1,11 @@
+---
+"@react-router/dev": major
+"react-router": major
+---
+
+- Consolidate types previously duplicated across `@remix-run/router`, `@remix-run/server-runtime`, and `@remix-run/react` now that they all live in `react-router`
+  - Examples: `LoaderFunction`, `LoaderFunctionArgs`, `ActionFunction`, `ActionFunctionArgs`, `DataFunctionArgs`, `RouteManifest`, `LinksFunction`, `Route`, `EntryRoute`
+  - The `RouteManifest` type used by the "remix" code is now slightly stricter because it is using the former `@remix-run/router` `RouteManifest`
+    - `Record<string, Route> -> Record<string, Route | undefined>`
+  - Removed `AppData` type in favor of inlining `unknown` in the few locations it was used
+  - Removed `ServerRuntimeMeta*` types in favor of the `Meta*` types they were duplicated from

packages/react-router-dev/vite/plugin.ts

@@ -2023,11 +2023,13 @@ function groupRoutesByParentId(manifest: ServerBuild["routes"]) {
   let routes: Record<string, Omit<ServerRoute, "children">[]> = {};
 
   Object.values(manifest).forEach((route) => {
-    let parentId = route.parentId || "";
-    if (!routes[parentId]) {
-      routes[parentId] = [];
+    if (route) {
+      let parentId = route.parentId || "";
+      if (!routes[parentId]) {
+        routes[parentId] = [];
+      }
+      routes[parentId].push(route);
     }
-    routes[parentId].push(route);
   });
 
   return routes;

packages/react-router-dev/vite/styles.ts

@@ -171,14 +171,16 @@ const findDeps = async (
 };
 
 const groupRoutesByParentId = (manifest: ServerRouteManifest) => {
-  let routes: Record<string, Omit<ServerRoute, "children">[]> = {};
+  let routes: Record<string, NonNullable<ServerRoute>[]> = {};
 
   Object.values(manifest).forEach((route) => {
-    let parentId = route.parentId || "";
-    if (!routes[parentId]) {
-      routes[parentId] = [];
+    if (route) {
+      let parentId = route.parentId || "";
+      if (!routes[parentId]) {
+        routes[parentId] = [];
+      }
+      routes[parentId].push(route);
     }
-    routes[parentId].push(route);
   });
 
   return routes;
@@ -189,11 +191,8 @@ const groupRoutesByParentId = (manifest: ServerRouteManifest) => {
 const createRoutes = (
   manifest: ServerRouteManifest,
   parentId: string = "",
-  routesByParentId: Record<
-    string,
-    Omit<ServerRoute, "children">[]
-  > = groupRoutesByParentId(manifest)
-): ServerRoute[] => {
+  routesByParentId = groupRoutesByParentId(manifest)
+): NonNullable<ServerRoute>[] => {
   return (routesByParentId[parentId] || []).map((route) => ({
     ...route,
     children: createRoutes(manifest, route.id, routesByParentId),

packages/react-router/index.ts

@@ -213,12 +213,6 @@ export { createRoutesStub } from "./lib/dom/ssr/routes-test-stub";
 // Expose old @remix-run/server-runtime API, minus duplicate APIs
 export { createCookie, isCookie } from "./lib/server-runtime/cookies";
 
-// TODO: (v7) Clean up code paths for these exports
-// export {
-//   json,
-//   redirect,
-//   redirectDocument,
-// } from "./lib/server-runtime/responses";
 export { createRequestHandler } from "./lib/server-runtime/server";
 export {
   createSession,
@@ -258,16 +252,6 @@ export type {
 } from "./lib/router/links";
 
 export type {
-  // TODO: (v7) Clean up code paths for these exports
-  // ActionFunction,
-  // ActionFunctionArgs,
-  // LinksFunction,
-  // LoaderFunction,
-  // LoaderFunctionArgs,
-  // ServerRuntimeMetaArgs,
-  // ServerRuntimeMetaDescriptor,
-  // ServerRuntimeMetaFunction,
-  DataFunctionArgs,
   HeadersArgs,
   HeadersFunction,
 } from "./lib/server-runtime/routeModules";

packages/react-router/lib/dom-export/hydrated-router.tsx

@@ -133,6 +133,7 @@ function createHydratedRouter(): DataRouter {
         // * or doesn't have a server loader and we have no data to render
         if (
           route &&
+          manifestRoute &&
           shouldHydrateRouteLoader(
             manifestRoute,
             route,

packages/react-router/lib/dom/ssr/components.tsx

@@ -366,7 +366,8 @@ function PrefetchPageLinksImpl({
     let routesParams = new Set<string>();
     let foundOptOutRoute = false;
     nextMatches.forEach((m) => {
-      if (!manifest.routes[m.route.id].hasLoader) {
+      let manifestRoute = manifest.routes[m.route.id];
+      if (!manifestRoute || !manifestRoute.hasLoader) {
         return;
       }
 
@@ -376,7 +377,7 @@ function PrefetchPageLinksImpl({
         routeModules[m.route.id]?.shouldRevalidate
       ) {
         foundOptOutRoute = true;
-      } else if (manifest.routes[m.route.id].hasClientLoader) {
+      } else if (manifestRoute.hasClientLoader) {
         foundOptOutRoute = true;
       } else {
         routesParams.add(m.route.id);
@@ -682,7 +683,7 @@ ${matches
   .map(
     (match, index) =>
       `import * as route${index} from ${JSON.stringify(
-        manifest.routes[match.route.id].module
+        manifest.routes[match.route.id]!.module
       )};`
   )
   .join("\n")}
@@ -728,7 +729,7 @@ import(${JSON.stringify(manifest.entry.module)});`;
   let routePreloads = matches
     .map((match) => {
       let route = manifest.routes[match.route.id];
-      return (route.imports || []).concat([route.module]);
+      return route ? (route.imports || []).concat([route.module]) : [];
     })
     .flat(1);
 

packages/react-router/lib/dom/ssr/data.ts

@@ -1,10 +1,5 @@
 import "../global";
 
-/**
- * Data for a route that was returned from a `loader()`.
- */
-export type AppData = unknown;
-
 export async function createRequestInit(
   request: Request
 ): Promise<RequestInit> {

packages/react-router/lib/dom/ssr/entry.ts

@@ -1,14 +1,15 @@
 import type { StaticHandlerContext } from "../../router/router";
 
-import type { RouteManifest, EntryRoute } from "./routes";
+import type { EntryRoute } from "./routes";
 import type { RouteModules } from "./routeModules";
-
-// Object passed to RemixContext.Provider
+import type { RouteManifest } from "../../router/utils";
 
 type SerializedError = {
   message: string;
   stack?: string;
 };
+
+// Object passed to RemixContext.Provider
 export interface FrameworkContextObject {
   manifest: AssetsManifest;
   routeModules: RouteModules;

packages/react-router/lib/dom/ssr/fog-of-war.ts

@@ -1,9 +1,11 @@
 import * as React from "react";
 import type { PatchRoutesOnNavigationFunction } from "../../context";
 import type { Router as DataRouter } from "../../router/router";
+import type { RouteManifest } from "../../router/utils";
 import { matchRoutes } from "../../router/utils";
 import type { AssetsManifest } from "./entry";
 import type { RouteModules } from "./routeModules";
+import type { EntryRoute } from "./routes";
 import { createClientRoutes } from "./routes";
 
 declare global {
@@ -233,13 +235,12 @@ export async function fetchAndApplyManifestPatches(
 
   // Patch routes we don't know about yet into the manifest
   let knownRoutes = new Set(Object.keys(manifest.routes));
-  let patches: AssetsManifest["routes"] = Object.values(serverPatches).reduce(
-    (acc, route) =>
-      !knownRoutes.has(route.id)
-        ? Object.assign(acc, { [route.id]: route })
-        : acc,
-    {}
-  );
+  let patches = Object.values(serverPatches).reduce((acc, route) => {
+    if (route && !knownRoutes.has(route.id)) {
+      acc[route.id] = route;
+    }
+    return acc;
+  }, {} as RouteManifest<EntryRoute>);
   Object.assign(manifest.routes, patches);
 
   // Track discovered paths so we don't have to fetch them again
@@ -249,7 +250,7 @@ export async function fetchAndApplyManifestPatches(
   // in their new children
   let parentIds = new Set<string | undefined>();
   Object.values(patches).forEach((patch) => {
-    if (!patch.parentId || !patches[patch.parentId]) {
+    if (patch && (!patch.parentId || !patches[patch.parentId])) {
       parentIds.add(patch.parentId);
     }
   });

packages/react-router/lib/dom/ssr/links.ts

@@ -26,7 +26,9 @@ export function getKeyedLinksForMatches(
       let module = routeModules[match.route.id];
       let route = manifest.routes[match.route.id];
       return [
-        route.css ? route.css.map((href) => ({ rel: "stylesheet", href })) : [],
+        route && route.css
+          ? route.css.map((href) => ({ rel: "stylesheet", href }))
+          : [],
         module?.links?.() || [],
       ];
     })
@@ -138,11 +140,12 @@ export async function getKeyedPrefetchLinks(
 ): Promise<KeyedHtmlLinkDescriptor[]> {
   let links = await Promise.all(
     matches.map(async (match) => {
-      let mod = await loadRouteModule(
-        manifest.routes[match.route.id],
-        routeModules
-      );
-      return mod.links ? mod.links() : [];
+      let route = manifest.routes[match.route.id];
+      if (route) {
+        let mod = await loadRouteModule(route, routeModules);
+        return mod.links ? mod.links() : [];
+      }
+      return [];
     })
   );
 
@@ -197,7 +200,7 @@ export function getNewMatchesForLinks(
   if (mode === "data") {
     return nextMatches.filter((match, index) => {
       let manifestRoute = manifest.routes[match.route.id];
-      if (!manifestRoute.hasLoader) {
+      if (!manifestRoute || !manifestRoute.hasLoader) {
         return false;
       }
 
@@ -235,6 +238,7 @@ export function getModuleLinkHrefs(
     matches
       .map((match) => {
         let route = manifestPatch.routes[match.route.id];
+        if (!route) return [];
         let hrefs = [route.module];
         if (route.imports) {
           hrefs = hrefs.concat(route.imports);
@@ -256,12 +260,11 @@ function getCurrentPageModulePreloadHrefs(
     matches
       .map((match) => {
         let route = manifest.routes[match.route.id];
+        if (!route) return [];
         let hrefs = [route.module];
-
         if (route.imports) {
           hrefs = hrefs.concat(route.imports);
         }
-
         return hrefs;
       })
       .flat(1)