Pass state from Async parent component into child that changes it and returns it back to the parent.

[faint rain]

So like in the title. I need to achieve this action that state is being shared between child and async parent component. Normally I would approach that with passing setState action into chid props and calls it inside child and wait for changes using useEffect() inside parent component but I can't use useState or useEffect beause the parent component is async server component. Anybody has any idea?

[heady folio]

Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

      🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in <id:customize>

      ✅ You can mark a message as the answer for your post with `Right click -> Apps -> Mark Solution`
      (if you don't see the option, try refreshing Discord with Ctrl + R)

[crimson tinsel]

Server components really do not share state with the client. Changing query parameters will make the RSC refresh with the new url

Maybe set a cookie and run router.refresh()

[faint rain]

yeah i thought about that but the thing is I don't want to refresh entire page everytime. That's the problem

[crimson tinsel]

why do you want to use an RSC?

important: components with use client are still server side rendered

also important: using next/navigation to change the query parameters will not cause a full page refresh, only for it to refetch the RSC (any RSC that views query parameters)

[faint rain]

so it may be possible to just redirect the page from child component with specific query and access that query in parent component?

without the full reload

[faint rain]

Well beacuse my parent component is in fact a dynamic route page that gets the param and based on this param fetches the data.

[crimson tinsel]

Query parameter might make sense then. Dont think of it as a redirect, it is more like doing history.replaceState or history.pushState.

[faint rain]

Thanks for that idea. It works just fine!