Next.js Discord

Discord Forum

How to render a ServerComponent, that depends on Client State.

Answered
Turkish Angora posted this in #help-forum
Open in Discord
Avatar
Turkish AngoraOP
Am trying to figure out how to use a getItems(query) Action, that uses a query provided by Client Component (zustand).
export default async function Page() {
  return (<main>
    {/* Search Bar that works on whole App */}
    <ClientSearchBar /> {/* Uses zustand for `query` and `setQuery` */}

    {/* ... */}

    {/* Get `query` from zustand store and pass it to `children` */}
    <ClientSearchResults>
      {/*
        Uses `query` to `actionGetSearchResults(query)`
        and renders the results
        and repeats when `query` changes
      */}
      <ServerSearchResults /> 
    </ClientSearchResults>
  </main>)
}

2 Replies

Answer
Avatar
Turkish AngoraOP
ty