expo-router 2.0.12 → 2.0.13

package/build/loadStaticParamsAsync.d.ts

@@ -1,3 +1,4 @@
 import type { RouteNode } from "./Route";
 export declare function loadStaticParamsAsync(route: RouteNode): Promise<RouteNode>;
+export declare function assertStaticParams(route: Pick<RouteNode, "contextKey" | "dynamic">, params: Record<string, string | string[]>): void;
 //# sourceMappingURL=loadStaticParamsAsync.d.ts.map

package/build/loadStaticParamsAsync.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"loadStaticParamsAsync.d.ts","sourceRoot":"","sources":["../src/loadStaticParamsAsync.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAqB,SAAS,EAAE,MAAM,SAAS,CAAC;AAW5D,wBAAsB,qBAAqB,CACzC,KAAK,EAAE,SAAS,GACf,OAAO,CAAC,SAAS,CAAC,CAWpB"}
+{"version":3,"file":"loadStaticParamsAsync.d.ts","sourceRoot":"","sources":["../src/loadStaticParamsAsync.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAqB,SAAS,EAAE,MAAM,SAAS,CAAC;AAE5D,wBAAsB,qBAAqB,CACzC,KAAK,EAAE,SAAS,GACf,OAAO,CAAC,SAAS,CAAC,CAQpB;AA+ID,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,IAAI,CAAC,SAAS,EAAE,YAAY,GAAG,SAAS,CAAC,EAChD,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC,QA6D1C"}

package/package.json

@@ -1,8 +1,9 @@
 {
   "name": "expo-router",
-  "version": "2.0.12",
+  "version": "2.0.13",
   "main": "src/index.tsx",
   "types": "build/index.d.ts",
+  "license": "MIT",
   "files": [
     "_error.js",
     "_entry.tsx",
@@ -105,12 +106,12 @@
   },
   "dependencies": {
     "@bacons/react-views": "^1.1.3",
-    "@expo/metro-runtime": "2.2.14",
+    "@expo/metro-runtime": "2.2.15",
     "@radix-ui/react-slot": "1.0.1",
     "@react-navigation/bottom-tabs": "~6.5.7",
     "@react-navigation/native": "~6.1.6",
     "@react-navigation/native-stack": "~6.9.12",
-    "expo-head": "0.0.18",
+    "expo-head": "0.0.19",
     "expo-splash-screen": "~0.20.2",
     "query-string": "7.1.3",
     "react-helmet-async": "^1.3.0",

package/src/loadStaticParamsAsync.ts

@@ -1,101 +1,17 @@
 import type { DynamicConvention, RouteNode } from "./Route";
 
-async function recurseAndFlattenNodes<
-  T,
-  TProps,
-  TProcess extends (node: T, props: any) => Promise<T[]>
->(nodes: T[], props: TProps, func: TProcess): Promise<T[]> {
-  const tarr = await Promise.all(nodes.map((node) => func(node, props)).flat());
-  return tarr.filter(Boolean) as T[];
-}
-
 export async function loadStaticParamsAsync(
   route: RouteNode
 ): Promise<RouteNode> {
-  const processed = (
-    await Promise.all(
-      route.children.map((route) =>
-        loadStaticParamsRecursive(route, { parentParams: {} })
-      )
+  const expandedChildren = await Promise.all(
+    route.children.map((route) =>
+      loadStaticParamsRecursive(route, { parentParams: {} })
     )
-  ).flat();
-
-  route.children = processed;
+  );
+  route.children = expandedChildren.flat();
   return route;
 }
 
-function assertStaticParams(
-  route: RouteNode,
-  params: Record<string, string | string[]>
-) {
-  const matches = route.dynamic!.every((dynamic) => {
-    const value = params[dynamic.name];
-    return value !== undefined && value !== null;
-  });
-  if (!matches) {
-    throw new Error(
-      `generateStaticParams() must return an array of params that match the dynamic route. Received ${JSON.stringify(
-        params
-      )}`
-    );
-  }
-
-  const validateSingleParam = (
-    dynamic: DynamicConvention,
-    value: any,
-    allowMultipleSegments?: boolean
-  ) => {
-    if (typeof value !== "string") {
-      throw new Error(
-        `generateStaticParams() for route "${
-          route.contextKey
-        }" expected param "${
-          dynamic.name
-        }" to be of type string, instead found "${typeof value}" while parsing "${value}".`
-      );
-    }
-    const parts = value.split("/").filter(Boolean);
-    if (parts.length > 1 && !allowMultipleSegments) {
-      throw new Error(
-        `generateStaticParams() for route "${route.contextKey}" expected param "${dynamic.name}" to not contain "/" (multiple segments) while parsing "${value}".`
-      );
-    }
-    if (parts.length === 0) {
-      throw new Error(
-        `generateStaticParams() for route "${route.contextKey}" expected param "${dynamic.name}" not to be empty while parsing "${value}".`
-      );
-    }
-  };
-
-  route.dynamic!.forEach((dynamic) => {
-    const value = params[dynamic.name];
-    if (dynamic.deep) {
-      // TODO: We could split strings by `/` and use that too.
-      if (!Array.isArray(value)) {
-        validateSingleParam(dynamic, value, true);
-      } else {
-        validateSingleParam(dynamic, value.filter(Boolean).join("/"), true);
-      }
-    } else {
-      validateSingleParam(dynamic, value);
-    }
-    return value !== undefined && value !== null;
-  });
-}
-
-/** lodash.uniqBy */
-function uniqBy<T>(array: T[], key: (item: T) => string): T[] {
-  const seen: { [key: string]: boolean } = {};
-  return array.filter((item) => {
-    const k = key(item);
-    if (seen[k]) {
-      return false;
-    }
-    seen[k] = true;
-    return true;
-  });
-}
-
 async function loadStaticParamsRecursive(
   route: RouteNode,
   props: { parentParams: any }
@@ -112,32 +28,36 @@ async function loadStaticParamsRecursive(
     staticParams = await loaded.generateStaticParams({
       params: props.parentParams || {},
     });
-    if (!Array.isArray(staticParams)) {
-      throw new Error(
-        `generateStaticParams() must return an array of params, received ${staticParams}`
-      );
-    }
 
+    assertStaticParamsType(staticParams);
     // Assert that at least one param from each matches the dynamic route.
     staticParams.forEach((params) => assertStaticParams(route, params));
   }
 
-  route.children = uniqBy(
-    (
-      await recurseAndFlattenNodes(
-        [...route.children],
-        {
-          ...props,
-          parentParams: {
-            ...props.parentParams,
-            ...staticParams,
-          },
-        },
-        loadStaticParamsRecursive
-      )
-    ).flat(),
-    (i) => i.route
-  );
+  const traverseForNode = async (
+    nextParams: Record<string, string | string[]>
+  ) => {
+    const nextChildren: RouteNode[] = [];
+    for (const child of route.children) {
+      const children = await loadStaticParamsRecursive(child, {
+        ...props,
+        parentParams: nextParams,
+      });
+      nextChildren.push(...children);
+    }
+
+    return uniqBy(nextChildren, (i) => i.route);
+  };
+
+  if (!staticParams.length) {
+    const nextParams = {
+      ...props.parentParams,
+    };
+
+    route.children = await traverseForNode(nextParams);
+
+    return [route];
+  }
 
   const createParsedRouteName = (input: string, params: any) => {
     let parsedRouteName = input;
@@ -159,6 +79,12 @@ async function loadStaticParamsRecursive(
 
   const generatedRoutes = await Promise.all(
     staticParams.map(async (params) => {
+      const nextParams = {
+        ...props.parentParams,
+        ...params,
+      };
+
+      const dynamicChildren = await traverseForNode(nextParams);
       const parsedRoute = createParsedRouteName(route.route, params);
       const generatedContextKey = createParsedRouteName(
         route.contextKey,
@@ -172,25 +98,122 @@ async function loadStaticParamsRecursive(
         // Convert the dynamic route to a static route.
         dynamic: null,
         route: parsedRoute,
-        children: uniqBy(
-          (
-            await recurseAndFlattenNodes(
-              [...route.children],
-              {
-                ...props,
-                parentParams: {
-                  ...props.parentParams,
-                  ...staticParams,
-                },
-              },
-              loadStaticParamsRecursive
-            )
-          ).flat(),
-          (i) => i.route
-        ),
+        children: dynamicChildren,
       };
     })
   );
 
   return [route, ...generatedRoutes];
 }
+
+/** lodash.uniqBy */
+function uniqBy<T>(array: T[], key: (item: T) => string): T[] {
+  const seen: { [key: string]: boolean } = {};
+  return array.filter((item) => {
+    const k = key(item);
+    if (seen[k]) {
+      return false;
+    }
+    seen[k] = true;
+    return true;
+  });
+}
+
+function assertStaticParamsType(
+  params: any
+): asserts params is Record<string, string | string[]> {
+  if (!Array.isArray(params)) {
+    throw new Error(
+      `generateStaticParams() must return an array of params, received ${params}`
+    );
+  }
+}
+
+function formatExpected(
+  expected: string[],
+  received: Record<string, any>
+): string {
+  const total = {
+    ...received,
+  };
+  for (const item of expected) {
+    if (total[item] == null) {
+      total[item] = String(total[item]);
+    } else {
+      total[item] = `"${total[item]}"`;
+    }
+  }
+
+  return [
+    "{",
+    Object.entries(total)
+      .map(([key, value]) => `  "${key}": ${value}`)
+      .join(",\n"),
+    "}",
+  ].join("\n");
+}
+
+export function assertStaticParams(
+  route: Pick<RouteNode, "contextKey" | "dynamic">,
+  params: Record<string, string | string[]>
+) {
+  // Type checking
+  if (!route.dynamic) {
+    throw new Error("assertStaticParams() must be called on a dynamic route.");
+  }
+  const matches = route.dynamic.every((dynamic) => {
+    const value = params[dynamic.name];
+    return value !== undefined && value !== null;
+  });
+  if (!matches) {
+    const plural = route.dynamic.length > 1 ? "s" : "";
+    const expected = route.dynamic.map((dynamic) => dynamic.name);
+    throw new Error(
+      `[${
+        route.contextKey
+      }]: generateStaticParams() must return an array of params that match the dynamic route${plural}. Expected non-nullish values for key${plural}: ${expected
+        .map((v) => `"${v}"`)
+        .join(", ")}.\nReceived:\n${formatExpected(expected, params)}`
+    );
+  }
+
+  const validateSingleParam = (
+    dynamic: DynamicConvention,
+    value: any,
+    allowMultipleSegments?: boolean
+  ) => {
+    if (typeof value !== "string") {
+      throw new Error(
+        `generateStaticParams() for route "${
+          route.contextKey
+        }" expected param "${
+          dynamic.name
+        }" to be of type string, instead found "${typeof value}" while parsing "${value}".`
+      );
+    }
+    const parts = value.split("/").filter(Boolean);
+    if (parts.length > 1 && !allowMultipleSegments) {
+      throw new Error(
+        `generateStaticParams() for route "${route.contextKey}" expected param "${dynamic.name}" to not contain "/" (multiple segments) while parsing "${value}".`
+      );
+    }
+    if (parts.length === 0) {
+      throw new Error(
+        `generateStaticParams() for route "${route.contextKey}" expected param "${dynamic.name}" not to be empty while parsing "${value}".`
+      );
+    }
+  };
+
+  // `[shape]/bar/[...colors]` -> `[shape]`, `[...colors]`
+  for (const dynamic of route.dynamic) {
+    let parameter = params[dynamic.name];
+    if (dynamic.deep) {
+      if (Array.isArray(parameter)) {
+        parameter = parameter.filter(Boolean).join("/");
+      }
+      validateSingleParam(dynamic, parameter, true);
+    } else {
+      validateSingleParam(dynamic, parameter);
+    }
+  }
+}