feat: cart handling

components/cart/index.tsx

@@ -1,20 +1,14 @@
-import { createCart, getCart } from 'lib/shopify';
+import { getCart } from 'lib/shopware';
 import { cookies } from 'next/headers';
 import CartModal from './modal';
 
 export default async function Cart() {
-  // const cartId = cookies().get('cartId')?.value;
-  // let cartIdUpdated = false;
-  // let cart;
-  // if (cartId) {
-  //   cart = await getCart(cartId);
-  // }
-  // // If the `cartId` from the cookie is not set or the cart is empty
-  // // (old carts becomes `null` when you checkout), then get a new `cartId`
-  // //  and re-fetch the cart.
-  // if (!cartId || !cart) {
-  //   cart = await createCart();
-  //   cartIdUpdated = true;
-  // }
-  // return <CartModal cart={cart} cartIdUpdated={cartIdUpdated} />;
-}
+  const cartId = cookies().get('sw-context-token')?.value;
+  let cartIdUpdated = true;
+  const cart = await getCart();
+
+  if (cartId !== cart.id) {
+    cartIdUpdated = true;
+  }
+  return <CartModal cart={cart} cartIdUpdated={cartIdUpdated} />;
+}

lib/shopware/api.ts

@@ -4,9 +4,9 @@ import {
   ExtendedCategory,
   ExtendedCriteria,
   ExtendedCrossSellingElementCollection,
-  ExtendedProductListingResult,
   extendedOperations,
-  extendedPaths
+  extendedPaths,
+  ExtendedProductListingResult
 } from './api-extended';
 import {
   CategoryListingResultSW,
@@ -142,3 +142,7 @@ export async function requestCrossSell(
     }
   );
 }
+
+export async function requestCart() {
+  return apiInstance.invoke('readCart get /checkout/cart?name', {});
+}

lib/shopware/index.ts

@@ -1,11 +1,17 @@
+import { Cart } from 'lib/shopify/types';
 import {
-  ApiSchemas,
-  Menu,
-  Page,
-  Product,
-  ProductListingCriteria,
-  StoreNavigationTypeSW
-} from './types';
+  requestCart,
+  requestCategory,
+  requestCategoryList,
+  requestCategoryProductsCollection,
+  requestCrossSell,
+  requestNavigation,
+  requestProductsCollection,
+  requestSearchCollectionProducts,
+  requestSeoUrl,
+  requestSeoUrls
+} from './api';
+import { ExtendedCategory, ExtendedProduct, ExtendedProductListingResult } from './api-extended';
 import {
   getDefaultCategoryCriteria,
   getDefaultCategoryWithCmsCriteria,
@@ -16,17 +22,6 @@ import {
   getSortingCriteria,
   getStaticCollectionCriteria
 } from './criteria';
-import {
-  requestCategory,
-  requestCategoryList,
-  requestCategoryProductsCollection,
-  requestCrossSell,
-  requestNavigation,
-  requestProductsCollection,
-  requestSearchCollectionProducts,
-  requestSeoUrl,
-  requestSeoUrls
-} from './api';
 import {
   transformCollection,
   transformHandle,
@@ -36,7 +31,14 @@ import {
   transformProducts,
   transformStaticCollection
 } from './transform';
-import { ExtendedCategory, ExtendedProduct, ExtendedProductListingResult } from './api-extended';
+import {
+  ApiSchemas,
+  Menu,
+  Page,
+  Product,
+  ProductListingCriteria,
+  StoreNavigationTypeSW
+} from './types';
 
 export async function getMenu(params?: {
   type?: StoreNavigationTypeSW;
@@ -214,3 +216,63 @@ export async function getProductRecommendations(productId: string): Promise<Prod
 
   return products ? transformProducts(products) : [];
 }
+
+export async function getCart(): Promise<Cart> {
+  const cartData = await requestCart();
+
+  let cart: Cart = {
+    checkoutUrl: 'https://frontends-demo.vercel.app',
+    cost: {
+      subtotalAmount: {
+        amount: cartData.price?.positionPrice?.toString() || '0',
+        currencyCode: 'EUR'
+      },
+      totalAmount: {
+        amount: cartData.price?.totalPrice?.toString() || '0',
+        currencyCode: 'EUR'
+      },
+      totalTaxAmount: {
+        amount: '0',
+        currencyCode: 'EUR'
+      }
+    },
+    id: cartData.token || '',
+    lines:
+      cartData.lineItems?.map((lineItem) => ({
+        id: lineItem.id || '',
+        quantity: lineItem.quantity,
+        cost: {
+          totalAmount: {
+            amount: (lineItem as any)?.price?.totalPrice || ''
+          }
+        },
+        merchandise: {
+          id: lineItem.referencedId,
+          title: lineItem.label,
+          selectedOptions: [],
+          product: {
+            description: lineItem.description,
+            descriptionHtml: lineItem.description,
+            id: lineItem.referencedId,
+            images: [],
+            seo: {
+              description: lineItem.description,
+              title: lineItem.label
+            },
+            availableForSale: true,
+            featuredImage: (lineItem as any).cover?.url,
+            handle: '',
+            options: [],
+            variants: [],
+            priceRange: {},
+            tags: [],
+            title: lineItem.label,
+            updatedAt: (lineItem as any)?.payload?.updatedAt
+          }
+        }
+      })) || [],
+    totalQuantity: cartData.lineItems?.length || 0
+  };
+
+  return cart;
+}