Updated cart item, fixed deprecations

framework/shopify/types.ts

@@ -12,7 +12,9 @@ export interface Cart extends Core.Cart {
   lineItems: LineItem[]
 }
 
-export interface LineItem extends Core.LineItem {}
+export interface LineItem extends Core.LineItem {
+  options: any[]
+}
 
 /**
  * Cart mutations

framework/shopify/utils/normalize.ts

@@ -40,8 +40,9 @@ const normalizeProductImages = ({ edges }: ImageConnection) =>
     ...rest,
   }))
 
-const normalizeProductVariants = ({ edges }: ProductVariantConnection) =>
+const normalizeProductVariants = ({ edges }: ProductVariantConnection) => {
-  edges?.map(({ node: { id, selectedOptions } }) => ({
+  console.log(edges)
+  return edges?.map(({ node: { id, selectedOptions } }) => ({
     id,
     options: selectedOptions.map(({ name, value }: SelectedOption) =>
       normalizeProductOption({
@@ -51,6 +52,7 @@ const normalizeProductVariants = ({ edges }: ProductVariantConnection) =>
       })
     ),
   }))
+}
 
 export function normalizeProduct(productNode: ShopifyProduct): any {
   const {
@@ -66,7 +68,7 @@ export function normalizeProduct(productNode: ShopifyProduct): any {
     ...rest
   } = productNode
 
-  return {
+  const product = {
     id,
     name,
     vendor,
@@ -79,6 +81,8 @@ export function normalizeProduct(productNode: ShopifyProduct): any {
     options: options ? options.map((o) => normalizeProductOption(o)) : [],
     ...rest,
   }
+
+  return product
 }
 
 export function normalizeCart(checkout: Checkout): Cart {
@@ -88,13 +92,13 @@ export function normalizeCart(checkout: Checkout): Cart {
     email: '',
     createdAt: checkout.createdAt,
     currency: {
-      code: checkout.currencyCode,
+      code: checkout.totalPriceV2?.currencyCode,
     },
     taxesIncluded: checkout.taxesIncluded,
     lineItems: checkout.lineItems?.edges.map(normalizeLineItem),
-    lineItemsSubtotalPrice: checkout.subtotalPrice,
+    lineItemsSubtotalPrice: checkout.subtotalPriceV2?.amount,
-    subtotalPrice: checkout.subtotalPrice,
+    subtotalPrice: checkout.subtotalPriceV2?.amount,
-    totalPrice: checkout.totalPrice,
+    totalPrice: checkout.totalPriceV2?.amount,
     discounts: [],
   }
 }
@@ -106,7 +110,7 @@ function normalizeLineItem({
     id,
     variantId: String(variant?.id),
     productId: String(variant?.id),
-    name: `${title} - ${variant?.title}`,
+    name: `${title}`,
     quantity,
     variant: {
       id: String(variant?.id),
@@ -116,10 +120,15 @@ function normalizeLineItem({
         url: variant?.image?.originalSrc,
       },
       requiresShipping: variant?.requiresShipping ?? false,
-      price: variant?.price,
+      price: variant?.priceV2?.amount,
-      listPrice: variant?.compareAtPrice,
+      listPrice: variant?.compareAtPriceV2?.amount,
     },
     path: '',
     discounts: [],
+    options: [
+      {
+        value: variant?.title,
+      },
+    ],
   }
 }

framework/shopify/utils/queries/get-checkout-query.ts

@@ -1,10 +1,18 @@
 export const checkoutDetailsFragment = `
   id
   webUrl
-  subtotalPrice
+  subtotalPriceV2{
-  totalTax
+    amount
-  totalPrice
     currencyCode
+  }
+  totalTaxV2 {
+    amount
+    currencyCode
+  }
+  totalPriceV2 {
+    amount
+    currencyCode
+  }
   completedAt
   createdAt
   taxesIncluded
@@ -27,7 +35,14 @@ export const checkoutDetailsFragment = `
             width
             height
           }
-          price
+          priceV2{
+            amount
+            currencyCode
+          }
+          compareAtPriceV2{
+            amount
+            currencyCode
+          }
         }
         quantity
       }

framework/shopify/utils/queries/get-product-query.ts

@@ -36,8 +36,14 @@ const getProductQuery = /* GraphQL */ `
               name
               value
             }
-            price
+            priceV2 {
-            compareAtPrice
+              amount
+              currencyCode
+            }
+            compareAtPriceV2 {
+              amount
+              currencyCode
+            }
           }
         }
       }

tsconfig.json

@@ -22,8 +22,8 @@
       "@utils/*": ["utils/*"],
       "@commerce/*": ["framework/commerce/*"],
       "@commerce": ["framework/commerce"],
-      "@framework/*": ["framework/bigcommerce/*"],
+      "@framework/*": ["framework/shopify/*"],
-      "@framework": ["framework/bigcommerce"]
+      "@framework": ["framework/shopify"]
     }
   },
   "include": ["next-env.d.ts", "**/*.d.ts", "**/*.ts", "**/*.tsx", "**/*.js"],