@react-navigation/core 7.0.0-rc.13 → 7.0.0-rc.15

package/src/getPathFromState.tsx

@@ -37,6 +37,25 @@ const getActiveRoute = (state: State): { name: string; params?: object } => {
   return route;
 };
 
+const cachedNormalizedConfigs = new WeakMap<
+  PathConfigMap<{}>,
+  Record<string, ConfigItem>
+>();
+
+const getNormalizedConfigs = (options?: Options<{}>) => {
+  if (!options?.screens) return {};
+
+  const cached = cachedNormalizedConfigs.get(options?.screens);
+
+  if (cached) return cached;
+
+  const normalizedConfigs = createNormalizedConfigs(options.screens);
+
+  cachedNormalizedConfigs.set(options.screens, normalizedConfigs);
+
+  return normalizedConfigs;
+};
+
 /**
  * Utility to serialize a navigation state object to a path string.
  *
@@ -80,10 +99,7 @@ export function getPathFromState<ParamList extends {}>(
     validatePathConfig(options);
   }
 
-  // Create a normalized configs object which will be easier to use
-  const configs: Record<string, ConfigItem> = options?.screens
-    ? createNormalizedConfigs(options?.screens)
-    : {};
+  const configs = getNormalizedConfigs(options);
 
   let path = '/';
   let current: State | undefined = state;

package/src/getStateFromPath.tsx

@@ -42,6 +42,12 @@ type ParsedRoute = {
   params?: Record<string, any> | undefined;
 };
 
+type ConfigResources = {
+  initialRoutes: InitialRouteConfig[];
+  configs: RouteConfig[];
+  configWithRegexes: RouteConfig[];
+};
+
 /**
  * Utility to parse a path string to initial state object accepted by the container.
  * This is useful for deep linking when we need to handle the incoming URL.
@@ -67,18 +73,8 @@ export function getStateFromPath<ParamList extends {}>(
   path: string,
   options?: Options<ParamList>
 ): ResultState | undefined {
-  if (options) {
-    validatePathConfig(options);
-  }
-
-  const initialRoutes: InitialRouteConfig[] = [];
-
-  if (options?.initialRouteName) {
-    initialRoutes.push({
-      initialRouteName: options.initialRouteName,
-      parentScreens: [],
-    });
-  }
+  const { initialRoutes, configs, configWithRegexes } =
+    getConfigResources(options);
 
   const screens = options?.screens;
 
@@ -122,8 +118,114 @@ export function getStateFromPath<ParamList extends {}>(
     return undefined;
   }
 
+  if (remaining === '/') {
+    // We need to add special handling of empty path so navigation to empty path also works
+    // When handling empty path, we should only look at the root level config
+    const match = configs.find(
+      (config) =>
+        config.path === '' &&
+        config.routeNames.every(
+          // Make sure that none of the parent configs have a non-empty path defined
+          (name) => !configs.find((c) => c.screen === name)?.path
+        )
+    );
+
+    if (match) {
+      return createNestedStateObject(
+        path,
+        match.routeNames.map((name) => ({ name })),
+        initialRoutes,
+        configs
+      );
+    }
+
+    return undefined;
+  }
+
+  let result: PartialState<NavigationState> | undefined;
+  let current: PartialState<NavigationState> | undefined;
+
+  // We match the whole path against the regex instead of segments
+  // This makes sure matches such as wildcard will catch any unmatched routes, even if nested
+  const { routes, remainingPath } = matchAgainstConfigs(
+    remaining,
+    configWithRegexes
+  );
+
+  if (routes !== undefined) {
+    // This will always be empty if full path matched
+    current = createNestedStateObject(path, routes, initialRoutes, configs);
+    remaining = remainingPath;
+    result = current;
+  }
+
+  if (current == null || result == null) {
+    return undefined;
+  }
+
+  return result;
+}
+
+/**
+ * Reference to the last used config resources. This is used to avoid recomputing the config resources when the options are the same.
+ */
+const cachedConfigResources = new WeakMap<Options<{}>, ConfigResources>();
+
+function getConfigResources<ParamList extends {}>(
+  options: Options<ParamList> | undefined
+) {
+  if (!options) return prepareConfigResources();
+
+  const cached = cachedConfigResources.get(options);
+
+  if (cached) return cached;
+
+  const resources = prepareConfigResources(options);
+
+  cachedConfigResources.set(options, resources);
+
+  return resources;
+}
+
+function prepareConfigResources(options?: Options<{}>) {
+  if (options) {
+    validatePathConfig(options);
+  }
+
+  const initialRoutes = getInitialRoutes(options);
+
+  const configs = getNormalizedConfigs(initialRoutes, options?.screens);
+
+  checkForDuplicatedConfigs(configs);
+
+  const configWithRegexes = getConfigsWithRegexes(configs);
+
+  return {
+    initialRoutes,
+    configs,
+    configWithRegexes,
+  };
+}
+
+function getInitialRoutes(options?: Options<{}>) {
+  const initialRoutes: InitialRouteConfig[] = [];
+
+  if (options?.initialRouteName) {
+    initialRoutes.push({
+      initialRouteName: options.initialRouteName,
+      parentScreens: [],
+    });
+  }
+
+  return initialRoutes;
+}
+
+function getNormalizedConfigs(
+  initialRoutes: InitialRouteConfig[],
+  screens: PathConfigMap<object> = {}
+) {
   // Create a normalized configs array which will be easier to use
-  const configs = ([] as RouteConfig[])
+  return ([] as RouteConfig[])
     .concat(
       ...Object.keys(screens).map((key) =>
         createNormalizedConfigs(
@@ -185,7 +287,9 @@ export function getStateFromPath<ParamList extends {}>(
       }
       return bParts.length - aParts.length;
     });
+}
 
+function checkForDuplicatedConfigs(configs: RouteConfig[]) {
   // Check for duplicate patterns in the config
   configs.reduce<Record<string, RouteConfig>>((acc, config) => {
     if (acc[config.pattern]) {
@@ -214,57 +318,14 @@ export function getStateFromPath<ParamList extends {}>(
       [config.pattern]: config,
     });
   }, {});
+}
 
-  if (remaining === '/') {
-    // We need to add special handling of empty path so navigation to empty path also works
-    // When handling empty path, we should only look at the root level config
-    const match = configs.find(
-      (config) =>
-        config.path === '' &&
-        config.routeNames.every(
-          // Make sure that none of the parent configs have a non-empty path defined
-          (name) => !configs.find((c) => c.screen === name)?.path
-        )
-    );
-
-    if (match) {
-      return createNestedStateObject(
-        path,
-        match.routeNames.map((name) => ({ name })),
-        initialRoutes,
-        configs
-      );
-    }
-
-    return undefined;
-  }
-
-  let result: PartialState<NavigationState> | undefined;
-  let current: PartialState<NavigationState> | undefined;
-
-  // We match the whole path against the regex instead of segments
-  // This makes sure matches such as wildcard will catch any unmatched routes, even if nested
-  const { routes, remainingPath } = matchAgainstConfigs(
-    remaining,
-    configs.map((c) => ({
-      ...c,
-      // Add `$` to the regex to make sure it matches till end of the path and not just beginning
-      regex: c.regex ? new RegExp(c.regex.source + '$') : undefined,
-    }))
-  );
-
-  if (routes !== undefined) {
-    // This will always be empty if full path matched
-    current = createNestedStateObject(path, routes, initialRoutes, configs);
-    remaining = remainingPath;
-    result = current;
-  }
-
-  if (current == null || result == null) {
-    return undefined;
-  }
-
-  return result;
+function getConfigsWithRegexes(configs: RouteConfig[]) {
+  return configs.map((c) => ({
+    ...c,
+    // Add `$` to the regex to make sure it matches till end of the path and not just beginning
+    regex: c.regex ? new RegExp(c.regex.source + '$') : undefined,
+  }));
 }
 
 const joinPaths = (...paths: string[]): string =>