@redotech/redo-hydrogen 1.1.1 → 1.1.3

package/dist/types.d.ts

@@ -1,5 +1,6 @@
 import { CartReturn } from '@shopify/hydrogen';
 import { ReactNode, DependencyList } from 'react';
+import { CartWithActionsDocs } from '@shopify/hydrogen-react/dist/types/cart-types';
 import { ProductVariant } from '@shopify/hydrogen-react/storefront-api-types';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
@@ -13,7 +14,7 @@ interface RedoCoverageClient {
     get eligible(): boolean;
     get price(): number | undefined;
     get storeId(): string | undefined;
-    get cart(): CartReturn | undefined;
+    get cart(): CartReturn | CartWithActionsDocs | undefined;
     get cartProduct(): CartProductVariantFragment | undefined;
     get cartAttribute(): CartAttributeKey | undefined;
     get errors(): RedoError[] | undefined;
@@ -29,7 +30,7 @@ type RedoContextValue = {
     loading: boolean;
     storeId?: string;
     cartInfoToEnable?: CartInfoToEnable;
-    cart?: CartReturn;
+    cart?: CartReturn | CartWithActionsDocs;
     errors?: RedoError[];
 };
 declare enum RedoErrorType {
@@ -44,14 +45,14 @@ type RedoError = {
 };
 
 declare const RedoProvider: ({ cart, storeId, children }: {
-    cart: CartReturn;
+    cart: CartReturn | CartWithActionsDocs;
     storeId: string;
     children: ReactNode;
 }) => ReactNode;
 declare const useRedoCoverageClient: () => RedoCoverageClient;
 
 declare const RedoCheckoutButtons: (props: {
-    cart: CartReturn;
+    cart: CartReturn | CartWithActionsDocs;
     children?: ReactNode;
     onClick?: (enabled: boolean) => void;
 }) => react_jsx_runtime.JSX.Element;
@@ -68,4 +69,4 @@ interface LoadState<T> {
 }
 declare function useLoad<T>(fn: Loader<T>, deps: DependencyList): LoadState<T>;
 
-export { type CartAttributeKey, type CartInfoToEnable, type CartProductVariantFragment, type LoadState, type Loader, REDO_REQUIRED_HOSTNAMES, RedoCheckoutButtons, type RedoContextValue, type RedoCoverageClient, RedoProvider, useLoad, useRedoCoverageClient };
+export { type CartAttributeKey, type CartInfoToEnable, type CartProductVariantFragment, type LoadState, type Loader, REDO_REQUIRED_HOSTNAMES, RedoCheckoutButtons, type RedoContextValue, type RedoCoverageClient, type RedoError, RedoErrorType, RedoProvider, useLoad, useRedoCoverageClient };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redotech/redo-hydrogen",
-  "version": "1.1.1",
+  "version": "1.1.3",
   "description": "Utilities to enable and disable Redo coverage on Hydrogen stores",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",

package/src/components/redo-checkout-buttons.tsx

@@ -8,6 +8,8 @@ import { useRedoCoverageClient } from "../providers/redo-coverage-client";
 import { CartInfoToEnable, RedoCoverageClient } from "../types";
 import { REDO_PUBLIC_API_HOSTNAME } from "../utils/security";
 import { CurrencyCode } from "@shopify/hydrogen-react/storefront-api-types";
+import { CartWithActionsDocs } from "@shopify/hydrogen-react/dist/types/cart-types";
+import { getCartLines, isCartWithActionsDocs } from "../utils/cart";
 
 type CheckoutButtonUIResponse = {
   html: string;
@@ -20,7 +22,7 @@ const getButtonsToShow = ({
   storeId
 }: {
   redoCoverageClient: RedoCoverageClient,
-  cart: CartReturn,
+  cart: CartReturn | CartWithActionsDocs,
   storeId: string;
 }): Promise<CheckoutButtonUIResponse | null> => {
   return new Promise<CheckoutButtonUIResponse | null>((resolve, reject) => {
@@ -60,10 +62,10 @@ const applyButtonVariables = ({
   ui
 }: {
   redoCoverageClient: RedoCoverageClient,
-  cart: CartReturn,
+  cart: CartReturn | CartWithActionsDocs,
   ui: CheckoutButtonUIResponse
 }): CheckoutButtonUIResponse | null => {
-  if(!redoCoverageClient.eligible || !redoCoverageClient.price) {
+  if(!redoCoverageClient.eligible || !redoCoverageClient.price || !cart?.cost) {
     return null;
   }
 
@@ -72,7 +74,7 @@ const applyButtonVariables = ({
     currencyCode = 'USD';
   }
 
-  const cartContainsRedo = !!(cart.lines.nodes.some((cartItem) => cartItem.merchandise?.product?.vendor === 're:do'));
+  const cartContainsRedo = !!(getCartLines(cart).some((cartItem) => cartItem.merchandise?.product?.vendor === 're:do'));
   const combinedPrice = new Intl.NumberFormat('en-US', {
     style: 'currency',
     currency: currencyCode
@@ -101,7 +103,7 @@ const findAncestor = (
 };
 
 const RedoCheckoutButtons = (props: {
-  cart: CartReturn;
+  cart: CartReturn | CartWithActionsDocs;
   children?: ReactNode;
   onClick?: (enabled: boolean) => void;
 }) => {

package/src/index.ts

@@ -1,7 +1,7 @@
 import { RedoProvider, useRedoCoverageClient } from "./providers/redo-coverage-client";
 import { RedoCheckoutButtons } from "./components/redo-checkout-buttons";
 import { REDO_REQUIRED_HOSTNAMES } from "./utils/security";
-import { CartProductVariantFragment, CartAttributeKey, CartInfoToEnable, RedoContextValue, RedoCoverageClient } from "./types";
+import { CartProductVariantFragment, CartAttributeKey, CartInfoToEnable, RedoContextValue, RedoCoverageClient, RedoError, RedoErrorType } from "./types";
 import { LoadState, Loader, useLoad } from './utils/react-utils'
 
 export {
@@ -9,7 +9,8 @@ export {
   RedoProvider,
   useRedoCoverageClient,
   useLoad,
-  REDO_REQUIRED_HOSTNAMES
+  REDO_REQUIRED_HOSTNAMES,
+  RedoErrorType
 };
 
 export type {
@@ -20,4 +21,5 @@ export type {
   RedoCoverageClient,
   LoadState,
   Loader,
+  RedoError
 };

package/src/providers/redo-coverage-client.tsx

@@ -3,7 +3,8 @@ import { CartReturn } from "@shopify/hydrogen";
 import { createContext, ReactNode, useContext, useEffect, useState } from "react";
 import { CartProductVariantFragment, CartAttributeKey, CartInfoToEnable, RedoContextValue, RedoCoverageClient, RedoError, RedoErrorType } from "../types";
 import { REDO_PUBLIC_API_HOSTNAME } from "../utils/security";
-import { addProductToCartIfNeeded, removeProductFromCartIfNeeded, setCartRedoEnabledAttribute, useFetcherWithPromise } from "../utils/cart";
+import { addProductToCartIfNeeded, removeProductFromCartIfNeeded, setCartRedoEnabledAttribute, useFetcherWithPromise, isCartWithActionsDocs, getCartLines } from "../utils/cart";
+import { CartWithActionsDocs } from "@shopify/hydrogen-react/dist/types/cart-types";
 
 const DEFAULT_REDO_CONTEXT_VALUE: RedoContextValue = {
   enabled: false,
@@ -17,7 +18,7 @@ const RedoProvider = ({
   storeId,
   children
 }: {
-  cart: CartReturn,
+  cart: CartReturn | CartWithActionsDocs,
   storeId: string,
   children: ReactNode,
 }): ReactNode => {
@@ -40,6 +41,8 @@ const RedoProvider = ({
       return;
     }
 
+    let cartLines = getCartLines(cart);
+
     fetch(`https://${REDO_PUBLIC_API_HOSTNAME}/v2.2/stores/${storeId}/coverage-products`, {
       method: 'POST',
       headers: {
@@ -47,7 +50,7 @@ const RedoProvider = ({
       },
       body: JSON.stringify({
         cart: {
-          lineItems: cart.lines.nodes.map((cartLine) => ({
+          lineItems: cartLines.map((cartLine) => ({
             id: cartLine.id,
             originalPrice: {
               amount: cartLine.merchandise?.price?.amount,
@@ -187,7 +190,7 @@ const useRedoCoverageClient = (): RedoCoverageClient => {
       return redoContext.loading;
     },
     get eligible() {
-      return !this.loading && !!this.price && !!this.cartProduct;
+      return !this.loading && !!this.price && !!this.cartProduct && !!this.cart?.cost;
     },
     get enabled() {
       return redoContext.enabled;

package/src/types.ts

@@ -1,4 +1,5 @@
 import { CartReturn } from "@shopify/hydrogen";
+import { CartWithActionsDocs } from "@shopify/hydrogen-react/dist/types/cart-types";
 import { ProductVariant } from "@shopify/hydrogen-react/storefront-api-types";
 
 type CartProductVariantFragment = Omit<ProductVariant, 
@@ -15,7 +16,7 @@ interface RedoCoverageClient {
   get eligible(): boolean;
   get price(): number | undefined;
   get storeId(): string | undefined;
-  get cart(): CartReturn | undefined;
+  get cart(): CartReturn | CartWithActionsDocs | undefined;
   get cartProduct(): CartProductVariantFragment | undefined;
   get cartAttribute(): CartAttributeKey | undefined;
   get errors(): RedoError[] | undefined;
@@ -33,7 +34,7 @@ type RedoContextValue = {
   loading: boolean,
   storeId?: string,
   cartInfoToEnable?: CartInfoToEnable,
-  cart?: CartReturn,
+  cart?: CartReturn | CartWithActionsDocs,
   errors?: RedoError[],
 };
 

package/src/utils/cart.ts

@@ -3,15 +3,29 @@ import { CartInfoToEnable } from "../types";
 import { CartForm, CartReturn } from "@shopify/hydrogen";
 import type { AppData } from '@remix-run/react/dist/data';
 import React from 'react'
+import { CartWithActionsDocs } from "@shopify/hydrogen-react/dist/types/cart-types";
+import { CartLine, ComponentizableCartLine } from "@shopify/hydrogen-react/storefront-api-types";
 
 const DEFAULT_REDO_ENABLED_CART_ATTRIBUTE = 'redo_opted_in_from_cart';
 
+const isCartWithActionsDocs = (cart: CartReturn | CartWithActionsDocs): cart is CartWithActionsDocs => {
+  return (Array.isArray(cart.lines) && 'linesAdd' in cart && typeof cart.linesAdd === 'function');
+}
+
+const getCartLines = (cart: CartReturn | CartWithActionsDocs): Array<CartLine | ComponentizableCartLine> => {
+  if(isCartWithActionsDocs(cart)) {
+    return cart.lines;
+  } else {
+    return cart.lines.nodes ?? cart.lines.edges.map((edge) => edge.node);
+  }
+}
+
 const addProductToCartIfNeeded = async ({
   cart,
   fetcher,
   cartInfoToEnable
 }: {
-  cart: CartReturn | undefined,
+  cart: CartReturn | CartWithActionsDocs | undefined,
   fetcher: FetcherWithComponents<unknown>,
   cartInfoToEnable: CartInfoToEnable
 }) => {
@@ -19,7 +33,7 @@ const addProductToCartIfNeeded = async ({
     return await addProductToCart({ fetcher, cartInfoToEnable });
   }
 
-  const redoProductsInCart = cart.lines.nodes.filter((cartLine) => {
+  const redoProductsInCart = getCartLines(cart).filter((cartLine) => {
     return cartLine.merchandise.product.vendor === 're:do';
   });
   const correctRedoProductInCart = redoProductsInCart?.filter((cartLine) => {
@@ -67,7 +81,7 @@ const removeProductFromCartIfNeeded = async ({
   fetcher,
   cartInfoToEnable
 }: {
-  cart: CartReturn | undefined,
+  cart: CartReturn | CartWithActionsDocs | undefined,
   fetcher: FetcherWithComponents<unknown>,
   cartInfoToEnable: CartInfoToEnable
 }) => {
@@ -76,7 +90,7 @@ const removeProductFromCartIfNeeded = async ({
     return;
   }
 
-  const redoProductsInCart = cart.lines.nodes.filter((cartLine) => {
+  const redoProductsInCart = getCartLines(cart).filter((cartLine) => {
     return cartLine.merchandise.product.vendor === 're:do';
   });
 
@@ -190,5 +204,7 @@ export {
   addProductToCartIfNeeded,
   removeProductFromCartIfNeeded,
   setCartRedoEnabledAttribute,
-  useFetcherWithPromise
+  useFetcherWithPromise,
+  isCartWithActionsDocs,
+  getCartLines
 };