@rangojs/router 0.0.0-experimental.2

package/src/router/loader-resolution.ts

@@ -0,0 +1,326 @@
+/**
+ * Router Loader Resolution
+ *
+ * Loader execution, memoization, and error handling utilities.
+ */
+
+import type { ReactNode } from "react";
+import { track } from "../server/context";
+import type { EntryData } from "../server/context";
+import type {
+  ResolvedSegment,
+  HandlerContext,
+  LoaderDefinition,
+  LoaderContext,
+  LoaderDataResult,
+  ErrorBoundaryHandler,
+  ErrorBoundaryFallbackProps,
+  ErrorInfo,
+} from "../types";
+import type { LoaderRevalidationResult, ActionContext } from "./types";
+import { isHandle, type Handle } from "../handle.js";
+import type { HandleStore } from "../server/handle-store.js";
+import { getFetchableLoader } from "../loader.rsc.js";
+import { getRequestContext } from "../server/request-context.js";
+
+/**
+ * Internal callback signature for loader error notifications.
+ * This is a simplified callback for internal use in wrapLoaderWithErrorHandling.
+ * The caller (wrapLoaderPromise in router.ts) bridges this to the full OnErrorCallback.
+ */
+export type LoaderErrorCallback = (
+  error: unknown,
+  context: {
+    segmentId: string;
+    loaderName: string;
+    handledByBoundary: boolean;
+  }
+) => void;
+
+/**
+ * Wrap a loader promise with error handling for deferred client-side resolution.
+ * Catches errors and converts them to LoaderDataResult objects that include
+ * error info and pre-rendered fallback UI when an error boundary is available.
+ *
+ * @param onError - Optional callback invoked when loader errors occur.
+ *   This has a simplified signature for internal use - the caller (typically
+ *   wrapLoaderPromise in router.ts) is responsible for bridging to the full
+ *   OnErrorCallback with complete request context (request, url, env, etc.).
+ */
+export function wrapLoaderWithErrorHandling<T>(
+  promise: Promise<T>,
+  entry: EntryData,
+  segmentId: string,
+  pathname: string,
+  findNearestErrorBoundary: (
+    entry: EntryData | null
+  ) => ReactNode | ErrorBoundaryHandler | null,
+  createErrorInfo: (
+    error: unknown,
+    segmentId: string,
+    segmentType: ErrorInfo["segmentType"]
+  ) => ErrorInfo,
+  onError?: LoaderErrorCallback
+): Promise<LoaderDataResult<T>> {
+  // Extract loader name from segmentId (format: "M1L0D0.loaderName")
+  const loaderName = segmentId.split(".").pop() || "unknown";
+
+  return Promise.resolve(promise)
+    .then(
+      (data): LoaderDataResult<T> => ({
+        __loaderResult: true,
+        ok: true,
+        data,
+      })
+    )
+    .catch((error): LoaderDataResult<T> => {
+      // Find nearest error boundary
+      const fallback = findNearestErrorBoundary(entry);
+
+      // Create error info
+      const errorInfo = createErrorInfo(error, segmentId, "loader");
+
+      // Invoke onError callback if provided
+      onError?.(error, {
+        segmentId,
+        loaderName,
+        handledByBoundary: !!fallback,
+      });
+
+      if (!fallback) {
+        // No error boundary - return error result without fallback
+        // Client will throw this error
+        return {
+          __loaderResult: true,
+          ok: false,
+          error: errorInfo,
+          fallback: null,
+        };
+      }
+
+      // Render fallback on server
+      let renderedFallback: ReactNode;
+      if (typeof fallback === "function") {
+        // ErrorBoundaryHandler - call with error info
+        const props: ErrorBoundaryFallbackProps = {
+          error: errorInfo,
+        };
+        renderedFallback = fallback(props);
+      } else {
+        renderedFallback = fallback;
+      }
+
+      console.log(
+        `[Router] Loader error wrapped with boundary fallback in ${segmentId}:`,
+        errorInfo.message
+      );
+
+      return {
+        __loaderResult: true,
+        ok: false,
+        error: errorInfo,
+        fallback: renderedFallback,
+      };
+    });
+}
+
+/**
+ * Set up the use() method on handler context to access loaders and handles.
+ *
+ * For loaders: Lazily runs loaders, memoizes results per request.
+ * For handles: Returns a push function bound to the current segment.
+ */
+export function setupLoaderAccess<TEnv>(
+  ctx: HandlerContext<any, TEnv>,
+  loaderPromises: Map<string, Promise<any>>
+): void {
+  // Get HandleStore from request context
+  const getHandleStore = (): HandleStore | undefined => {
+    return getRequestContext()?._handleStore;
+  };
+
+  // The use() function handles both loaders and handles
+  ctx.use = ((item: LoaderDefinition<any, any> | Handle<any, any>) => {
+    // Handle case: return a push function
+    if (isHandle(item)) {
+      const handle = item;
+      const store = getHandleStore();
+      const segmentId = ctx._currentSegmentId;
+
+      if (!segmentId) {
+        throw new Error(
+          `Handle "${handle.$$id}" used outside of handler context. ` +
+            `Handles must be used within route/layout handlers.`
+        );
+      }
+
+      // Return a push function bound to this handle and segment
+      // Accepts: value, Promise, or async callback (executed immediately)
+      // Promises are pushed directly - RSC will serialize and stream them
+      return (dataOrFn: unknown | Promise<unknown> | (() => Promise<unknown>)) => {
+        if (!store) return;
+
+        // If it's a function, call it immediately to get the promise
+        const valueOrPromise = typeof dataOrFn === "function"
+          ? (dataOrFn as () => Promise<unknown>)()
+          : dataOrFn;
+
+        // Push directly - promises will be serialized by RSC and streamed
+        store.push(handle.$$id, segmentId, valueOrPromise);
+      };
+    }
+
+    // Loader case: existing behavior
+    const loader = item as LoaderDefinition<any, any>;
+
+    // Return cached promise if already started
+    if (loaderPromises.has(loader.$$id)) {
+      return loaderPromises.get(loader.$$id);
+    }
+
+    // Get loader function - either from loader object or fetchable registry
+    // Fetchable loaders store fn in registry (not on object) to avoid client bundling issues
+    let loaderFn = loader.fn;
+    if (!loaderFn) {
+      const fetchable = getFetchableLoader(loader.$$id);
+      if (fetchable) {
+        loaderFn = fetchable.fn;
+      }
+    }
+
+    // Ensure loader has a function
+    if (!loaderFn) {
+      throw new Error(
+        `Loader "${loader.$$id}" has no function. This usually means the loader was defined without "use server" and the function was not included in the build.`
+      );
+    }
+
+    // Create loader context with recursive use() support
+    const loaderCtx: LoaderContext<Record<string, string | undefined>, TEnv> = {
+      params: ctx.params,
+      request: ctx.request,
+      searchParams: ctx.searchParams,
+      pathname: ctx.pathname,
+      url: ctx.url,
+      env: ctx.env,
+      var: ctx.var,
+      get: ctx.get,
+      use: <TDep, TDepParams = any>(
+        dep: LoaderDefinition<TDep, TDepParams>
+      ): Promise<TDep> => {
+        // Recursive call - will start dep loader if not already started
+        return ctx.use(dep);
+      },
+      // Default to GET for loaders called through route handlers
+      method: "GET",
+      body: undefined,
+    };
+
+    // Start loader execution with tracking
+    const doneLoader = track(`loader:${loader.$$id}`);
+    const promise = Promise.resolve(
+      loaderFn(loaderCtx as LoaderContext<any, TEnv>)
+    ).finally(() => {
+      doneLoader();
+    });
+
+    // Memoize for subsequent calls
+    loaderPromises.set(loader.$$id, promise);
+
+    return promise;
+  }) as typeof ctx.use;
+}
+
+/**
+ * Set up ctx.use() for proactive caching (silent mode).
+ * Handles are silently ignored (no push to HandleStore).
+ * Loaders work normally but with fresh memoization.
+ *
+ * This prevents duplicate handle data (breadcrumbs, meta) from being
+ * pushed to the response stream during background proactive caching.
+ */
+export function setupLoaderAccessSilent<TEnv>(
+  ctx: HandlerContext<any, TEnv>,
+  loaderPromises: Map<string, Promise<any>>
+): void {
+  ctx.use = ((item: LoaderDefinition<any, any> | Handle<any, any>) => {
+    // Handle case: return a no-op push function
+    if (isHandle(item)) {
+      // Silent mode - return a function that does nothing
+      return (_dataOrFn: unknown) => {
+        // Intentionally empty - don't push handle data during proactive caching
+      };
+    }
+
+    // Loader case: same as setupLoaderAccess
+    const loader = item as LoaderDefinition<any, any>;
+
+    // Return cached promise if already started
+    if (loaderPromises.has(loader.$$id)) {
+      return loaderPromises.get(loader.$$id);
+    }
+
+    // Get loader function
+    let loaderFn = loader.fn;
+    if (!loaderFn) {
+      const fetchable = getFetchableLoader(loader.$$id);
+      if (fetchable) {
+        loaderFn = fetchable.fn;
+      }
+    }
+
+    if (!loaderFn) {
+      throw new Error(
+        `Loader "${loader.$$id}" has no function. This usually means the loader was defined without "use server" and the function was not included in the build.`
+      );
+    }
+
+    // Create loader context with recursive use() support
+    const loaderCtx: LoaderContext<Record<string, string | undefined>, TEnv> = {
+      params: ctx.params,
+      request: ctx.request,
+      searchParams: ctx.searchParams,
+      pathname: ctx.pathname,
+      url: ctx.url,
+      env: ctx.env,
+      var: ctx.var,
+      get: ctx.get,
+      use: <TDep, TDepParams = any>(
+        dep: LoaderDefinition<TDep, TDepParams>
+      ): Promise<TDep> => {
+        return ctx.use(dep);
+      },
+      method: "GET",
+      body: undefined,
+    };
+
+    // Start loader execution with tracking
+    const doneLoader = track(`loader:${loader.$$id}`);
+    const promise = Promise.resolve(
+      loaderFn(loaderCtx as LoaderContext<any, TEnv>)
+    ).finally(() => {
+      doneLoader();
+    });
+
+    loaderPromises.set(loader.$$id, promise);
+    return promise;
+  }) as typeof ctx.use;
+}
+
+/**
+ * Conditional execution based on revalidation
+ * Evaluates revalidation logic lazily, then executes appropriate callback
+ *
+ * @param shouldRevalidate - Async function that determines if revalidation is needed
+ * @param onRevalidate - Callback executed if revalidation returns true
+ * @param onSkip - Callback executed if revalidation returns false
+ * @returns Result from either onRevalidate or onSkip
+ */
+export async function revalidate<T>(
+  shouldRevalidate: () => Promise<boolean>,
+  onRevalidate: () => Promise<T>,
+  onSkip: () => T
+): Promise<T> {
+  const needsRevalidation = await shouldRevalidate();
+  return needsRevalidation ? await onRevalidate() : onSkip();
+}

package/src/router/manifest.ts

@@ -0,0 +1,138 @@
+/**
+ * Router Manifest Loading
+ *
+ * Handles lazy loading and validation of route manifests.
+ */
+
+import { invariant, RouteNotFoundError } from "../errors";
+import { createRouteHelpers } from "../route-definition";
+import { getContext, type EntryData, type MetricsStore } from "../server/context";
+import MapRootLayout from "../server/root-layout";
+import type { RouteEntry } from "../types";
+
+/**
+ * Module-level cache for manifests per mount index.
+ * Only used in production - dev mode skips caching for HMR support.
+ */
+const manifestCache = new Map<number, Map<string, EntryData>>();
+
+/**
+ * Load manifest from route entry with AsyncLocalStorage context
+ * Handles lazy imports, unwrapping, and validation
+ */
+export async function loadManifest(
+  entry: RouteEntry<any>,
+  routeKey: string,
+  path: string,
+  metricsStore?: MetricsStore,
+  isSSR?: boolean
+): Promise<EntryData> {
+  const mountIndex = entry.mountIndex;
+  const isDev = process.env.NODE_ENV !== "production";
+
+  // In production, check cache first
+  if (!isDev) {
+    const cachedManifest = manifestCache.get(mountIndex);
+    if (cachedManifest && cachedManifest.has(routeKey)) {
+      return cachedManifest.get(routeKey)!;
+    }
+  }
+
+  const Store = getContext().getOrCreateStore(routeKey);
+
+  // Set mount index in store for unique shortCode prefixes
+  Store.mountIndex = mountIndex;
+
+  // Set isSSR flag so loading() can check if we're in SSR
+  Store.isSSR = isSSR;
+
+  // Attach metrics store to context if provided
+  if (metricsStore) {
+    Store.metrics = metricsStore;
+  }
+
+  // Clear manifest before rebuilding to prevent stale entry mutations
+  Store.manifest.clear();
+
+  try {
+    // Include mountIndex in namespace to ensure unique cache keys per mount
+    const namespaceWithMount = mountIndex !== undefined
+      ? `#router.M${mountIndex}`
+      : "#router";
+
+    const useItems = await getContext().runWithStore(
+      Store,
+      Store.namespace || namespaceWithMount,
+      Store.parent,
+      async () => {
+        // Create helpers for lazy-loaded handlers that need them
+        const helpers = createRouteHelpers();
+
+        // Call handler - urls() API handlers don't need helpers,
+        // legacy map() handlers ignore extra args
+        const result = entry.handler();
+
+        // Handle based on return type
+        if (result instanceof Promise) {
+          // Lazy: () => import(...) - returns Promise
+          const load = await result;
+          if (
+            load &&
+            load !== null &&
+            typeof load === "object" &&
+            "default" in load
+          ) {
+            // Promise<{ default: () => Array }> - e.g., dynamic import
+            // Lazy-loaded handlers may need helpers (passed as optional arg)
+            return (load.default as (h?: any) => any)(helpers);
+          }
+          if (typeof load === "function") {
+            // Promise<() => Array>
+            return (load as (h?: any) => any)(helpers);
+          }
+          // Promise<Array> - direct array from async handler
+          return load;
+        }
+
+        // Inline: ({ route }) => [...] - returns Array directly
+        // Wrap with layout (like map() from route-definition does)
+        // Flatten nested arrays from layout/route definitions
+        return [helpers.layout(MapRootLayout, () => result)].flat(3);
+      }
+    );
+
+    invariant(
+      useItems && useItems.length > 0,
+      "Did not receive any handler from router.map()"
+    );
+    invariant(
+      useItems.some((item: { type: string }) => item.type === "layout"),
+      "Top-level handler must be a layout"
+    );
+
+    invariant(
+      Store.manifest.has(routeKey),
+      `Route must be registered for ${routeKey}`
+    );
+
+    // Cache manifest in production after successful build
+    if (!isDev) {
+      manifestCache.set(mountIndex, new Map(Store.manifest));
+    }
+
+    return Store.manifest.get(routeKey)!;
+  } catch (e) {
+    throw new RouteNotFoundError(
+      `Failed to load route handlers for ${path}: ${(e as Error).message}`,
+      {
+        cause: {
+          error: e,
+          state: {
+            path,
+            routeKey,
+          },
+        },
+      }
+    );
+  }
+}