vite-plugin-react-server 1.1.20 → 1.2.0-alpha.1

package/plugin/helpers/resolveProps.ts

@@ -1,16 +1,35 @@
 import { toError } from "../error/toError.js";
+import type { GenericModuleLoader, PagePropOpt, PropsName } from "../types.js";
 
-type ResolvePropsOptions<N extends string> = {
+type ResolvePropsOptions = {
   id: string;
   url: string;
-  exportName: N;
-  loader: (id: string) => Promise<any>;
+  exportName: string;
+  loader: GenericModuleLoader;
 };
 
-type ResolvePropsResult<T, N extends string> =
-  | { type: "success"; key: string; props: T; module?:  { [key in N]: T } }
-  | { type: "error"; error: Error }
-  | { type: "skip" };
+type ValidPropTypes<T> =
+  | T
+  | Promise<T>
+  | Array<T[keyof T]>
+  | Array<[string, T[keyof T]]>
+  | ((url: string) => ValidPropTypes<T>);
+
+// prototype classes
+
+type ResolvePropsResult<T extends PagePropOpt, N extends string> =
+  | {
+      type: "success";
+      key: string;
+      module?: {
+        [key in N]:
+          | ValidPropTypes<T>
+          | ((url: string) => ValidPropTypes<T>)
+          | (new (url: string) => T);
+      };
+    }
+  | { type: "error"; key: string; error: Error; module?: never }
+  | { type: "skip"; key: string; module?: never; error?: never };
 
 /**
  * Resolves props from a module, handling both real and virtual modules.
@@ -42,23 +61,30 @@ type ResolvePropsResult<T, N extends string> =
  *   - props: The resolved props if successful
  *   - error: Error message if failed
  */
-export const resolveProps = async <T, N extends string>({
+export const resolveProps = async <
+  T extends PagePropOpt = PagePropOpt,
+  N extends string = PropsName
+>({
   id,
   url,
   exportName,
   loader,
-}: ResolvePropsOptions<N>): Promise<ResolvePropsResult<T, N>> => {
+}: ResolvePropsOptions): Promise<ResolvePropsResult<T, N>> => {
   // Check if this is a stashed page that needs special handling
   const propsLoadResult = await (async (): Promise<
-    | { type: "success"; key: string; module: { [key in N]: T } }
+    | {
+        type: "success";
+        key: string;
+        module: { [key in N]: ValidPropTypes<T> };
+      }
     | { type: "error"; error: Error; module?: never }
   > => {
     try {
-      const result = await loader(id);
+      const result = await loader(`${id}#${exportName}`);
       return {
         type: "success",
         key: id,
-        module: result,
+        module: result as { [key in N]: T },
       };
     } catch (error) {
       return {
@@ -69,32 +95,35 @@ export const resolveProps = async <T, N extends string>({
   })();
 
   if (propsLoadResult.type !== "success") {
-    return propsLoadResult;
+    return {
+      key: id,
+      ...propsLoadResult,
+    };
   }
   const { module } = propsLoadResult;
   const props = module[exportName as N];
   // handle different props use-cases
   if (module instanceof Error) {
     return {
+      key: id,
       type: "error",
       error: module,
     };
   } else if (!(exportName in module)) {
     return {
+      key: id,
       type: "success",
-      key: exportName,
-      props: { url, ...module } as T,
-      module,
+      module: { [exportName]: { url, ...module } } as never,
     };
   } else if (!props) {
     return {
+      key: id,
       type: "success",
-      key: exportName,
-      props: { url } as T,
-      module: module as { [key in N]: T },
+      module: { [exportName]: { url } } as never,
     };
   } else if (props instanceof Error) {
     return {
+      key: id,
       type: "error",
       error: props,
     };
@@ -104,21 +133,51 @@ export const resolveProps = async <T, N extends string>({
       let propsResult;
       if (props.prototype && props.prototype.constructor) {
         // Class constructor case
-        propsResult = new (props as new (url: string) => T)(url);
+        propsResult = new (props as unknown as new (url: string) => T)(url);
       } else {
         // Regular function case
         propsResult = props(url);
       }
-      
+
+      // Handle recursive props validation
+      if (propsResult instanceof Promise) {
+        propsResult = await propsResult;
+      }
+      if (typeof propsResult === "function") {
+        // Recursively handle nested functions
+        return resolveProps<T, N>({
+          id,
+          url,
+          exportName,
+          loader: async () =>
+            ({ [exportName]: propsResult } as {
+              [key in N]: ValidPropTypes<T>;
+            }),
+        });
+      } else if (Array.isArray(propsResult)) {
+        // Handle array case
+        return {
+          type: "success",
+          key: id,
+          module: {
+            [exportName]: Object.fromEntries(
+              (propsResult as Array<[string, T[keyof T]]>).map((prop) =>
+                typeof prop === "string" ? [prop, prop] : prop
+              )
+            ) as T,
+          } as never,
+        };
+      }
+
       return {
         type: "success",
-        key: exportName,
-        props: propsResult instanceof Promise ? await propsResult : propsResult,
-        module: module as { [key in N]: T },
+        key: id,
+        module: { [exportName]: propsResult } as never,
       };
     } catch (error) {
       return {
         type: "error",
+        key: id,
         error: toError(error),
       };
     }
@@ -127,13 +186,13 @@ export const resolveProps = async <T, N extends string>({
     try {
       return {
         type: "success",
-        key: exportName,
-        props: await props,
-        module: propsLoadResult.module,
+        key: id,
+        module: { [exportName]: await props } as never,
       };
     } catch (error) {
       return {
         type: "error",
+        key: id,
         error: toError(error),
       };
     }
@@ -142,15 +201,19 @@ export const resolveProps = async <T, N extends string>({
     try {
       return {
         type: "success",
-        key: exportName,
-        props: Object.fromEntries(
-          props.map((prop) => (typeof prop === "string" ? [prop, prop] : prop))
-        ) as T,
-        module: propsLoadResult.module,
+        key: id,
+        module: {
+          [exportName]: Object.fromEntries(
+            (props as Array<[string, T[keyof T]]>).map((prop) =>
+              typeof prop === "string" ? [prop, prop] : prop
+            )
+          ) as T,
+        } as never,
       };
     } catch (error) {
       return {
         type: "error",
+        key: id,
         error: toError(error),
       };
     }
@@ -158,20 +221,20 @@ export const resolveProps = async <T, N extends string>({
     try {
       return {
         type: "success",
-        key: exportName,
-        props: JSON.parse(props),
+        key: id,
+        module: { [exportName]: JSON.parse(props) } as never,
       };
     } catch (error) {
       return {
         type: "error",
+        key: id,
         error: toError(error),
       };
     }
   }
   return {
     type: "success",
-    key: exportName,
-    props: props,
-    module: module as { [key in N]: T },
+    key: id,
+    module: { [exportName]: props } as never,
   };
 };

package/plugin/helpers/resolveUserComponents.ts

@@ -0,0 +1,190 @@
+import type { 
+  GenericModuleLoader, 
+  HtmlComponentType, 
+  RootComponentType, 
+  ResolvedUserOptions,
+  StreamPluginOptions
+} from "../types.js";
+import { resolveComponent } from "./resolveComponent.js";
+import { Root as DefaultRoot } from "../components/root.js";
+import { Html as DefaultHtml } from "../components/html.js";
+
+/**
+ * Resolves Root and Html components from user options for a specific URL.
+ * This function handles:
+ * 1. Direct component overrides from options.components
+ * 2. Router functions that return paths based on URL
+ * 3. Static string paths
+ * 4. String path resolution to actual components
+ * 
+ * @param userOptions - The resolved user options
+ * @param url - The route URL to resolve components for
+ * @param loader - The module loader for resolving string paths
+ * @returns Promise containing resolved components and any errors
+ */
+export async function resolveUserComponents(
+  userOptions: ResolvedUserOptions,
+  url: string,
+  loader: GenericModuleLoader
+): Promise<{
+  Root: RootComponentType;
+  Html: HtmlComponentType;
+  errors: Error[];
+}> {
+  const errors: Error[] = [];
+
+  // Check for direct component overrides first
+  if (userOptions.components?.Root) {
+    return {
+      Root: userOptions.components.Root,
+      Html: userOptions.components.Html || DefaultHtml,
+      errors: [],
+    };
+  }
+
+  if (userOptions.components?.Html) {
+    return {
+      Root: DefaultRoot,
+      Html: userOptions.components.Html,
+      errors: [],
+    };
+  }
+
+  // No component overrides, so we need to resolve paths to components
+  let rootPath: string | undefined;
+  let htmlPath: string | undefined;
+
+  // Resolve Root path
+  if (userOptions.Root) {
+    if (typeof userOptions.Root === "function") {
+      try {
+        rootPath = await (userOptions.Root as (url: string) => string | Promise<string>)(url);
+      } catch (error) {
+        errors.push(error instanceof Error ? error : new Error(String(error)));
+      }
+    } else if (typeof userOptions.Root === "string") {
+      rootPath = userOptions.Root;
+    }
+  }
+
+  // Resolve Html path
+  if (userOptions.Html) {
+    if (typeof userOptions.Html === "function") {
+      try {
+        htmlPath = await (userOptions.Html as (url: string) => string | Promise<string>)(url);
+      } catch (error) {
+        errors.push(error instanceof Error ? error : new Error(String(error)));
+      }
+    } else if (typeof userOptions.Html === "string") {
+      htmlPath = userOptions.Html;
+    }
+  }
+
+  // Load components from paths
+  let resolvedRoot: RootComponentType = DefaultRoot;
+  let resolvedHtml: HtmlComponentType = DefaultHtml;
+
+  // Only try to resolve if we have actual paths
+  if (rootPath) {
+    try {
+      const rootResult = await resolveComponent<RootComponentType>({
+        componentPath: rootPath,
+        exportName: userOptions.rootExportName,
+        loader,
+      });
+      
+      if (rootResult.type === "success") {
+        resolvedRoot = rootResult.component;
+      } else if (rootResult.type === "error") {
+        errors.push(rootResult.error);
+        // Keep using default if resolution failed
+      }
+    } catch (error) {
+      errors.push(error instanceof Error ? error : new Error(String(error)));
+      // Keep using default if resolution failed
+    }
+  }
+
+  if (htmlPath) {
+    try {
+      const htmlResult = await resolveComponent<HtmlComponentType>({
+        componentPath: htmlPath,
+        exportName: userOptions.htmlExportName,
+        loader,
+      });
+      
+      if (htmlResult.type === "success") {
+        resolvedHtml = htmlResult.component;
+      } else if (htmlResult.type === "error") {
+        errors.push(htmlResult.error);
+        // Keep using default if resolution failed
+      }
+    } catch (error) {
+      errors.push(error instanceof Error ? error : new Error(String(error)));
+      // Keep using default if resolution failed
+    }
+  }
+
+  return {
+    Root: resolvedRoot,
+    Html: resolvedHtml,
+    errors,
+  };
+}
+
+/**
+ * Resolves router functions from original user options.
+ * This function should be called BEFORE resolveUserComponents to handle
+ * cases where Root/Html are router functions.
+ * 
+ * @param originalOptions - The original user options (may contain router functions)
+ * @param url - The route URL
+ * @returns Object with resolved string paths
+ */
+export function resolveRouterFunctions(
+  originalOptions: Pick<StreamPluginOptions, "Root" | "Html" | "components">,
+  url: string
+): {
+  Root: string | undefined;
+  Html: string | undefined;
+} {
+  let resolvedRoot: string | undefined;
+  let resolvedHtml: string | undefined;
+
+  // Check for direct component overrides first
+  if (originalOptions.components?.Root) {
+    // Component override, no path resolution needed
+    return { Root: undefined, Html: undefined };
+  }
+
+  if (originalOptions.components?.Html) {
+    // Component override, no path resolution needed
+    return { Root: undefined, Html: undefined };
+  }
+
+  // Resolve router functions to string paths
+  if (typeof originalOptions.Root === "function") {
+    try {
+      resolvedRoot = (originalOptions.Root as (url: string) => string)(url);
+    } catch (error) {
+      console.warn(`Failed to resolve Root for URL ${url}:`, error);
+    }
+  } else if (typeof originalOptions.Root === "string") {
+    resolvedRoot = originalOptions.Root;
+  }
+
+  if (typeof originalOptions.Html === "function") {
+    try {
+      resolvedHtml = (originalOptions.Html as (url: string) => string)(url);
+    } catch (error) {
+      console.warn(`Failed to resolve Html for URL ${url}:`, error);
+    }
+  } else if (typeof originalOptions.Html === "string") {
+    resolvedHtml = originalOptions.Html;
+  }
+
+  return {
+    Root: resolvedRoot,
+    Html: resolvedHtml,
+  };
+}