Fix next/link should be used with anchor as children #330 (#482)

components/cart/CartItem/CartItem.tsx

@@ -85,6 +85,7 @@ const CartItem = ({
       <div className="flex flex-row space-x-4 py-4">
         <div className="w-16 h-16 bg-violet relative overflow-hidden cursor-pointer z-0">
           <Link href={`/product/${item.path}`}>
+            <a>
               <Image
                 onClick={() => closeSidebarIfPresent()}
                 className={s.productImage}
@@ -94,16 +95,19 @@ const CartItem = ({
                 alt={item.variant.image!.altText}
                 unoptimized
               />
+            </a>
           </Link>
         </div>
         <div className="flex-1 flex flex-col text-base">
           <Link href={`/product/${item.path}`}>
+            <a>
               <span
                 className={s.productName}
                 onClick={() => closeSidebarIfPresent()}
               >
                 {item.name}
               </span>
+            </a>
           </Link>
           {options && options.length > 0 && (
             <div className="flex items-center pb-1">

components/cart/CartSidebarView/CartSidebarView.tsx

@@ -74,9 +74,11 @@ const CartSidebarView: FC = () => {
         <>
           <div className="px-4 sm:px-6 flex-1">
             <Link href="/cart">
+              <a>
                 <Text variant="sectionHeading" onClick={handleClose}>
                   My Cart
                 </Text>
+              </a>
             </Link>
             <ul className={s.lineItemsList}>
               {data!.lineItems.map((item: any) => (

components/checkout/CheckoutSidebarView/CheckoutSidebarView.tsx

@@ -44,7 +44,9 @@ const CheckoutSidebarView: FC = () => {
     >
       <div className="px-4 sm:px-6 flex-1">
         <Link href="/cart">
+          <a>
             <Text variant="sectionHeading">Checkout</Text>
+          </a>
         </Link>
 
         <PaymentWidget