A menu redirecting to a product does not work because of the link returned by Shopify Storefront
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.
Current Behavior
When I click on the new menu link, I get a 404 page not found.
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