I have an issue in NextJs app router. The setup is like this:
app
-store
-page.js
[regionName]
[placeName]
[storeName]
In store page I have a list of links that routes to the storeName and regionName pages. regionName page also have links that routes to storeName.
All pages and components are server components.
I have a StoreCard component that contains a link that looks like this
<Link href={`/store/${url_key}`}>Go to store</Link>
From the store page link works as it should. Problem is when I navigate to regionName page and click on the link to navigate to storeName, about 100 requests are made to the correct link plus a query of ?_rsc=shortStringId with a status of 200 and a content type of text/x-component.
After a few seconds an error is thrown
Unhandled Runtime Error:
async/await is not yet supported in Client Components, only Server Components. This error is often caused by accidentally adding `'use client'` to a module that was originally written for the server.
When I build the project i see that storeName page is static generated (prerendered as static content) and all other pages are generated dynamically (server-rendered on demand using Node.js).
Should this be a problem with Next Link prefetch?