connected cart on checkout to sfcc

components/cart/modal.tsx

@@ -8,6 +8,7 @@ import { DEFAULT_OPTION } from 'lib/constants';
 import { createUrl } from 'lib/utils';
 import Image from 'next/image';
 import Link from 'next/link';
+import { usePathname } from 'next/navigation';
 import { Fragment, useEffect, useRef, useState } from 'react';
 import { useFormStatus } from 'react-dom';
 import { createCartAndSetCookie, redirectToCheckout } from './actions';
@@ -27,6 +28,7 @@ export default function CartModal() {
   const quantityRef = useRef(cart?.totalQuantity);
   const openCart = () => setIsOpen(true);
   const closeCart = () => setIsOpen(false);
+  const pathname = usePathname();
 
   useEffect(() => {
     if (!cart) {
@@ -47,6 +49,10 @@ export default function CartModal() {
     }
   }, [isOpen, cart?.totalQuantity, quantityRef]);
 
+  useEffect(() => {
+    if (pathname === '/checkout') closeCart();
+  }, [pathname]);
+
   return (
     <>
       <button aria-label="Open cart" onClick={openCart}>