@weaverse/hydrogen 2.6.4-pre.1 → 2.7.1-pre.0

package/dist/index.d.mts

@@ -56,8 +56,6 @@ declare class WeaverseClient {
     countries?: WeaverseClientArgs['countries'];
     constructor(args: WeaverseClientArgs);
     fetchWithCache: <T>(url: string, options?: FetchWithCacheOptions) => Promise<T>;
-    incrementCacheHits: () => Promise<string>;
-    resetCacheHits: () => Promise<void>;
     loadThemeSettings: (strategy?: AllCacheOptions) => Promise<any>;
     loadPage: (params?: LoadPageParams) => Promise<WeaverseLoaderData | null>;
     execComponentLoader: (item: HydrogenComponentData) => Promise<HydrogenComponentData>;

package/dist/index.d.ts

@@ -56,8 +56,6 @@ declare class WeaverseClient {
     countries?: WeaverseClientArgs['countries'];
     constructor(args: WeaverseClientArgs);
     fetchWithCache: <T>(url: string, options?: FetchWithCacheOptions) => Promise<T>;
-    incrementCacheHits: () => Promise<string>;
-    resetCacheHits: () => Promise<void>;
     loadThemeSettings: (strategy?: AllCacheOptions) => Promise<any>;
     loadPage: (params?: LoadPageParams) => Promise<WeaverseLoaderData | null>;
     execComponentLoader: (item: HydrogenComponentData) => Promise<HydrogenComponentData>;

package/dist/index.js

@@ -111,51 +111,16 @@ var ThemeProvider = (0, import_react3.createContext)(null);
 ThemeProvider.displayName = "WeaverseThemeProvider";
 
 // src/hooks/use-studio.ts
-var import_react5 = require("@remix-run/react");
-var import_react6 = require("@weaverse/react");
-var import_react7 = require("react");
+var import_react7 = require("@remix-run/react");
+var import_react8 = require("@weaverse/react");
+var import_react9 = require("react");
 
 // src/hooks/use-theme-context.ts
-var import_react4 = require("react");
-function useThemeContext() {
-  let themeContext = (0, import_react4.useContext)(ThemeProvider);
-  if (!themeContext) {
-    throw new Error(
-      `useThemeContext must be used within a ThemeProvider. Make sure to wrap your app in the withWeaverse HoC.`
-    );
-  }
-  return themeContext;
-}
-
-// src/hooks/use-studio.ts
-function useStudio(weaverse) {
-  let { revalidate } = (0, import_react5.useRevalidator)();
-  let navigate = (0, import_react5.useNavigate)();
-  let themeSettingsStore = useThemeContext();
-  let { isDesignMode, weaverseHost, weaverseVersion } = weaverse;
-  let isStudio = import_react6.isIframe && isDesignMode && weaverseHost && weaverseVersion;
-  (0, import_react7.useEffect)(() => {
-    if (isStudio) {
-      weaverse.internal = {
-        ...weaverse.internal,
-        navigate,
-        revalidate,
-        themeSettingsStore
-      };
-      window.__weaverse = weaverse;
-      if (window.weaverseStudio) {
-        window.weaverseStudio.init(weaverse);
-      } else {
-        let studioSrc = `${weaverseHost}/static/studio/hydrogen/index.js?v=${weaverseVersion}`;
-        (0, import_react6.loadScript)(studioSrc);
-      }
-    }
-  }, [weaverse.requestInfo]);
-}
+var import_react6 = require("react");
 
 // src/hooks/use-theme-settings.ts
-var import_react8 = require("react");
-var import_react9 = require("@weaverse/react");
+var import_react4 = require("react");
+var import_react5 = require("@weaverse/react");
 var ThemeSettingsStore = class _ThemeSettingsStore {
   static settings = null;
   listeners = [];
@@ -164,7 +129,7 @@ var ThemeSettingsStore = class _ThemeSettingsStore {
   publicEnv;
   constructor(data) {
     let { theme, countries, schema: schema2, publicEnv } = data || {};
-    if (import_react9.isBrowser && _ThemeSettingsStore.settings) {
+    if (import_react5.isBrowser && _ThemeSettingsStore.settings) {
       _ThemeSettingsStore.settings = {
         ...theme,
         ..._ThemeSettingsStore.settings
@@ -203,7 +168,7 @@ var ThemeSettingsStore = class _ThemeSettingsStore {
 };
 function useThemeSettings() {
   let themeSettingsStore = useThemeContext();
-  let settings = (0, import_react8.useSyncExternalStore)(
+  let settings = (0, import_react4.useSyncExternalStore)(
     themeSettingsStore.subscribe,
     themeSettingsStore.getSnapshot,
     themeSettingsStore.getServerSnapshot
@@ -211,6 +176,38 @@ function useThemeSettings() {
   return settings;
 }
 
+// src/hooks/use-theme-context.ts
+function useThemeContext() {
+  let themeContext = (0, import_react6.useContext)(ThemeProvider);
+  return themeContext || new ThemeSettingsStore({ theme: {} });
+}
+
+// src/hooks/use-studio.ts
+function useStudio(weaverse) {
+  let { revalidate } = (0, import_react7.useRevalidator)();
+  let navigate = (0, import_react7.useNavigate)();
+  let themeSettingsStore = useThemeContext();
+  let { isDesignMode, weaverseHost, weaverseVersion } = weaverse;
+  let isStudio = import_react8.isIframe && isDesignMode && weaverseHost && weaverseVersion;
+  (0, import_react9.useEffect)(() => {
+    if (isStudio) {
+      weaverse.internal = {
+        ...weaverse.internal,
+        navigate,
+        revalidate,
+        themeSettingsStore
+      };
+      window.__weaverse = weaverse;
+      if (window.weaverseStudio) {
+        window.weaverseStudio.init(weaverse);
+      } else {
+        let studioSrc = `${weaverseHost}/static/studio/hydrogen/index.js?v=${weaverseVersion}`;
+        (0, import_react8.loadScript)(studioSrc);
+      }
+    }
+  }, [weaverse.requestInfo]);
+}
+
 // src/WeaverseHydrogenRoot.tsx
 var WeaverseHydrogenRoot = (0, import_react12.memo)(
   ({
@@ -260,7 +257,7 @@ var package_default = {
   name: "@weaverse/hydrogen",
   author: "Weaverse Team",
   description: "Components, hooks, and utilities for building Shopify Hydrogen websites with Weaverse",
-  version: "2.6.4-pre.0",
+  version: "2.7.0",
   license: "MIT",
   main: "dist/index.js",
   typings: "dist/index.d.ts",
@@ -325,12 +322,12 @@ function getWeaverseConfigs(request, env) {
     WEAVERSE_HOST,
     PUBLIC_STORE_DOMAIN,
     PUBLIC_STOREFRONT_API_TOKEN
-  } = env || {};
+  } = env || typeof process !== "undefined" && process?.env || {};
   let { weaverseProjectId, weaverseHost, isDesignMode, weaverseVersion, weaverseApiKey } = queries;
   return {
-    projectId: weaverseProjectId || WEAVERSE_PROJECT_ID || process?.env?.WEAVERSE_PROJECT_ID || "",
-    weaverseHost: weaverseHost || WEAVERSE_HOST || process?.env?.WEAVERSE_HOST || "https://weaverse.io",
-    weaverseApiKey: weaverseApiKey || WEAVERSE_API_KEY || process?.env?.WEAVERSE_API_KEY || "",
+    projectId: weaverseProjectId || WEAVERSE_PROJECT_ID || "",
+    weaverseHost: weaverseHost || WEAVERSE_HOST || "https://weaverse.io",
+    weaverseApiKey: weaverseApiKey || WEAVERSE_API_KEY || "",
     weaverseVersion: weaverseVersion || "",
     isDesignMode: isDesignMode || false,
     publicEnv: {
@@ -341,7 +338,6 @@ function getWeaverseConfigs(request, env) {
 }
 
 // src/weaverse-client.ts
-var CACHE_HITS_KEY = "https://weaverse.io/__CACHE_HITS_COUNT__";
 var WeaverseClient = class {
   API = "api/public/project";
   clientVersion = package_default.version;
@@ -401,36 +397,49 @@ var WeaverseClient = class {
       ...reqInit
     } = options;
     let res = this.withCache(cacheKey, strategy, async () => {
-      let response = await fetch(url, reqInit);
+      let cacheControlHeader = (0, import_hydrogen.generateCacheControlHeader)(strategy);
+      console.log("cacheControlHeader1", cacheControlHeader);
+      let response = await fetch(url, { ...reqInit, headers: {
+        "Cache-Control": cacheControlHeader,
+        ...reqInit.headers
+      } });
       if (!response.ok) {
         let error = await response.text();
         let { status, statusText } = response;
         throw new Error(`${status} ${statusText} ${error}`);
-      } else {
-        if (!url.includes("/configs")) {
-          await this.resetCacheHits().catch(console.error);
-        }
       }
       return await response.json();
     });
     return res;
   };
-  incrementCacheHits = async () => {
-    const currentHitsResponse = await this.cache.match(CACHE_HITS_KEY);
-    const currentHits = currentHitsResponse ? parseInt(await currentHitsResponse.text()) : 0;
-    const newHitsCount = currentHits + 1;
-    const newHitsResponse = new Response(newHitsCount.toString(), {
-      headers: {
-        "Cache-Control": "max-age=3600"
-      }
-    });
-    await this.cache.put(CACHE_HITS_KEY, newHitsResponse);
-    return newHitsCount.toString();
-  };
-  resetCacheHits = async () => {
-    const resetHitsResponse = new Response("0");
-    await this.cache.put(CACHE_HITS_KEY, resetHitsResponse);
-  };
+  // incrementCacheHits = async () => {
+  //   if (!this.cache) {
+  //     return '1'
+  //   }
+  //   // Increment the cacheHits count in the cache
+  //   const currentHitsResponse = await this.cache.match(CACHE_HITS_KEY)
+  //   const currentHits = currentHitsResponse
+  //     ? parseInt(await currentHitsResponse.text())
+  //     : 0
+  //   const newHitsCount = currentHits + 1
+  //   const newHitsResponse = new Response(newHitsCount.toString(), {
+  //     headers: {
+  //       'Cache-Control': 'max-age=3600',
+  //     },
+  //   })
+  //
+  //   await this.cache.put(CACHE_HITS_KEY, newHitsResponse)
+  //
+  //   return newHitsCount.toString()
+  // }
+  // resetCacheHits = async () => {
+  //   if (!this.cache) {
+  //     return
+  //   }
+  //   // Reset the cacheHits count in the cache
+  //   const resetHitsResponse = new Response('0')
+  //   await this.cache.put(CACHE_HITS_KEY, resetHitsResponse)
+  // }
   loadThemeSettings = async (strategy) => {
     try {
       let { API, configs } = this;
@@ -504,16 +513,9 @@ var WeaverseClient = class {
         if (isDesignMode) {
           payload = await fetch(url, reqInit).then((res) => res.json());
         } else {
-          let cacheHitsToSend = await this.incrementCacheHits().catch(
-            console.error
-          );
-          let headers = {
-            "X-Cache-Hits": cacheHitsToSend || "0"
-            // Send cache hits as a custom header
-          };
           payload = await this.fetchWithCache(url, {
             ...reqInit,
-            headers,
+            // headers,
             strategy
           });
         }

package/dist/index.mjs

@@ -83,41 +83,6 @@ import { useEffect } from "react";
 
 // src/hooks/use-theme-context.ts
 import { useContext } from "react";
-function useThemeContext() {
-  let themeContext = useContext(ThemeProvider);
-  if (!themeContext) {
-    throw new Error(
-      `useThemeContext must be used within a ThemeProvider. Make sure to wrap your app in the withWeaverse HoC.`
-    );
-  }
-  return themeContext;
-}
-
-// src/hooks/use-studio.ts
-function useStudio(weaverse) {
-  let { revalidate } = useRevalidator();
-  let navigate = useNavigate();
-  let themeSettingsStore = useThemeContext();
-  let { isDesignMode, weaverseHost, weaverseVersion } = weaverse;
-  let isStudio = isIframe && isDesignMode && weaverseHost && weaverseVersion;
-  useEffect(() => {
-    if (isStudio) {
-      weaverse.internal = {
-        ...weaverse.internal,
-        navigate,
-        revalidate,
-        themeSettingsStore
-      };
-      window.__weaverse = weaverse;
-      if (window.weaverseStudio) {
-        window.weaverseStudio.init(weaverse);
-      } else {
-        let studioSrc = `${weaverseHost}/static/studio/hydrogen/index.js?v=${weaverseVersion}`;
-        loadScript(studioSrc);
-      }
-    }
-  }, [weaverse.requestInfo]);
-}
 
 // src/hooks/use-theme-settings.ts
 import { useSyncExternalStore } from "react";
@@ -177,6 +142,38 @@ function useThemeSettings() {
   return settings;
 }
 
+// src/hooks/use-theme-context.ts
+function useThemeContext() {
+  let themeContext = useContext(ThemeProvider);
+  return themeContext || new ThemeSettingsStore({ theme: {} });
+}
+
+// src/hooks/use-studio.ts
+function useStudio(weaverse) {
+  let { revalidate } = useRevalidator();
+  let navigate = useNavigate();
+  let themeSettingsStore = useThemeContext();
+  let { isDesignMode, weaverseHost, weaverseVersion } = weaverse;
+  let isStudio = isIframe && isDesignMode && weaverseHost && weaverseVersion;
+  useEffect(() => {
+    if (isStudio) {
+      weaverse.internal = {
+        ...weaverse.internal,
+        navigate,
+        revalidate,
+        themeSettingsStore
+      };
+      window.__weaverse = weaverse;
+      if (window.weaverseStudio) {
+        window.weaverseStudio.init(weaverse);
+      } else {
+        let studioSrc = `${weaverseHost}/static/studio/hydrogen/index.js?v=${weaverseVersion}`;
+        loadScript(studioSrc);
+      }
+    }
+  }, [weaverse.requestInfo]);
+}
+
 // src/WeaverseHydrogenRoot.tsx
 var WeaverseHydrogenRoot = memo(
   ({
@@ -219,14 +216,14 @@ function FallbackError({ error }) {
 }
 
 // src/weaverse-client.ts
-import { createWithCache } from "@shopify/hydrogen";
+import { createWithCache, generateCacheControlHeader } from "@shopify/hydrogen";
 
 // package.json
 var package_default = {
   name: "@weaverse/hydrogen",
   author: "Weaverse Team",
   description: "Components, hooks, and utilities for building Shopify Hydrogen websites with Weaverse",
-  version: "2.6.4-pre.0",
+  version: "2.7.0",
   license: "MIT",
   main: "dist/index.js",
   typings: "dist/index.d.ts",
@@ -291,12 +288,12 @@ function getWeaverseConfigs(request, env) {
     WEAVERSE_HOST,
     PUBLIC_STORE_DOMAIN,
     PUBLIC_STOREFRONT_API_TOKEN
-  } = env || {};
+  } = env || typeof process !== "undefined" && process?.env || {};
   let { weaverseProjectId, weaverseHost, isDesignMode, weaverseVersion, weaverseApiKey } = queries;
   return {
-    projectId: weaverseProjectId || WEAVERSE_PROJECT_ID || process?.env?.WEAVERSE_PROJECT_ID || "",
-    weaverseHost: weaverseHost || WEAVERSE_HOST || process?.env?.WEAVERSE_HOST || "https://weaverse.io",
-    weaverseApiKey: weaverseApiKey || WEAVERSE_API_KEY || process?.env?.WEAVERSE_API_KEY || "",
+    projectId: weaverseProjectId || WEAVERSE_PROJECT_ID || "",
+    weaverseHost: weaverseHost || WEAVERSE_HOST || "https://weaverse.io",
+    weaverseApiKey: weaverseApiKey || WEAVERSE_API_KEY || "",
     weaverseVersion: weaverseVersion || "",
     isDesignMode: isDesignMode || false,
     publicEnv: {
@@ -307,7 +304,6 @@ function getWeaverseConfigs(request, env) {
 }
 
 // src/weaverse-client.ts
-var CACHE_HITS_KEY = "https://weaverse.io/__CACHE_HITS_COUNT__";
 var WeaverseClient = class {
   API = "api/public/project";
   clientVersion = package_default.version;
@@ -367,36 +363,49 @@ var WeaverseClient = class {
       ...reqInit
     } = options;
     let res = this.withCache(cacheKey, strategy, async () => {
-      let response = await fetch(url, reqInit);
+      let cacheControlHeader = generateCacheControlHeader(strategy);
+      console.log("cacheControlHeader1", cacheControlHeader);
+      let response = await fetch(url, { ...reqInit, headers: {
+        "Cache-Control": cacheControlHeader,
+        ...reqInit.headers
+      } });
       if (!response.ok) {
         let error = await response.text();
         let { status, statusText } = response;
         throw new Error(`${status} ${statusText} ${error}`);
-      } else {
-        if (!url.includes("/configs")) {
-          await this.resetCacheHits().catch(console.error);
-        }
       }
       return await response.json();
     });
     return res;
   };
-  incrementCacheHits = async () => {
-    const currentHitsResponse = await this.cache.match(CACHE_HITS_KEY);
-    const currentHits = currentHitsResponse ? parseInt(await currentHitsResponse.text()) : 0;
-    const newHitsCount = currentHits + 1;
-    const newHitsResponse = new Response(newHitsCount.toString(), {
-      headers: {
-        "Cache-Control": "max-age=3600"
-      }
-    });
-    await this.cache.put(CACHE_HITS_KEY, newHitsResponse);
-    return newHitsCount.toString();
-  };
-  resetCacheHits = async () => {
-    const resetHitsResponse = new Response("0");
-    await this.cache.put(CACHE_HITS_KEY, resetHitsResponse);
-  };
+  // incrementCacheHits = async () => {
+  //   if (!this.cache) {
+  //     return '1'
+  //   }
+  //   // Increment the cacheHits count in the cache
+  //   const currentHitsResponse = await this.cache.match(CACHE_HITS_KEY)
+  //   const currentHits = currentHitsResponse
+  //     ? parseInt(await currentHitsResponse.text())
+  //     : 0
+  //   const newHitsCount = currentHits + 1
+  //   const newHitsResponse = new Response(newHitsCount.toString(), {
+  //     headers: {
+  //       'Cache-Control': 'max-age=3600',
+  //     },
+  //   })
+  //
+  //   await this.cache.put(CACHE_HITS_KEY, newHitsResponse)
+  //
+  //   return newHitsCount.toString()
+  // }
+  // resetCacheHits = async () => {
+  //   if (!this.cache) {
+  //     return
+  //   }
+  //   // Reset the cacheHits count in the cache
+  //   const resetHitsResponse = new Response('0')
+  //   await this.cache.put(CACHE_HITS_KEY, resetHitsResponse)
+  // }
   loadThemeSettings = async (strategy) => {
     try {
       let { API, configs } = this;
@@ -470,16 +479,9 @@ var WeaverseClient = class {
         if (isDesignMode) {
           payload = await fetch(url, reqInit).then((res) => res.json());
         } else {
-          let cacheHitsToSend = await this.incrementCacheHits().catch(
-            console.error
-          );
-          let headers = {
-            "X-Cache-Hits": cacheHitsToSend || "0"
-            // Send cache hits as a custom header
-          };
           payload = await this.fetchWithCache(url, {
             ...reqInit,
-            headers,
+            // headers,
             strategy
           });
         }

package/package.json

@@ -2,7 +2,7 @@
   "name": "@weaverse/hydrogen",
   "author": "Weaverse Team",
   "description": "Components, hooks, and utilities for building Shopify Hydrogen websites with Weaverse",
-  "version": "2.6.4-pre.1",
+  "version": "2.7.1-pre.0",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",