Changes

framework/bigcommerce/api/catalog/handlers/get-products.ts

@@ -1,3 +1,4 @@
+import { Product } from 'framework/types'
 import getAllProducts, { ProductEdge } from '../../operations/get-all-products'
 import type { ProductsHandlers } from '../products'
 
@@ -6,6 +7,7 @@ const SORT: { [key: string]: string | undefined } = {
   trending: 'total_sold',
   price: 'price',
 }
+
 const LIMIT = 12
 
 // Return current cart info
@@ -44,21 +46,25 @@ const getProducts: ProductsHandlers['getProducts'] = async ({
   const { data } = await config.storeApiFetch<{ data: { id: number }[] }>(
     url.pathname + url.search
   )
+
   const entityIds = data.map((p) => p.id)
   const found = entityIds.length > 0
+
   // We want the GraphQL version of each product
   const graphqlData = await getAllProducts({
     variables: { first: LIMIT, entityIds },
     config,
   })
+
   // Put the products in an object that we can use to get them by id
   const productsById = graphqlData.products.reduce<{
-    [k: number]: ProductEdge
+    [k: number]: Product
   }>((prods, p) => {
-    prods[p.node.entityId] = p
+    prods[p.id] = p
     return prods
   }, {})
-  const products: ProductEdge[] = found ? [] : graphqlData.products
+
+  const products: Product[] = found ? [] : graphqlData.products
 
   // Populate the products array with the graphql products, in the order
   // assigned by the list of entity ids

framework/bigcommerce/api/catalog/products.ts

@@ -4,11 +4,11 @@ import createApiHandler, {
   BigcommerceHandler,
 } from '../utils/create-api-handler'
 import { BigcommerceApiError } from '../utils/errors'
-import type { ProductEdge } from '../operations/get-all-products'
 import getProducts from './handlers/get-products'
+import { Product } from 'framework/types'
 
 export type SearchProductsData = {
-  products: ProductEdge[]
+  products: Product[]
   found: boolean
 }
 

framework/bigcommerce/api/operations/get-all-products.ts

@@ -127,7 +127,7 @@ async function getAllProducts({
     })
   }
 
-  return { products: products.map(({ node }) => normalizeProduct(node)) }
+  return { products: products.map(({ node }) => normalizeProduct(node as any)) }
 }
 
 export default getAllProducts

framework/bigcommerce/api/operations/get-product.ts

@@ -111,7 +111,7 @@ async function getProduct({
       setProductLocaleMeta(product)
     }
 
-    return { product: normalizeProduct(product) }
+    return { product: normalizeProduct(product as any) }
   }
 
   return {}

framework/bigcommerce/lib/normalize.ts

@@ -1,4 +1,5 @@
-import { Product as BCProduct } from '@framework/schema'
+import { Cart, CartItem, Product } from '../../types'
+import { Product as BigCommerceProduct } from '@framework/schema'
 
 function normalizeProductOption({
   node: {
@@ -14,7 +15,7 @@ function normalizeProductOption({
   }
 }
 
-export function normalizeProduct(productNode: BCProduct): Product {
+export function normalizeProduct(productNode: BigCommerceProduct): Product {
   const {
     entityId: id,
     images,
@@ -67,12 +68,47 @@ export function normalizeProduct(productNode: BCProduct): Product {
   }
 }
 
-export function normalizeCart({ data, ...rest }: any) {
+export function normalizeCart({ data, ...rest }: any): Cart {
   return {
     ...rest,
     data: {
-      products: data?.line_items?.physical_items ?? [],
+      products: data?.line_items?.physical_items.map(itemsToProducts) ?? [],
       ...data,
     },
   }
 }
+
+function itemsToProducts({
+  id,
+  name,
+  quantity,
+  product_id,
+  variant_id,
+  image_url,
+  list_price,
+  sale_price,
+  extended_list_price,
+  extended_sale_price,
+  ...rest
+}: any): CartItem {
+  return {
+    id,
+    name,
+    prices: {
+      listPrice: list_price,
+      salePrice: sale_price,
+      extendedListPrice: extended_list_price,
+      extendedSalePrice: extended_sale_price,
+    },
+    images: [
+      {
+        alt: name,
+        url: image_url,
+      },
+    ],
+    productId: product_id,
+    variantId: variant_id,
+    quantity,
+    ...rest,
+  }
+}

framework/types.d.ts

@@ -1,3 +1,5 @@
+import { CartItem } from '@components/cart'
+
 interface Entity {
   id: string | number
   [prop: string]: any
@@ -12,6 +14,7 @@ interface Product extends Entity {
   variants: ProductVariant[]
   price: ProductPrice
   options: ProductOption[]
+  sku?: string
 }
 
 interface ProductOption extends Entity {
@@ -37,8 +40,11 @@ interface ProductVariant {
 interface ProductPrice {
   value: number
   currencyCode: 'USD' | 'ARS' | string | undefined
-  retailValue?: number
-  saleValue?: number
+  retailPrice?: number
+  salePrice?: number
+  listPrice?: number
+  extendedSalePrice?: number
+  extendedListPrice?: number
 }
 
 interface Cart extends Entity {
@@ -46,7 +52,14 @@ interface Cart extends Entity {
   currency: { code: string }
   taxIncluded?: boolean
   totalAmmount: number | string
-  products: Pick<Product, 'id' | 'name' | 'prices'>[]
+  products: Pick<Product, 'id' | 'name' | 'prices'> & CartItem[]
+}
+
+interface CartItem extends Entity {
+  quantity: number
+  productId: Product['id']
+  variantId: ProductVariant['id']
+  images: ProductImage[]
 }
 
 interface Wishlist extends Entity {