Questions about using minimal API

[jkhaui]

Great to see Waku still going strong!

I recently refactored my project from the pages FS router to the minimal API, following examples in the repo with the typical main.tsx and entries.tsx files.

Not sure if I'm missing something obvious, but without the pages dir routing, how can I replicate layouts and pages marked as static/dynamic?

Can I just mark any React component with the same export const getConfig... return "dynamic" syntax?

Also - with the minimal API do we have access to React DOM's rendering methods and config?

Thanks!

[dai-shi]

The minimal API doesn't have the notion of static/dynamic or pages/layouts. It's so minimal that you can create your own router on top of it.

[dai-shi]

FYI

Waku middleware / API stack (v0.23)

https://excalidraw.com/#json=Tw6pnU-uXwW8WRzCnNXDw,Zz4jaB7E03Mt_VhOWjW4sg

[jkhaui]

edit: oh wait, as I wrote this, I think I noticed the reason.,.. is it because I'm rendering the same root layout/app component for BOTH the RSC phase + SSR? 🤦‍♂️ And the error is only occurring during the SSR part because it doesn't have access to the same server context. I think that's what's happening

The minimal API doesn't have the notion of static/dynamic or pages/layouts. It's so minimal that you can create your own router on top of it.

Thank you - the confusion I have is, say before (with the FS router) I had a root layout accessing server-side ctx info like so:

    const ctx = getCustomContext()

    const uaString = ctx?.__waku_requestHeaders['user-agent']

    // bottom of file
    export const getConfig = async () => {
        return {
            render: 'dynamic',
        }
      };

This worked fine. However, now using the minimal router, I will get this logged every time in my terminal:

Error [TypeError]: Cannot read properties of undefined (reading 'user-agent')
    at __vite_ssr_export_default__ 

What's interesting is that the app still loads fine. But any suggestions on what's causing the issue/how to fix it properly?
I don't think I'm doing anything unusual - just accessing the Waku/Hono context from the outermost RSC that is rendered with the minimal API.

---

About React DOM, I should have explicitly said react-dom/server. I can see Waku uses renderToReadableStream. I am having some issues with SSR hydration, so just wondering if you have ideas for areas I could play around with react-dom/server APIs to try and fix this.

Thanks again for the great work

[dai-shi]

I think that's what's happening

Probably, but I'm not exactly sure how it's happening. A small reproduction may help.

[jkhaui]

Thank you, I've been looking through the other examples. I think maybe the minimal API isn't what I need for my case, it's probably the programmatic defineRouter fn. I will experiment with this, thanks!

[dai-shi]

with the minimal API do we have access to React DOM's rendering methods and config?

Can you elaborate your question?

[dai-shi]

About React DOM, I should have explicitly said react-dom/server.

Still not sure, but yeah, you could use react-dom/server APIs, like preload.