Next.js Discord

Discord Forum

Using zustand inside server component workaround

Unanswered
In&Out posted this in #help-forum
Open in Discord
Hello folks, I have a page that is for fetching from a discord api

6 Replies

import { fetchGuild } from "@/components/utils/api";
import Element from "@/components/utils/contexts/Element";
import { useGuildStore } from "@/components/utils/contexts/GuildContext";

async function page({ params }: { params: any }) {
  const guild = await fetchGuild(params.id);
  return (
    <div className="page">
      <div>Dashboard Page {guild.name}</div>
    </div>
  );
}

export default page;
This is the file, and in there I wanted to add a zustand function that will populate a state so I can use it on other pages
The idea was, instead of fetching any time I change the page, to store all the needed info in a state so no more fetching will be required
But I can't do that, are there any workarounds to this?
async function page({ params }: { params: any }) {
  const guild = await fetchGuild(params.id);
  const guilder = useGuildStore(state=>state.setGuild)
  return (
    <div className="page">
      <div>Dashboard Page {guild.name}</div>
    </div>
  );
}
This is what I tried, but I get an error