@reckona/mreact-router 0.0.180 → 0.0.181

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reckona/mreact-router",
-  "version": "0.0.180",
+  "version": "0.0.181",
   "description": "File-system app router, SSR, actions, and deployment adapters for mreact.",
   "keywords": [
     "jsx",
@@ -105,20 +105,20 @@
   },
   "dependencies": {
     "typescript": "^6.0.3",
-    "@reckona/mreact": "0.0.180",
-    "@reckona/mreact-compat": "0.0.180",
-    "@reckona/mreact-devtools": "0.0.180",
-    "@reckona/mreact-compiler": "0.0.180",
-    "@reckona/mreact-query": "0.0.180",
-    "@reckona/mreact-reactive-core": "0.0.180",
-    "@reckona/mreact-reactive-dom": "0.0.180",
-    "@reckona/mreact-server": "0.0.180",
-    "@reckona/mreact-shared": "0.0.180"
+    "@reckona/mreact": "0.0.181",
+    "@reckona/mreact-compat": "0.0.181",
+    "@reckona/mreact-compiler": "0.0.181",
+    "@reckona/mreact-query": "0.0.181",
+    "@reckona/mreact-devtools": "0.0.181",
+    "@reckona/mreact-reactive-core": "0.0.181",
+    "@reckona/mreact-reactive-dom": "0.0.181",
+    "@reckona/mreact-server": "0.0.181",
+    "@reckona/mreact-shared": "0.0.181"
   },
   "peerDependencies": {
     "vite": ">=8 <9"
   },
   "optionalDependencies": {
-    "@reckona/mreact-router-native": "0.0.180"
+    "@reckona/mreact-router-native": "0.0.181"
   }
 }

package/src/adapters/cloudflare.ts

@@ -28,10 +28,11 @@ import {
   requestLogFields,
   type AppRouterLogger,
 } from "../logger.js";
+import { middlewareMatches, type MiddlewareModule } from "../middleware.js";
 import { normalizeRoutePath } from "../route-path.js";
 import type { AppRoute } from "../routes.js";
 import { contentSecurityPolicy } from "../csp.js";
-import { isNotFoundError } from "../navigation.js";
+import { isNotFoundError, rewriteLocation } from "../navigation.js";
 import { validateRouteMetadata } from "../metadata.js";
 import { routeSecurityHeaders } from "../security-headers.js";
 import type { AppRouterPrerenderStore } from "../serve.js";
@@ -202,7 +203,9 @@ export interface CloudflareMetadataRouteContext {
  * Defines the default export accepted from a Cloudflare metadata route module.
  */
 export interface CloudflareMetadataRouteModule {
-  default?: ((context: CloudflareMetadataRouteContext) => unknown | PromiseLike<unknown>) | undefined;
+  default?:
+    | ((context: CloudflareMetadataRouteContext) => unknown | PromiseLike<unknown>)
+    | undefined;
 }
 
 /**
@@ -219,7 +222,9 @@ export type CloudflareRouteModuleRegistryEntry<Env = unknown> =
 export type CloudflareRouteModuleRegistry<Env = unknown> = Record<
   string,
   | CloudflareRouteModuleRegistryEntry<Env>
-  | (() => CloudflareRouteModuleRegistryEntry<Env> | PromiseLike<CloudflareRouteModuleRegistryEntry<Env>>)
+  | (() =>
+      | CloudflareRouteModuleRegistryEntry<Env>
+      | PromiseLike<CloudflareRouteModuleRegistryEntry<Env>>)
 >;
 
 /**
@@ -243,7 +248,9 @@ export interface CloudflareRouteModuleRendererOptions<Env = unknown> {
 export type CloudflareRouteModuleGlob<Env = unknown> = Record<
   string,
   | CloudflareRouteModuleRegistryEntry<Env>
-  | (() => CloudflareRouteModuleRegistryEntry<Env> | PromiseLike<CloudflareRouteModuleRegistryEntry<Env>>)
+  | (() =>
+      | CloudflareRouteModuleRegistryEntry<Env>
+      | PromiseLike<CloudflareRouteModuleRegistryEntry<Env>>)
 >;
 
 /**
@@ -317,6 +324,7 @@ export interface CloudflarePrerenderStoreOptions {
 }
 
 const clientPrefix = "/_mreact/client/";
+const cloudflareMiddlewareRouteModuleKey = "__middleware__";
 const defaultPrerenderCacheOrigin = "https://mreact.local";
 const defaultPrerenderCachePrefix = "/_mreact/prerender";
 
@@ -375,10 +383,7 @@ export function createCloudflareBuiltRequestHandler<Env = unknown>(
   return createCloudflareRequestHandler({
     ...options,
     render(request, context) {
-      const matched = matchCloudflareRoute(
-        sortedRoutes,
-        new URL(request.url).pathname,
-      );
+      const matched = matchCloudflareRoute(sortedRoutes, new URL(request.url).pathname);
 
       if (matched === undefined || options.renderRoute === undefined) {
         return new Response("Not Found", { status: 404 });
@@ -402,6 +407,12 @@ export function createCloudflareRouteModuleRenderer<Env = unknown>(
   options: CloudflareRouteModuleRendererOptions<Env>,
 ): NonNullable<CloudflareBuiltRequestHandlerOptions<Env>["renderRoute"]> {
   return async (request, context) => {
+    const middlewareResult = await resolveCloudflareRouteModuleMiddleware(options.modules, request);
+    if (middlewareResult.type === "response") {
+      return middlewareResult.response;
+    }
+    request = middlewareResult.request;
+
     if (context.route.kind !== "server" && isCloudflareNavigationRequest(request)) {
       return cloudflareDocumentReloadNavigationResponse();
     }
@@ -460,7 +471,9 @@ export function createCloudflareRouteModuleRenderer<Env = unknown>(
       data =
         pageModule.loader === undefined
           ? undefined
-          : await runWithCloudflareQueryClient(queryClient, () => pageModule.loader!(loaderContext));
+          : await runWithCloudflareQueryClient(queryClient, () =>
+              pageModule.loader!(loaderContext),
+            );
     } catch (error) {
       if (error instanceof Response) {
         return error;
@@ -534,6 +547,39 @@ export function createCloudflareRouteModuleRenderer<Env = unknown>(
   };
 }
 
+async function resolveCloudflareRouteModuleMiddleware<Env>(
+  modules: CloudflareRouteModuleRegistry<Env>,
+  request: Request,
+): Promise<{ request: Request; type: "continue" } | { response: Response; type: "response" }> {
+  const module = (await loadCloudflareRouteModule(modules, cloudflareMiddlewareRouteModuleKey)) as
+    | MiddlewareModule
+    | undefined;
+
+  if (module === undefined || !middlewareMatches(module.config, new URL(request.url).pathname)) {
+    return { request, type: "continue" };
+  }
+
+  const middleware = module.middleware ?? module.default;
+  if (typeof middleware !== "function") {
+    return { request, type: "continue" };
+  }
+
+  const response = await middleware(request);
+  if (!(response instanceof Response)) {
+    return { request, type: "continue" };
+  }
+
+  const location = rewriteLocation(response);
+  if (location !== undefined) {
+    return {
+      request: new Request(new URL(location, request.url), request),
+      type: "continue",
+    };
+  }
+
+  return { response, type: "response" };
+}
+
 async function injectCloudflareQueryState<T extends Response | string>(
   document: T,
   state: DehydratedQueryClient,
@@ -605,7 +651,10 @@ async function runWithSerializedCloudflareQueryClient<T>(
   const current = new Promise<void>((resolve) => {
     releaseCurrent = resolve;
   });
-  cloudflareQueryClientFallbackQueue = previous.then(() => current, () => current);
+  cloudflareQueryClientFallbackQueue = previous.then(
+    () => current,
+    () => current,
+  );
 
   await previous;
 
@@ -669,7 +718,9 @@ async function dispatchCloudflareServerRoute<Env>(
   context: CloudflareServerRouteContext<Env>,
 ): Promise<Response> {
   const handler =
-    module[request.method as keyof CloudflareServerRouteModule<Env>] ?? module.ALL ?? module.default;
+    module[request.method as keyof CloudflareServerRouteModule<Env>] ??
+    module.ALL ??
+    module.default;
 
   if (typeof handler !== "function") {
     return new Response("Method Not Allowed", { status: 405 });
@@ -728,17 +779,17 @@ function selectCloudflarePageComponent<Data, Env>(
     return appExport as CloudflareRouteModuleComponent<Data, Env>;
   }
 
-  const cloudflareRouteComponentExport = readCloudflareModuleExport(module, "CloudflareRouteComponent");
+  const cloudflareRouteComponentExport = readCloudflareModuleExport(
+    module,
+    "CloudflareRouteComponent",
+  );
   if (typeof cloudflareRouteComponentExport === "function") {
     return cloudflareRouteComponentExport as CloudflareRouteModuleComponent<Data, Env>;
   }
 
   for (const name of Object.keys(module)) {
     const value = readCloudflareModuleExport(module, name);
-    if (
-      !cloudflareReservedPageModuleExportNames.has(name) &&
-      typeof value === "function"
-    ) {
+    if (!cloudflareReservedPageModuleExportNames.has(name) && typeof value === "function") {
       return value as CloudflareRouteModuleComponent<Data, Env>;
     }
   }
@@ -759,7 +810,12 @@ function readCloudflareModuleExport(module: object, name: string): unknown {
   return descriptor.get?.call(module);
 }
 
-const cloudflareDiagnosticPageModuleExportNames = ["default", "App", "CloudflareRouteComponent", "slots"] as const;
+const cloudflareDiagnosticPageModuleExportNames = [
+  "default",
+  "App",
+  "CloudflareRouteComponent",
+  "slots",
+] as const;
 
 // Fixed names + typeof only (never values) so the 500 response is useful without
 // listing app-specific export names. Accessors are not invoked.
@@ -848,9 +904,10 @@ async function dispatchCloudflareMetadataRoute(
     return new Response(body, {
       headers: {
         "cache-control": "public, max-age=3600",
-        "content-type": typeof value === "string" && value.trimStart().startsWith("<svg")
-          ? "image/svg+xml"
-          : "application/octet-stream",
+        "content-type":
+          typeof value === "string" && value.trimStart().startsWith("<svg")
+            ? "image/svg+xml"
+            : "application/octet-stream",
       },
     });
   }
@@ -1142,7 +1199,10 @@ async function handleCloudflareRequest<Env>(
   return response;
 }
 
-function isCloudflarePublicAssetPath(manifest: CloudflareClientManifest, pathname: string): boolean {
+function isCloudflarePublicAssetPath(
+  manifest: CloudflareClientManifest,
+  pathname: string,
+): boolean {
   return (manifest.publicAssets ?? []).includes(pathname);
 }
 
@@ -1197,9 +1257,7 @@ function cacheControlHasDirective(cacheControl: string | null, directive: string
   }
 
   const normalizedDirective = directive.toLowerCase();
-  return cacheControl
-    .split(",")
-    .some((part) => part.trim().toLowerCase() === normalizedDirective);
+  return cacheControl.split(",").some((part) => part.trim().toLowerCase() === normalizedDirective);
 }
 
 function prerenderedResponse(
@@ -1228,10 +1286,7 @@ function prerenderedResponse(
   });
 }
 
-function cloudflareRouteRequiresModule(
-  route: AppRoute,
-  manifest: BuiltServerManifest,
-): boolean {
+function cloudflareRouteRequiresModule(route: AppRoute, manifest: BuiltServerManifest): boolean {
   return (
     route.kind === "metadata" ||
     route.kind === "server" ||
@@ -1245,17 +1300,11 @@ function cloudflareRouteGlobKeyMatchesRoute(key: string, routeFile: string): boo
   const normalizedKey = normalizeCloudflareRouteModulePath(key);
   const normalizedRoute = normalizeCloudflareRouteModulePath(routeFile);
 
-  return (
-    normalizedKey === normalizedRoute ||
-    normalizedKey.endsWith(`/${normalizedRoute}`)
-  );
+  return normalizedKey === normalizedRoute || normalizedKey.endsWith(`/${normalizedRoute}`);
 }
 
 function normalizeCloudflareRouteModulePath(path: string): string {
-  const withoutPrefix = path
-    .replace(/\\/g, "/")
-    .replace(/^\.\//, "")
-    .replace(/^\/+/, "");
+  const withoutPrefix = path.replace(/\\/g, "/").replace(/^\.\//, "").replace(/^\/+/, "");
 
   return withoutPrefix.replace(/\.(?:mjs|js|ts|tsx)$/, "");
 }
@@ -1277,8 +1326,7 @@ function matchCloudflareRoute(
 
     if (
       catchAllIndex !== -1 &&
-      pathSegments.length <
-        catchAllIndex + 1 + route.segments.length - catchAllIndex - 1
+      pathSegments.length < catchAllIndex + 1 + route.segments.length - catchAllIndex - 1
     ) {
       continue;
     }
@@ -1375,7 +1423,9 @@ function matchCloudflareRoute(
 function compareCloudflareRoutes(a: AppRoute, b: AppRoute): number {
   const scoreDelta = routeSpecificityScore(b) - routeSpecificityScore(a);
 
-  return scoreDelta === 0 ? a.path.localeCompare(b.path) || a.kind.localeCompare(b.kind) : scoreDelta;
+  return scoreDelta === 0
+    ? a.path.localeCompare(b.path) || a.kind.localeCompare(b.kind)
+    : scoreDelta;
 }
 
 function routeSpecificityScore(route: AppRoute): number {
@@ -1537,7 +1587,9 @@ function isCloudflareRouteMetadata(value: RouteMetadata | undefined): value is R
   return value !== undefined;
 }
 
-function mergeCloudflareRouteMetadata(metadata: readonly RouteMetadata[]): RouteMetadata | undefined {
+function mergeCloudflareRouteMetadata(
+  metadata: readonly RouteMetadata[],
+): RouteMetadata | undefined {
   if (metadata.length === 0) {
     return undefined;
   }
@@ -1562,7 +1614,12 @@ function mergeCloudflareRouteMetadata(metadata: readonly RouteMetadata[]): Route
       ...(icons === undefined ? {} : { icons }),
       ...(openGraph === undefined && openGraphImages === undefined
         ? {}
-        : { openGraph: { ...openGraph, ...(openGraphImages === undefined ? {} : { images: openGraphImages }) } }),
+        : {
+            openGraph: {
+              ...openGraph,
+              ...(openGraphImages === undefined ? {} : { images: openGraphImages }),
+            },
+          }),
     };
 
     return mergedMetadata;

package/src/build.ts

@@ -514,8 +514,8 @@ export async function buildApp(options: BuildAppOptions): Promise<BuildAppResult
           }),
         ),
   ]);
-  const { artifacts: serverModules, sharedChunks: serverModuleSharedChunks } = await (
-    shouldTrackBuildPhases === false
+  const { artifacts: serverModules, sharedChunks: serverModuleSharedChunks } =
+    await (shouldTrackBuildPhases === false
       ? buildServerModuleArtifacts({
           bundleRequestRuntimePackages: shouldBuildAwsLambda,
           bundleCache: new Map(),
@@ -547,8 +547,7 @@ export async function buildApp(options: BuildAppOptions): Promise<BuildAppResult
             serverTransformCache,
             vitePlugins,
           }),
-        )
-  );
+        ));
   const serverRoutes = routes.map((route) => ({
     ...route,
     file: relative(project.projectRoot, route.file),
@@ -626,10 +625,7 @@ export async function buildApp(options: BuildAppOptions): Promise<BuildAppResult
       ...(navigationRuntimeScript === undefined ? [] : [navigationRuntimeScript]),
     ]),
   ).sort();
-  const serverModuleClosureFiles = buildServerModuleClosureManifest(
-    serverModules,
-    sourceAnalysis,
-  );
+  const serverModuleClosureFiles = buildServerModuleClosureManifest(serverModules, sourceAnalysis);
   const prerenderedRoutes =
     shouldTrackBuildPhases === false
       ? await prerenderStaticRoutes({
@@ -713,9 +709,7 @@ export async function buildApp(options: BuildAppOptions): Promise<BuildAppResult
     ...(serverActionManifest.allowedActions.length === 0
       ? {}
       : { serverActionManifest: serverActionManifest.allowedActions }),
-    ...(Object.keys(serverModuleClosureFiles).length === 0
-      ? {}
-      : { serverModuleClosureFiles }),
+    ...(Object.keys(serverModuleClosureFiles).length === 0 ? {} : { serverModuleClosureFiles }),
     ...(Object.keys(serverModuleArtifacts.files).length === 0
       ? {}
       : { serverModuleFiles: serverModuleArtifacts.files }),
@@ -1051,13 +1045,7 @@ function collectManifestServerModuleClosureFiles(
   for (const specifier of localManifestServerModuleSpecifiers(source)) {
     const resolved = resolveManifestLocalServerSourceImport(file, specifier, sourceFiles);
     if (resolved !== undefined) {
-      collectManifestServerModuleClosureFiles(
-        resolved,
-        sourceAnalysis,
-        sourceFiles,
-        seen,
-        closure,
-      );
+      collectManifestServerModuleClosureFiles(resolved, sourceAnalysis, sourceFiles, seen, closure);
     }
   }
 }
@@ -2238,7 +2226,10 @@ async function buildServerModuleArtifacts(options: {
   project: ResolvedAppRouterProject;
   projectRoot: string;
   routes: readonly AppRoute[];
-  serverActionReferencesByFile: ReadonlyMap<string, readonly BuiltServerActionExpressionReference[]>;
+  serverActionReferencesByFile: ReadonlyMap<
+    string,
+    readonly BuiltServerActionExpressionReference[]
+  >;
   sourceAnalysis: BuildSourceAnalysisScope;
   serverTransformCache: ServerTransformCache;
   vitePlugins?: readonly PluginOption[] | undefined;
@@ -2323,11 +2314,7 @@ async function buildServerModuleArtifacts(options: {
       continue;
     }
 
-    if (
-      requestArtifactFiles.has(file) &&
-      route?.kind !== "server" &&
-      route?.kind !== "metadata"
-    ) {
+    if (requestArtifactFiles.has(file) && route?.kind !== "server" && route?.kind !== "metadata") {
       requestBatchEntries.push({
         code: stripRouteRequestOnlyExports(source, absoluteFile),
         filename: absoluteFile,
@@ -3138,6 +3125,8 @@ interface RouteRequestModuleBatchOutput {
   sharedChunks: readonly SharedServerModuleChunk[];
 }
 
+const cloudflareMiddlewareRouteModuleKey = "__middleware__";
+
 async function writeCloudflareRouteModules(options: {
   cacheDir?: string | undefined;
   cloudflareDir: string;
@@ -3195,6 +3184,26 @@ async function writeCloudflareRouteModules(options: {
     root: options.projectRoot,
     vitePlugins: options.vitePlugins,
   });
+  const cloudflareMiddlewareFile = findCloudflareMiddlewareFile({
+    files: options.files,
+    projectRoot: options.projectRoot,
+    routesDir: options.routesDir,
+  });
+  const middlewareRouteModules = await buildCloudflareMiddlewareModuleBatch({
+    cacheDir: options.cacheDir,
+    define: options.define,
+    root: options.projectRoot,
+    routes:
+      cloudflareMiddlewareFile === undefined
+        ? []
+        : [
+            {
+              filename: cloudflareMiddlewareFile,
+              routeId: cloudflareMiddlewareRouteModuleKey,
+            },
+          ],
+    vitePlugins: options.vitePlugins,
+  });
   const directComponentRoutes = await collectCloudflareDirectComponentRoutes({
     requiredRoutes,
     routesDir: options.routesDir,
@@ -3235,6 +3244,7 @@ async function writeCloudflareRouteModules(options: {
     writeCloudflareBatchedRouteModuleChunks(options.cloudflareDir, loaderRouteModules),
     writeCloudflareBatchedRouteModuleChunks(options.cloudflareDir, directComponentModules),
     writeCloudflareBatchedRouteModuleChunks(options.cloudflareDir, stringShellComponentModules),
+    writeCloudflareBatchedRouteModuleChunks(options.cloudflareDir, middlewareRouteModules),
   ]);
 
   const registryEntries = await mapWithBuildConcurrency(
@@ -3354,6 +3364,7 @@ async function writeCloudflareRouteModules(options: {
 
   const registrySource = [
     `export const routeModules = {`,
+    ...cloudflareMiddlewareRegistryEntries(middlewareRouteModules),
     ...registryEntries.map((entry) => `  ${entry},`),
     `};`,
     `export default routeModules;`,
@@ -3365,6 +3376,31 @@ async function writeCloudflareRouteModules(options: {
   return { registryFile: "route-modules.mjs" };
 }
 
+function findCloudflareMiddlewareFile(options: {
+  files: Record<string, string>;
+  projectRoot: string;
+  routesDir: string;
+}): string | undefined {
+  const relativeRoutesDir = relative(options.projectRoot, options.routesDir).replaceAll(sep, "/");
+
+  const relativeFile = ["middleware.ts", "middleware.mreact.ts"]
+    .map((file) => (relativeRoutesDir === "" ? file : `${relativeRoutesDir}/${file}`))
+    .find((file) => options.files[file] !== undefined);
+
+  return relativeFile === undefined ? undefined : join(options.projectRoot, relativeFile);
+}
+
+function cloudflareMiddlewareRegistryEntries(modules: CloudflareBatchedRouteModules): string[] {
+  const middleware = modules.entries.get(cloudflareMiddlewareRouteModuleKey);
+  if (middleware === undefined) {
+    return [];
+  }
+
+  return [
+    `  ${JSON.stringify(cloudflareMiddlewareRouteModuleKey)}: () => import(${JSON.stringify(`./${middleware.fileName}`)}),`,
+  ];
+}
+
 function cloudflarePageRouteFacadeModuleSource(componentImport: string): string {
   return `import * as componentModule from ${JSON.stringify(componentImport)};
 
@@ -4904,6 +4940,27 @@ async function buildCloudflareRouteLoaderModuleBatch(options: {
   });
 }
 
+async function buildCloudflareMiddlewareModuleBatch(options: {
+  cacheDir?: string | undefined;
+  define?: UserConfig["define"] | undefined;
+  routes: readonly { filename: string; routeId: string }[];
+  root: string;
+  vitePlugins?: readonly PluginOption[] | undefined;
+}): Promise<CloudflareBatchedRouteModules> {
+  return await bundleCloudflareModuleBatch({
+    cacheDir: options.cacheDir,
+    define: options.define,
+    entries: options.routes.map((route) => ({
+      code: cloudflareMiddlewareModuleEntry(route.filename),
+      filename: `${route.filename}.mreact-cloudflare-middleware.js`,
+      name: `${route.routeId}.middleware`,
+      routeId: route.routeId,
+    })),
+    root: options.root,
+    vitePlugins: options.vitePlugins,
+  });
+}
+
 export async function __buildCloudflareRouteLoaderModuleBatchForTests(options: {
   cacheDir?: string | undefined;
   define?: UserConfig["define"] | undefined;
@@ -5001,6 +5058,15 @@ function cloudflareRouteLoaderModuleEntry(filename: string): string {
   return `export { loader } from ${JSON.stringify(filename)};`;
 }
 
+function cloudflareMiddlewareModuleEntry(filename: string): string {
+  return `import * as middlewareModule from ${JSON.stringify(filename)};
+
+export const config = middlewareModule.config;
+export const middleware = middlewareModule.middleware;
+const defaultMiddleware = middlewareModule.default;
+export default defaultMiddleware;`;
+}
+
 async function buildCloudflareRouteMetadataExportModule(options: {
   cacheDir?: string | undefined;
   define?: UserConfig["define"] | undefined;
@@ -5678,10 +5744,7 @@ async function writeClientRouteBundles(options: {
     await writeFile(join(options.clientDir, asset.fileName), source);
   }
 
-  const generatedAssets = new Set<string>([
-    ...routeCssAssets.assets,
-    ...specialCssAssets.assets,
-  ]);
+  const generatedAssets = new Set<string>([...routeCssAssets.assets, ...specialCssAssets.assets]);
 
   for (const chunk of output.chunks) {
     generatedAssets.add(chunk.fileName);
@@ -5777,13 +5840,13 @@ async function writeSpecialRouteCssAssetBatches(options: {
 
     return batch.css.length === 0
       ? undefined
-      : ({
+      : {
           assets: batch.assets,
           style: {
             css: batch.css,
             file: relative(options.appDir, file).split(sep).join("/"),
           } satisfies ClientStyleManifestEntry,
-        });
+        };
   });
 
   return {