From 68ed96e28ad94fef0833acc062e72d08fe2069c8 Mon Sep 17 00:00:00 2001
From: tonytangdev <tony.tang.developer@gmail.com>
Date: Thu, 25 Jan 2024 21:37:24 +0100
Subject: [PATCH] fix(products): update links redirecting to product

https://github.com/vercel/commerce/issues/1285
---
 app/sitemap.ts                           | 2 +-
 components/carousel.tsx                  | 2 +-
 components/cart/modal.tsx                | 2 +-
 components/grid/three-items.tsx          | 5 ++++-
 components/layout/product-grid-items.tsx | 5 ++++-
 5 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/app/sitemap.ts b/app/sitemap.ts
index fe8ed96ac..8ee2109f5 100644
--- a/app/sitemap.ts
+++ b/app/sitemap.ts
@@ -28,7 +28,7 @@ export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
 
   const productsPromise = getProducts({}).then((products) =>
     products.map((product) => ({
-      url: `${baseUrl}/product/${product.handle}`,
+      url: `${baseUrl}/products/${product.handle}`,
       lastModified: product.updatedAt
     }))
   );
diff --git a/components/carousel.tsx b/components/carousel.tsx
index 286d4dfea..841c81263 100644
--- a/components/carousel.tsx
+++ b/components/carousel.tsx
@@ -19,7 +19,7 @@ export async function Carousel() {
             key={`${product.handle}${i}`}
             className="relative aspect-square h-[30vh] max-h-[275px] w-2/3 max-w-[475px] flex-none md:w-1/3"
           >
-            <Link href={`/product/${product.handle}`} className="relative h-full w-full">
+            <Link href={`/products/${product.handle}`} className="relative h-full w-full">
               <GridTileImage
                 alt={product.title}
                 label={{
diff --git a/components/cart/modal.tsx b/components/cart/modal.tsx
index aee2f7a47..b52077da0 100644
--- a/components/cart/modal.tsx
+++ b/components/cart/modal.tsx
@@ -91,7 +91,7 @@ export default function CartModal({ cart }: { cart: Cart | undefined }) {
                       });
 
                       const merchandiseUrl = createUrl(
-                        `/product/${item.merchandise.product.handle}`,
+                        `/products/${item.merchandise.product.handle}`,
                         new URLSearchParams(merchandiseSearchParams)
                       );
 
diff --git a/components/grid/three-items.tsx b/components/grid/three-items.tsx
index 23b3f8991..ef56443d2 100644
--- a/components/grid/three-items.tsx
+++ b/components/grid/three-items.tsx
@@ -16,7 +16,10 @@ function ThreeItemGridItem({
     <div
       className={size === 'full' ? 'md:col-span-4 md:row-span-2' : 'md:col-span-2 md:row-span-1'}
     >
-      <Link className="relative block aspect-square h-full w-full" href={`/product/${item.handle}`}>
+      <Link
+        className="relative block aspect-square h-full w-full"
+        href={`/products/${item.handle}`}
+      >
         <GridTileImage
           src={item.featuredImage.url}
           fill
diff --git a/components/layout/product-grid-items.tsx b/components/layout/product-grid-items.tsx
index ea8a5ebf7..72b2c7ffb 100644
--- a/components/layout/product-grid-items.tsx
+++ b/components/layout/product-grid-items.tsx
@@ -8,7 +8,10 @@ export default function ProductGridItems({ products }: { products: Product[] })
     <>
       {products.map((product) => (
         <Grid.Item key={product.handle} className="animate-fadeIn">
-          <Link className="relative inline-block h-full w-full" href={`/product/${product.handle}`}>
+          <Link
+            className="relative inline-block h-full w-full"
+            href={`/products/${product.handle}`}
+          >
             <GridTileImage
               alt={product.title}
               label={{