commerce icon indicating copy to clipboard operation
commerce copied to clipboard

A menu redirecting to a product does not work because of the link returned by Shopify Storefront

Open tonytangdev opened this issue 2 years ago • 0 comments

Expected Behavior

When I create a new menu from Shopify and want the menu to display one product, a new link appears in my header. When I click on it, I expect the product page to be displayed. image

Current Behavior

When I click on the new menu link, I get a 404 page not found. image

Possible Solution

When we fetch the menus (https://github.com/vercel/commerce/blob/main/lib/shopify/index.ts#L340), the returned values when we have a menu that's meant to redirect to one product looks like this :

[
  {
    title: 'echarpe',
    url: 'https://ivivi-fr.myshopify.com/products/echarpe'
  }
]

Notice products is plural. However, to redirect to a product page, in this project, the link must look like this : https://ivivi-fr.myshopify.com/product/echarpe. Notice product is sungular. A solution would be to rename the folder product to products and to update every href meant to redirect to a product page.

Steps to Reproduce

1.Go to https://[your-shopify-store-subdomain].myshopify.com/admin/menus 2.Create a new Element inside your Next.js Frontend Header Menu menu 4.Choose any product 5. Save 6. A new menu should appear on your NextJS app 7. Click on it 8. Notice the link is wrong

tonytangdev avatar Jan 25 '24 20:01 tonytangdev