[BUG] By "throw new HTTPNotFound" we don't render "PageNotFound" page

[MykolaShkut-melon]

Summary

All 404 pages should have the same design

Short summary of what is going on or to provide context.

Steps To Reproduce

Open some product pages with no existing product id for example https://pwa-kit.mobify-storefront.com/product/aaa

Expected result

render the HTML of the PageNotFound page component with header and footer

Describe what should have happened.

Actual result

But now we see an error page generated with _error/index.jsx

[git2gus[bot]]

This issue has been linked to a new work item: W-12586787

[bendvc]

Hi @MykolaShkut-melon

Are you seeing a difference in the SDK version you generated your project with and the one you reported this issue on? The way errors are handled is very different when you are talking about a routing match and throwing them in render or getProps.

I tried generating a project with version 2.2.0 and it behaved the same to our latest 2.7.0 version. I'm only asking so I know to treat this as a regression/bug or a request.

A side note. The template-retail-react-app was created as a starting point for developing your storefront, and we didn't implement customized error handling for pages like product-detail or product-list. As a result we simply throw and error and let the catch all error handler do its thing. We expect that project implementors would handle product not found errors in a customized way. For example, if you want the behaviour of retaining the app "chrome", you can remove the throw logic from get props and instead render a custom error component in the render portion of the product-detail page.

Anyway.. looking forward to hearing back from you, and we can discuss this more. 👍