@shopify/hydrogen 2024.4.3 → 2024.4.4

package/dist/development/index.js

@@ -5,7 +5,6 @@ import { useMatches, useLocation, useNavigation, Link, useNavigate, useFetcher,
 import { jsx, jsxs, Fragment as Fragment$1 } from 'react/jsx-runtime';
 import { parse, stringify } from 'worktop/cookie';
 import cspBuilder from 'content-security-policy-builder';
-import invariant from 'tiny-invariant';
 
 // src/storefront.ts
 
@@ -391,7 +390,7 @@ async function fetchWithServerCache(url, requestInit, {
 }
 
 // src/version.ts
-var LIB_VERSION = "2024.4.3";
+var LIB_VERSION = "2024.4.4";
 
 // src/constants.ts
 var STOREFRONT_REQUEST_GROUP_ID_HEADER = "Custom-Storefront-Request-Group-ID";
@@ -422,6 +421,13 @@ var warnOnce = (string) => {
     warnings.add(string);
   }
 };
+var errors = /* @__PURE__ */ new Set();
+var errorOnce = (string) => {
+  if (!errors.has(string)) {
+    console.error(new Error(string));
+    errors.add(string);
+  }
+};
 
 // src/utils/graphql.ts
 function minifyQuery(string) {
@@ -538,19 +544,19 @@ var GraphQLError = class extends Error {
 function throwErrorWithGqlLink({
   url,
   response,
-  errors,
+  errors: errors2,
   type,
   query,
   queryVariables,
   ErrorConstructor = Error,
   client = "storefront"
 }) {
-  const errorMessage = (typeof errors === "string" ? errors : errors?.map?.((error) => error.message).join("\n")) || `URL: ${url}
+  const errorMessage = (typeof errors2 === "string" ? errors2 : errors2?.map?.((error) => error.message).join("\n")) || `URL: ${url}
 API response error: ${response.status}`;
   const gqlError = new GraphQLError(errorMessage, {
     query,
     queryVariables,
-    cause: { errors },
+    cause: { errors: errors2 },
     clientOperation: `${client}.${type}`,
     requestId: response.headers.get("x-request-id")
   });
@@ -712,16 +718,16 @@ function createStorefrontClient(options) {
       errors: void 0
     };
     if (!response.ok) {
-      let errors2;
+      let errors3;
       try {
-        errors2 = parseJSON(body);
+        errors3 = parseJSON(body);
       } catch (_e) {
-        errors2 = [{ message: body }];
+        errors3 = [{ message: body }];
       }
-      throwErrorWithGqlLink({ ...errorOptions, errors: errors2 });
+      throwErrorWithGqlLink({ ...errorOptions, errors: errors3 });
     }
-    const { data, errors } = body;
-    const gqlErrors = errors?.map(
+    const { data, errors: errors2 } = body;
+    const gqlErrors = errors2?.map(
       ({ message, ...rest }) => new GraphQLError(message, {
         ...rest,
         clientOperation: `storefront.${errorOptions.type}`,
@@ -808,10 +814,10 @@ var getStackOffset = (query) => {
   }
   return stackOffset;
 } ;
-function formatAPIResult(data, errors) {
+function formatAPIResult(data, errors2) {
   return {
     ...data,
-    ...errors && { errors }
+    ...errors2 && { errors: errors2 }
   };
 }
 
@@ -2552,18 +2558,18 @@ function createCustomerAccountClient({
         }
         throw authFailResponse;
       }
-      let errors;
+      let errors2;
       try {
-        errors = parseJSON(body);
+        errors2 = parseJSON(body);
       } catch (_e) {
-        errors = [{ message: body }];
+        errors2 = [{ message: body }];
       }
-      throwErrorWithGqlLink({ ...errorOptions, errors });
+      throwErrorWithGqlLink({ ...errorOptions, errors: errors2 });
     }
     try {
       const APIresponse = parseJSON(body);
-      const { errors } = APIresponse;
-      const gqlErrors = errors?.map(
+      const { errors: errors2 } = APIresponse;
+      const gqlErrors = errors2?.map(
         ({ message, ...rest }) => new GraphQLError(message, {
           ...rest,
           clientOperation: `customerAccount.${errorOptions.type}`,
@@ -2572,7 +2578,7 @@ function createCustomerAccountClient({
           query: query2
         })
       );
-      return { ...APIresponse, ...errors && { errors: gqlErrors } };
+      return { ...APIresponse, ...errors2 && { errors: gqlErrors } };
     } catch (e) {
       throwErrorWithGqlLink({ ...errorOptions, errors: [{ message: body }] });
     }
@@ -2943,7 +2949,7 @@ function cartCreateDefault(options) {
     const buyer = options.customerAccount ? await options.customerAccount.UNSTABLE_getBuyer() : void 0;
     const { cartId, ...restOfOptionalParams } = optionalParams || {};
     const { buyerIdentity, ...restOfInput } = input;
-    const { cartCreate, errors } = await options.storefront.mutate(CART_CREATE_MUTATION(options.cartFragment), {
+    const { cartCreate, errors: errors2 } = await options.storefront.mutate(CART_CREATE_MUTATION(options.cartFragment), {
       variables: {
         input: {
           ...restOfInput,
@@ -2955,7 +2961,7 @@ function cartCreateDefault(options) {
         ...restOfOptionalParams
       }
     });
-    return formatAPIResult(cartCreate, errors);
+    return formatAPIResult(cartCreate, errors2);
   };
 }
 var CART_CREATE_MUTATION = (cartFragment = MINIMAL_CART_FRAGMENT) => `#graphql
@@ -2989,7 +2995,7 @@ function cartGetDefault({
     const cartId = getCartId();
     if (!cartId)
       return null;
-    const [isCustomerLoggedIn, { cart, errors }] = await Promise.all([
+    const [isCustomerLoggedIn, { cart, errors: errors2 }] = await Promise.all([
       customerAccount ? customerAccount.isLoggedIn() : false,
       storefront.query(CART_QUERY(cartFragment), {
         variables: {
@@ -3001,7 +3007,7 @@ function cartGetDefault({
     ]);
     return formatAPIResult(
       addCustomerLoggedInParam(isCustomerLoggedIn, cart),
-      errors
+      errors2
     );
   };
 }
@@ -3140,14 +3146,14 @@ var DEFAULT_CART_FRAGMENT = `#graphql
 // src/cart/queries/cartLinesAddDefault.ts
 function cartLinesAddDefault(options) {
   return async (lines, optionalParams) => {
-    const { cartLinesAdd, errors } = await options.storefront.mutate(CART_LINES_ADD_MUTATION(options.cartFragment), {
+    const { cartLinesAdd, errors: errors2 } = await options.storefront.mutate(CART_LINES_ADD_MUTATION(options.cartFragment), {
       variables: {
         cartId: options.getCartId(),
         lines,
         ...optionalParams
       }
     });
-    return formatAPIResult(cartLinesAdd, errors);
+    return formatAPIResult(cartLinesAdd, errors2);
   };
 }
 var CART_LINES_ADD_MUTATION = (cartFragment = MINIMAL_CART_FRAGMENT) => `#graphql
@@ -3193,14 +3199,14 @@ function throwIfLinesAreOptimistic(type, lines) {
 function cartLinesUpdateDefault(options) {
   return async (lines, optionalParams) => {
     throwIfLinesAreOptimistic("updateLines", lines);
-    const { cartLinesUpdate, errors } = await options.storefront.mutate(CART_LINES_UPDATE_MUTATION(options.cartFragment), {
+    const { cartLinesUpdate, errors: errors2 } = await options.storefront.mutate(CART_LINES_UPDATE_MUTATION(options.cartFragment), {
       variables: {
         cartId: options.getCartId(),
         lines,
         ...optionalParams
       }
     });
-    return formatAPIResult(cartLinesUpdate, errors);
+    return formatAPIResult(cartLinesUpdate, errors2);
   };
 }
 var CART_LINES_UPDATE_MUTATION = (cartFragment = MINIMAL_CART_FRAGMENT) => `#graphql
@@ -3228,14 +3234,14 @@ var CART_LINES_UPDATE_MUTATION = (cartFragment = MINIMAL_CART_FRAGMENT) => `#gra
 function cartLinesRemoveDefault(options) {
   return async (lineIds, optionalParams) => {
     throwIfLinesAreOptimistic("removeLines", lineIds);
-    const { cartLinesRemove, errors } = await options.storefront.mutate(CART_LINES_REMOVE_MUTATION(options.cartFragment), {
+    const { cartLinesRemove, errors: errors2 } = await options.storefront.mutate(CART_LINES_REMOVE_MUTATION(options.cartFragment), {
       variables: {
         cartId: options.getCartId(),
         lineIds,
         ...optionalParams
       }
     });
-    return formatAPIResult(cartLinesRemove, errors);
+    return formatAPIResult(cartLinesRemove, errors2);
   };
 }
 var CART_LINES_REMOVE_MUTATION = (cartFragment = MINIMAL_CART_FRAGMENT) => `#graphql
@@ -3265,14 +3271,14 @@ function cartDiscountCodesUpdateDefault(options) {
     const uniqueCodes = discountCodes.filter((value, index, array) => {
       return array.indexOf(value) === index;
     });
-    const { cartDiscountCodesUpdate, errors } = await options.storefront.mutate(CART_DISCOUNT_CODE_UPDATE_MUTATION(options.cartFragment), {
+    const { cartDiscountCodesUpdate, errors: errors2 } = await options.storefront.mutate(CART_DISCOUNT_CODE_UPDATE_MUTATION(options.cartFragment), {
       variables: {
         cartId: options.getCartId(),
         discountCodes: uniqueCodes,
         ...optionalParams
       }
     });
-    return formatAPIResult(cartDiscountCodesUpdate, errors);
+    return formatAPIResult(cartDiscountCodesUpdate, errors2);
   };
 }
 var CART_DISCOUNT_CODE_UPDATE_MUTATION = (cartFragment = MINIMAL_CART_FRAGMENT) => `#graphql
@@ -3304,7 +3310,7 @@ function cartBuyerIdentityUpdateDefault(options) {
       });
     }
     const buyer = options.customerAccount ? await options.customerAccount.UNSTABLE_getBuyer() : void 0;
-    const { cartBuyerIdentityUpdate, errors } = await options.storefront.mutate(CART_BUYER_IDENTITY_UPDATE_MUTATION(options.cartFragment), {
+    const { cartBuyerIdentityUpdate, errors: errors2 } = await options.storefront.mutate(CART_BUYER_IDENTITY_UPDATE_MUTATION(options.cartFragment), {
       variables: {
         cartId: options.getCartId(),
         buyerIdentity: {
@@ -3314,7 +3320,7 @@ function cartBuyerIdentityUpdateDefault(options) {
         ...optionalParams
       }
     });
-    return formatAPIResult(cartBuyerIdentityUpdate, errors);
+    return formatAPIResult(cartBuyerIdentityUpdate, errors2);
   };
 }
 var CART_BUYER_IDENTITY_UPDATE_MUTATION = (cartFragment = MINIMAL_CART_FRAGMENT) => `#graphql
@@ -3340,14 +3346,14 @@ var CART_BUYER_IDENTITY_UPDATE_MUTATION = (cartFragment = MINIMAL_CART_FRAGMENT)
 // src/cart/queries/cartNoteUpdateDefault.ts
 function cartNoteUpdateDefault(options) {
   return async (note, optionalParams) => {
-    const { cartNoteUpdate, errors } = await options.storefront.mutate(CART_NOTE_UPDATE_MUTATION(options.cartFragment), {
+    const { cartNoteUpdate, errors: errors2 } = await options.storefront.mutate(CART_NOTE_UPDATE_MUTATION(options.cartFragment), {
       variables: {
         cartId: options.getCartId(),
         note,
         ...optionalParams
       }
     });
-    return formatAPIResult(cartNoteUpdate, errors);
+    return formatAPIResult(cartNoteUpdate, errors2);
   };
 }
 var CART_NOTE_UPDATE_MUTATION = (cartFragment = MINIMAL_CART_FRAGMENT) => `#graphql
@@ -3373,14 +3379,14 @@ var CART_NOTE_UPDATE_MUTATION = (cartFragment = MINIMAL_CART_FRAGMENT) => `#grap
 // src/cart/queries/cartSelectedDeliveryOptionsUpdateDefault.ts
 function cartSelectedDeliveryOptionsUpdateDefault(options) {
   return async (selectedDeliveryOptions, optionalParams) => {
-    const { cartSelectedDeliveryOptionsUpdate, errors } = await options.storefront.mutate(CART_SELECTED_DELIVERY_OPTIONS_UPDATE_MUTATION(options.cartFragment), {
+    const { cartSelectedDeliveryOptionsUpdate, errors: errors2 } = await options.storefront.mutate(CART_SELECTED_DELIVERY_OPTIONS_UPDATE_MUTATION(options.cartFragment), {
       variables: {
         cartId: options.getCartId(),
         selectedDeliveryOptions,
         ...optionalParams
       }
     });
-    return formatAPIResult(cartSelectedDeliveryOptionsUpdate, errors);
+    return formatAPIResult(cartSelectedDeliveryOptionsUpdate, errors2);
   };
 }
 var CART_SELECTED_DELIVERY_OPTIONS_UPDATE_MUTATION = (cartFragment = MINIMAL_CART_FRAGMENT) => `#graphql
@@ -3406,13 +3412,13 @@ var CART_SELECTED_DELIVERY_OPTIONS_UPDATE_MUTATION = (cartFragment = MINIMAL_CAR
 // src/cart/queries/cartAttributesUpdateDefault.ts
 function cartAttributesUpdateDefault(options) {
   return async (attributes, optionalParams) => {
-    const { cartAttributesUpdate, errors } = await options.storefront.mutate(CART_ATTRIBUTES_UPDATE_MUTATION(options.cartFragment), {
+    const { cartAttributesUpdate, errors: errors2 } = await options.storefront.mutate(CART_ATTRIBUTES_UPDATE_MUTATION(options.cartFragment), {
       variables: {
         cartId: optionalParams?.cartId || options.getCartId(),
         attributes
       }
     });
-    return formatAPIResult(cartAttributesUpdate, errors);
+    return formatAPIResult(cartAttributesUpdate, errors2);
   };
 }
 var CART_ATTRIBUTES_UPDATE_MUTATION = (cartFragment = MINIMAL_CART_FRAGMENT) => `#graphql
@@ -3443,7 +3449,7 @@ function cartMetafieldsSetDefault(options) {
         ownerId
       })
     );
-    const { cartMetafieldsSet, errors } = await options.storefront.mutate(CART_METAFIELD_SET_MUTATION(), {
+    const { cartMetafieldsSet, errors: errors2 } = await options.storefront.mutate(CART_METAFIELD_SET_MUTATION(), {
       variables: { metafields: metafieldsWithOwnerId }
     });
     return formatAPIResult(
@@ -3453,7 +3459,7 @@ function cartMetafieldsSetDefault(options) {
         },
         ...cartMetafieldsSet
       },
-      errors
+      errors2
     );
   };
 }
@@ -3478,7 +3484,7 @@ var CART_METAFIELD_SET_MUTATION = () => `#graphql
 function cartMetafieldDeleteDefault(options) {
   return async (key, optionalParams) => {
     const ownerId = optionalParams?.cartId || options.getCartId();
-    const { cartMetafieldDelete, errors } = await options.storefront.mutate(CART_METAFIELD_DELETE_MUTATION(), {
+    const { cartMetafieldDelete, errors: errors2 } = await options.storefront.mutate(CART_METAFIELD_DELETE_MUTATION(), {
       variables: {
         input: {
           ownerId,
@@ -3493,7 +3499,7 @@ function cartMetafieldDeleteDefault(options) {
         },
         ...cartMetafieldDelete
       },
-      errors
+      errors2
     );
   };
 }
@@ -3915,11 +3921,20 @@ function ShopPayButton(props) {
 function AnalyticsView(props) {
   const { type, data = {}, customData } = props;
   const location = useLocation();
-  const { publish: publish2, cart, prevCart, shop } = useAnalytics();
+  const {
+    publish: publish2,
+    cart,
+    prevCart,
+    shop,
+    customData: analyticProviderCustomData
+  } = useAnalytics();
   const url = location.pathname + location.search;
   let viewPayload2 = {
     ...data,
-    customData,
+    customData: {
+      ...analyticProviderCustomData,
+      ...customData
+    },
     cart,
     prevCart,
     shop
@@ -4063,38 +4078,11 @@ function getCustomerPrivacyRequired() {
   }
   return customerPrivacy;
 }
-function messageOnError(field) {
-  return `[h2:error:Analytics.Provider] - ${field} is required`;
-}
 function ShopifyAnalytics({
   consent,
   onReady,
-  domain,
-  disableThrowOnError,
-  isMockShop
+  domain
 }) {
-  if (isMockShop) {
-    warnOnce(
-      "[h2:error:Analytics.Provider] - Mock shop is used. Analytics will not work properly."
-    );
-  } else {
-    if (!consent.checkoutDomain) {
-      const errorMsg = messageOnError("consent.checkoutDomain");
-      if (disableThrowOnError) {
-        console.error(errorMsg);
-      } else {
-        invariant(false, errorMsg);
-      }
-    }
-    if (!consent.storefrontAccessToken) {
-      const errorMsg = messageOnError("consent.storefrontAccessToken");
-      if (disableThrowOnError) {
-        console.error(errorMsg);
-      } else {
-        invariant(false, errorMsg);
-      }
-    }
-  }
   const { subscribe: subscribe2, register: register2, canTrack } = useAnalytics();
   const [shopifyReady, setShopifyReady] = useState(false);
   const [privacyReady, setPrivacyReady] = useState(false);
@@ -4112,9 +4100,9 @@ function ShopifyAnalytics({
   };
   const { checkoutDomain, storefrontAccessToken, withPrivacyBanner } = consent;
   useCustomerPrivacy({
-    checkoutDomain: isMockShop || !checkoutDomain ? "mock.shop" : checkoutDomain,
-    storefrontAccessToken: isMockShop || !storefrontAccessToken ? "abcdefghijklmnopqrstuvwxyz123456" : storefrontAccessToken,
-    withPrivacyBanner: isMockShop ? false : withPrivacyBanner,
+    checkoutDomain: !checkoutDomain ? "mock.shop" : checkoutDomain,
+    storefrontAccessToken: !storefrontAccessToken ? "abcdefghijklmnopqrstuvwxyz123456" : storefrontAccessToken,
+    withPrivacyBanner,
     onVisitorConsentCollected: setCustomerPrivacyReady,
     onReady: () => {
       setTimeout(setCustomerPrivacyReady, 3e3);
@@ -4551,6 +4539,9 @@ function shopifyCanTrack() {
   }
   return false;
 }
+function messageOnError(field, envVar) {
+  return `[h2:error:Analytics.Provider] - ${field} is required. Make sure ${envVar} is defined in your environment variables. See https://h2o.fyi/analytics/consent to learn how to setup environment variables in the Shopify admin.`;
+}
 function AnalyticsProvider({
   canTrack: customCanTrack,
   cart: currentCart,
@@ -4570,6 +4561,28 @@ function AnalyticsProvider({
   const [canTrack, setCanTrack] = useState(
     customCanTrack ? () => customCanTrack : () => shopifyCanTrack
   );
+  if (!!shop) {
+    if (/\/68817551382$/.test(shop.shopId)) {
+      warnOnce(
+        "[h2:error:Analytics.Provider] - Mock shop is used. Analytics will not work properly."
+      );
+    } else {
+      if (!consent.checkoutDomain) {
+        const errorMsg = messageOnError(
+          "consent.checkoutDomain",
+          "PUBLIC_CHECKOUT_DOMAIN"
+        );
+        errorOnce(errorMsg);
+      }
+      if (!consent.storefrontAccessToken) {
+        const errorMsg = messageOnError(
+          "consent.storefrontAccessToken",
+          "PUBLIC_STOREFRONT_API_TOKEN"
+        );
+        errorOnce(errorMsg);
+      }
+    }
+  }
   const value = useMemo(() => {
     return {
       canTrack,
@@ -4600,7 +4613,7 @@ function AnalyticsProvider({
     children,
     !!shop && /* @__PURE__ */ jsx(AnalyticsPageView, {}),
     !!shop && !!currentCart && /* @__PURE__ */ jsx(CartAnalytics, { cart: currentCart, setCarts }),
-    !!shop && /* @__PURE__ */ jsx(
+    !!shop && consent.checkoutDomain && /* @__PURE__ */ jsx(
       ShopifyAnalytics,
       {
         consent,
@@ -4609,9 +4622,7 @@ function AnalyticsProvider({
           setConsentLoaded(true);
           setCanTrack(() => shopifyCanTrack);
         },
-        domain: cookieDomain,
-        disableThrowOnError,
-        isMockShop: /\/68817551382$/.test(shop.shopId)
+        domain: cookieDomain
       }
     )
   ] });