@weaverse/hydrogen 5.7.1 → 5.8.0

package/dist/index.js

@@ -55,8 +55,9 @@ function useWeaverseDataContext() {
 function createWeaverseDataContext(matches) {
   return createFlatDataContext(matches);
 }
-
-// src/types.ts
+function isProjectIdFunction(projectId) {
+  return typeof projectId === "function";
+}
 var WeaverseError = class _WeaverseError extends Error {
   code;
   statusCode;
@@ -82,10 +83,14 @@ function hasError(response) {
   return typeof response === "object" && response !== null && "error" in response && typeof response.error === "string";
 }
 function isThemeSettingsResponse(data) {
-  return typeof data === "object" && data !== null && data.theme !== void 0;
+  if (typeof data !== "object" || data === null) {
+    return false;
+  }
+  const record = data;
+  return "theme" in record && typeof record.theme === "object" && record.theme !== null;
 }
 function isValidHydrogenSchema(schema2) {
-  return typeof schema2 === "object" && schema2 !== null && "type" in schema2 && "title" in schema2;
+  return schema$1.isValidSchema(schema2);
 }
 
 // src/utils/index.ts
@@ -111,15 +116,22 @@ function mergeInspectorSettings(settings, inspector, type) {
   );
   return deepMergeArrays(settings, inspector);
 }
-function getRequestQueries(request) {
+function getRequestQueries(request, options) {
   let url = new URL(request.url);
-  return Array.from(url.searchParams.entries()).reduce(
-    (q, [k, v]) => {
-      q[k] = v === "true" ? true : v === "false" ? false : v;
-      return q;
-    },
-    {}
-  );
+  let queries = {};
+  for (let [key, value] of url.searchParams.entries()) {
+    if (options?.allowedKeys && !options.allowedKeys.includes(key)) {
+      continue;
+    }
+    if (value === "true") {
+      queries[key] = true;
+    } else if (value === "false") {
+      queries[key] = false;
+    } else {
+      queries[key] = value;
+    }
+  }
+  return queries;
 }
 function getWeaverseConfigs(request, env) {
   let queries = getRequestQueries(request);
@@ -156,7 +168,12 @@ function getWeaverseConfigs(request, env) {
     }
   };
 }
+var schemaDefaultsCache = /* @__PURE__ */ new WeakMap();
 function generateDataFromSchema(schema2) {
+  const cached = schemaDefaultsCache.get(schema2);
+  if (cached) {
+    return cached;
+  }
   let data = {};
   let inspectorGroups = [];
   const isComponentSchema = (s) => "type" in s && typeof s.type === "string";
@@ -211,6 +228,7 @@ function generateDataFromSchema(schema2) {
       }
     }
   }
+  schemaDefaultsCache.set(schema2, data);
   return data;
 }
 function recursivelyAddDataItem(type, components, items, initData) {
@@ -447,13 +465,16 @@ var WeaverseHydrogenRoot = react$1.memo(
   }) => {
     const matches = reactRouter.useMatches();
     const enhancedDataContext = createWeaverseDataContext(matches);
-    let weaverseData = null;
-    for (const match of matches) {
-      if (match.data && typeof match.data === "object" && match.data !== null && "weaverseData" in match.data) {
-        weaverseData = match.data.weaverseData;
-        break;
+    const weaverseData = react$1.useMemo(() => {
+      for (let i = matches.length - 1; i >= 0; i--) {
+        const match = matches[i];
+        const loaderData = match.loaderData;
+        if (loaderData && "weaverseData" in loaderData) {
+          return loaderData.weaverseData;
+        }
       }
-    }
+      return null;
+    }, [matches]);
     if (weaverseData) {
       if (weaverseData instanceof Promise) {
         return /* @__PURE__ */ jsxRuntime.jsx(reactErrorBoundary.ErrorBoundary, { fallbackRender: ErrorComponent, children: /* @__PURE__ */ jsxRuntime.jsx(react$1.Suspense, { children: /* @__PURE__ */ jsxRuntime.jsx(reactRouter.Await, { resolve: weaverseData, children: (resolvedData) => /* @__PURE__ */ jsxRuntime.jsx(
@@ -499,14 +520,19 @@ function useThemeSettings() {
   );
   return settings;
 }
+var CACHE_DURATIONS = {
+  /** Short cache for frequently changing content (10 seconds) */
+  SHORT: 10,
+  /** Long cache duration - 23 hours to maximize CDN hits before daily refresh */
+  LONG: 82800
+};
+var DEFAULT_FETCH_TIMEOUT_MS = 1e4;
 var API_PATH = "v1";
 var DEFAULT_CACHE_STRATEGY = {
-  maxAge: 10,
-  sMaxAge: 10,
-  staleWhileRevalidate: 82800,
-  // 23 hours
-  staleIfError: 82800
-  // 23 hours
+  maxAge: CACHE_DURATIONS.SHORT,
+  sMaxAge: CACHE_DURATIONS.SHORT,
+  staleWhileRevalidate: CACHE_DURATIONS.LONG,
+  staleIfError: CACHE_DURATIONS.LONG
 };
 var WeaverseClient = class {
   API = API_PATH;
@@ -523,31 +549,64 @@ var WeaverseClient = class {
   env;
   cache;
   waitUntil;
+  // Performance optimizations
+  parsedUrl;
+  componentsByType;
+  // Configuration
+  fetchTimeoutMs;
   constructor(args) {
-    const {
-      customerAccount,
-      env,
-      storefront,
-      components,
-      cache,
-      waitUntil,
-      themeSchema,
-      request
-    } = args;
-    this.request = request;
-    this.storefront = storefront;
-    this.customerAccount = customerAccount;
-    this.components = components;
-    this.themeSchema = themeSchema;
-    this.env = env;
-    this.cache = cache;
-    this.waitUntil = waitUntil;
+    this.request = args.request;
+    this.storefront = args.storefront;
+    this.customerAccount = args.customerAccount;
+    this.components = args.components;
+    this.themeSchema = args.themeSchema;
+    this.env = args.env;
+    this.cache = args.cache;
+    this.waitUntil = args.waitUntil;
+    this.parsedUrl = new URL(args.request.url);
+    this.componentsByType = this.buildComponentLookupMap(args.components);
+    this.fetchTimeoutMs = args.fetchTimeoutMs || DEFAULT_FETCH_TIMEOUT_MS;
+    this.initializeCache(args);
+    this.initializeConfigs(args);
+  }
+  /**
+   * Initialize Hydrogen cache with proper configuration.
+   * Logs warning if waitUntil is missing.
+   */
+  initializeCache(args) {
+    if (!args.waitUntil) {
+      console.warn(
+        "\u26A0\uFE0F WeaverseClient: waitUntil not provided, background operations may not complete"
+      );
+    }
     this.withCache = hydrogen.createWithCache({
-      cache,
-      waitUntil: waitUntil || (() => Promise.resolve()),
-      request
+      cache: args.cache,
+      waitUntil: args.waitUntil || (() => Promise.resolve()),
+      request: args.request
     });
-    this.configs = getWeaverseConfigs(request, env);
+  }
+  /**
+   * Initialize configs with projectId resolution and fail-fast validation.
+   * Throws WeaverseError if projectId cannot be resolved.
+   */
+  initializeConfigs(args) {
+    let baseConfigs = getWeaverseConfigs(args.request, args.env);
+    let resolvedProjectId = this.resolveProjectIdSync(
+      args.projectId,
+      args.request,
+      args.env,
+      baseConfigs
+    );
+    if (!resolvedProjectId || resolvedProjectId.trim() === "") {
+      throw new WeaverseError(
+        "Failed to initialize WeaverseClient: No valid projectId found. Set WEAVERSE_PROJECT_ID environment variable or provide projectId parameter.",
+        "MISSING_PROJECT_ID"
+      );
+    }
+    this.configs = {
+      ...baseConfigs,
+      projectId: resolvedProjectId
+    };
     this.basePageConfigs = {
       projectId: this.configs.projectId,
       weaverseHost: this.configs.weaverseHost,
@@ -558,35 +617,240 @@ var WeaverseClient = class {
     };
     this.basePageRequestBody = {
       isDesignMode: this.configs.isDesignMode,
-      i18n: storefront.i18n,
+      i18n: args.storefront.i18n,
       projectId: this.configs.projectId
     };
+    Object.freeze(this.configs);
+    Object.freeze(this.basePageConfigs);
+    Object.freeze(this.basePageRequestBody);
+  }
+  /**
+   * Build component lookup map for O(1) access by type.
+   * Significantly improves performance for large component lists.
+   */
+  buildComponentLookupMap(components) {
+    return new Map(components.map((comp) => [comp.schema?.type, comp]));
   }
-  // Helper method for direct fetching in design mode - returns same format as withCache.fetch
-  directFetch = async (url, options = {}) => {
+  /**
+   * Extract comprehensive error information from unknown error type.
+   * Preserves error context, codes, and stack traces for debugging.
+   *
+   * @param error - Unknown error to extract information from
+   * @returns Structured error information with message, code, stack, and context
+   *
+   * @example
+   * ```typescript
+   * try {
+   *   // ... operation
+   * } catch (error) {
+   *   const errorInfo = this.extractErrorInfo(error)
+   *   console.error('Operation failed:', errorInfo.message, errorInfo.context)
+   * }
+   * ```
+   */
+  extractErrorInfo(error) {
+    if (error instanceof WeaverseError) {
+      return {
+        message: error.message,
+        code: error.code,
+        context: error.context,
+        stack: error.stack
+      };
+    }
+    if (error instanceof Error) {
+      return {
+        message: error.message,
+        stack: error.stack
+      };
+    }
+    return {
+      message: String(error)
+    };
+  }
+  /**
+   * Extract error message only (for backward compatibility).
+   * Use extractErrorInfo() for more detailed error information.
+   *
+   * @deprecated Use extractErrorInfo() instead to preserve error context
+   */
+  extractErrorMessage(error) {
+    return this.extractErrorInfo(error).message;
+  }
+  /**
+   * Validates projectId format (alphanumeric, hyphens, underscores only).
+   * Returns detailed validation result with error message.
+   *
+   * @param projectId - Project identifier to validate
+   * @returns Validation result with error message if invalid
+   */
+  validateProjectId(projectId) {
+    if (!projectId || projectId.trim() === "") {
+      return {
+        valid: false,
+        error: "Project ID cannot be empty"
+      };
+    }
+    let validPattern = /^[a-zA-Z0-9_-]+$/;
+    if (!validPattern.test(projectId)) {
+      return {
+        valid: false,
+        error: `Invalid format: "${projectId}". Only alphanumeric characters, hyphens, and underscores are allowed.`
+      };
+    }
+    return { valid: true };
+  }
+  /**
+   * Resolves projectId with multi-project architecture support.
+   * Uses priority chain to determine the correct project ID.
+   *
+   * @param projectId - Project identifier (string, function, or undefined)
+   * @param request - HTTP request for context access
+   * @param env - Hydrogen environment with variables
+   * @param baseConfigs - Pre-fetched base configs to avoid duplicate calls
+   * @returns Resolved project ID string (empty string if none found)
+   */
+  resolveProjectIdSync(projectId, request, env, baseConfigs) {
+    return this.resolveFromQueryParams(request) || this.resolveFromFunction(projectId) || this.resolveFromString(projectId) || this.resolveFromEnvironment(baseConfigs, request, env) || "";
+  }
+  /**
+   * Priority 1: Resolve projectId from URL query parameters.
+   * Used for design mode and preview mode overrides.
+   */
+  resolveFromQueryParams(request) {
+    let queries = getRequestQueries(request);
+    return queries.weaverseProjectId || null;
+  }
+  /**
+   * Priority 2: Resolve projectId from function parameter.
+   * Detects and rejects async functions with helpful error.
+   */
+  resolveFromFunction(projectId) {
+    if (!isProjectIdFunction(projectId)) {
+      return null;
+    }
+    if (projectId.constructor.name === "AsyncFunction") {
+      throw new WeaverseError(
+        "Async projectId functions must be awaited before passing to WeaverseClient. Use: projectId: await getProjectAsync() instead of: projectId: getProjectAsync",
+        "ASYNC_PROJECT_ID"
+      );
+    }
     try {
-      let response = await fetch(url, options);
+      let result = projectId();
+      if (result instanceof Promise) {
+        throw new WeaverseError(
+          "Async projectId functions must be awaited before passing to WeaverseClient. Use: projectId: await getProjectAsync() instead of: projectId: getProjectAsync",
+          "ASYNC_PROJECT_ID"
+        );
+      }
+      if (result && result.trim() !== "") {
+        let trimmed = result.trim();
+        let validation = this.validateProjectId(trimmed);
+        if (validation.valid) {
+          return trimmed;
+        }
+        throw new WeaverseError(
+          validation.error || "Invalid projectId format",
+          "INVALID_PROJECT_ID"
+        );
+      }
+    } catch (err) {
+      if (err instanceof WeaverseError) {
+        throw err;
+      }
+      throw new WeaverseError(
+        `Failed to evaluate projectId function: ${err instanceof Error ? err.message : String(err)}`,
+        "PROJECT_ID_FUNCTION_ERROR",
+        void 0,
+        { cause: err instanceof Error ? err.stack : String(err) }
+      );
+    }
+    return null;
+  }
+  /**
+   * Priority 3: Resolve projectId from explicit string parameter.
+   */
+  resolveFromString(projectId) {
+    if (typeof projectId !== "string") {
+      return null;
+    }
+    let trimmed = projectId.trim();
+    if (trimmed === "") {
+      return null;
+    }
+    let validation = this.validateProjectId(trimmed);
+    if (validation.valid) {
+      return trimmed;
+    }
+    throw new WeaverseError(
+      validation.error || "Invalid projectId format",
+      "INVALID_PROJECT_ID"
+    );
+  }
+  /**
+   * Priority 4: Resolve projectId from environment variables.
+   */
+  resolveFromEnvironment(baseConfigs, request, env) {
+    let configs = baseConfigs || getWeaverseConfigs(request, env);
+    if (configs.projectId && configs.projectId.trim() !== "") {
+      return configs.projectId.trim();
+    }
+    return null;
+  }
+  /**
+   * Helper method for direct fetching in design mode.
+   * Returns same format as withCache.fetch for consistency.
+   * Includes 10-second timeout to prevent hanging requests.
+   */
+  directFetch = async (url, options = {}, timeoutMs = this.fetchTimeoutMs) => {
+    let controller = new AbortController();
+    let timeoutId = setTimeout(
+      () => controller.abort(),
+      timeoutMs
+    );
+    try {
+      let response = await fetch(url, {
+        ...options,
+        signal: controller.signal
+      });
       if (!response.ok) {
-        let error = await response.text();
-        throw new Error(`${response.status} ${response.statusText} ${error}`);
+        let errorText = await response.text();
+        throw new WeaverseError(
+          `HTTP ${response.status}: ${response.statusText}`,
+          "FETCH_ERROR",
+          response.status,
+          { url, errorText }
+        );
       }
       let data = await response.json();
-      return {
-        data,
-        response
-      };
+      return { data, response };
     } catch (err) {
-      throw new Error(`Failed to fetch data from ${url}`, { cause: err });
+      if (err instanceof WeaverseError) {
+        throw err;
+      }
+      if (err.name === "AbortError") {
+        throw new WeaverseError(
+          `Request timeout after ${timeoutMs}ms`,
+          "TIMEOUT_ERROR",
+          void 0,
+          { url, timeoutMs }
+        );
+      }
+      throw new WeaverseError(
+        "Network error during fetch",
+        "NETWORK_ERROR",
+        void 0,
+        { url, cause: err instanceof Error ? err.message : String(err) }
+      );
+    } finally {
+      if (timeoutId !== void 0) {
+        clearTimeout(timeoutId);
+      }
     }
   };
   // Helper method to detect if request is from localhost
   isLocalhost() {
-    try {
-      let url = new URL(this.request.url);
-      return url.hostname === "localhost" || url.hostname === "127.0.0.1";
-    } catch {
-      return false;
-    }
+    let hostname = this.parsedUrl.hostname;
+    return hostname === "localhost" || hostname === "127.0.0.1";
   }
   // Helper method for building API URLs consistently
   getApiUrl(endpoint, useProxy = !(this.configs.isDesignMode || this.isLocalhost())) {
@@ -598,7 +862,13 @@ var WeaverseClient = class {
   }
   fetchWithCache = async (url, options = {}) => {
     const strategy = options.strategy || this.storefront.CacheCustom(DEFAULT_CACHE_STRATEGY);
-    const cacheKey = [url, options.method || "GET", options.body];
+    const cacheKey = [
+      "weaverse-fetch",
+      url,
+      options.method || "GET",
+      options.body,
+      this.configs.projectId
+    ];
     let result;
     if (this.configs.isDesignMode) {
       result = await this.directFetch(url, options);
@@ -678,9 +948,15 @@ var WeaverseClient = class {
         };
       }
       return data;
-    } catch (e) {
-      console.info("Unable to load theme settings", e);
-      return { theme: defaultThemeSettings };
+    } catch (error) {
+      let errorMessage = "Unable to load theme settings";
+      let errorDetails = this.extractErrorMessage(error);
+      console.error(errorMessage, errorDetails);
+      return {
+        theme: defaultThemeSettings,
+        _error: errorDetails,
+        _loadFailed: true
+      };
     }
   };
   generateFallbackPage = (message) => {
@@ -701,16 +977,39 @@ var WeaverseClient = class {
   loadPage = async (params = {}) => {
     try {
       let { request, storefront, basePageRequestBody, basePageConfigs } = this;
-      let { projectId, weaverseHost, isPreviewMode, sectionType } = this.configs;
+      let {
+        projectId: clientProjectId,
+        weaverseHost,
+        isPreviewMode,
+        sectionType
+      } = this.configs;
+      if (params.projectId !== void 0) {
+        if (typeof params.projectId !== "string") {
+          console.error(
+            `Route-level projectId validation failed: must be a string. Received: ${typeof params.projectId}`
+          );
+          return null;
+        }
+        let validation = this.validateProjectId(params.projectId);
+        if (!validation.valid) {
+          console.error(
+            `Route-level projectId validation failed: ${validation.error}`
+          );
+          return null;
+        }
+      }
+      let effectiveProjectId = params.projectId || clientProjectId;
       if (isPreviewMode) {
         return getPreviewData(sectionType || "", this.components, weaverseHost);
       }
-      if (!projectId) {
+      if (!effectiveProjectId) {
         throw new Error("Missing Weaverse projectId!");
       }
       let { strategy, ...pageLoadParams } = params;
       let body = {
         ...basePageRequestBody,
+        projectId: effectiveProjectId,
+        // Use effective (potentially overridden) projectId
         params: pageLoadParams,
         url: request.url
       };
@@ -731,11 +1030,27 @@ var WeaverseClient = class {
       if (hasError(projectData)) {
         throw new Error(projectData.error);
       }
-      let { page, project, pageAssignment } = projectData;
+      let page;
+      let project;
+      let pageAssignment;
+      if (isFetchProjectPayload(projectData)) {
+        page = projectData.page;
+        project = projectData.project;
+        pageAssignment = projectData.pageAssignment;
+      } else {
+        console.warn(
+          "Invalid project data structure received from API, using fallback data",
+          { projectId: effectiveProjectId }
+        );
+        let responseData = projectData;
+        page = responseData?.page;
+        project = responseData?.project;
+        pageAssignment = responseData?.pageAssignment;
+      }
       if (!project) {
-        console.warn("Weaverse project not found. Id:", projectId);
+        console.warn("Weaverse project not found. Id:", effectiveProjectId);
         project = {
-          id: projectId,
+          id: effectiveProjectId,
           name: "Weaverse project not found.",
           weaverseShopId: ""
         };
@@ -756,19 +1071,42 @@ var WeaverseClient = class {
           requestInfo: {
             i18n: storefront.i18n,
             queries: getRequestQueries(request),
-            pathname: new URL(request.url).pathname,
-            search: new URL(request.url).search
+            pathname: this.parsedUrl.pathname,
+            search: this.parsedUrl.search
           }
         }
       };
-    } catch (e) {
-      console.error("\u274C Page load failed.", e);
+    } catch (error) {
+      let errorMessage = "\u274C Page load failed";
+      let errorContext = {
+        url: this.request.url,
+        projectId: params.projectId || this.configs.projectId
+      };
+      if (error instanceof WeaverseError) {
+        console.error(errorMessage, {
+          code: error.code,
+          message: error.message,
+          ...errorContext,
+          ...error.context
+        });
+      } else if (error instanceof Error) {
+        console.error(errorMessage, {
+          message: error.message,
+          stack: error.stack,
+          ...errorContext
+        });
+      } else {
+        console.error(errorMessage, {
+          error: String(error),
+          ...errorContext
+        });
+      }
       return null;
     }
   };
   execComponentLoader = async (item) => {
     let { data = {}, type, id } = item;
-    let component = this.components?.find(({ schema: schema2 }) => schema2?.type === type);
+    let component = this.componentsByType.get(type);
     let loader = component?.loader;
     if (typeof loader === "function" && component) {
       try {
@@ -781,8 +1119,8 @@ var WeaverseClient = class {
             })
           )
         };
-      } catch (e) {
-        console.warn("\u274C Item loader run failed.", type, id, e);
+      } catch (error) {
+        console.warn("\u274C Item loader run failed.", type, id, error);
         return item;
       }
     }
@@ -868,6 +1206,7 @@ exports.getSelectedProductOptions = getSelectedProductOptions;
 exports.getWeaverseConfigs = getWeaverseConfigs;
 exports.hasError = hasError;
 exports.isFetchProjectPayload = isFetchProjectPayload;
+exports.isProjectIdFunction = isProjectIdFunction;
 exports.isThemeSettingsResponse = isThemeSettingsResponse;
 exports.isValidHydrogenSchema = isValidHydrogenSchema;
 exports.isWithCacheFetchResponse = isWithCacheFetchResponse;