Next.js Discord

Discord Forum

Infinite Hydratation

Answered
Ninhache posted this in #help-forum
Open in Discord
Looks like i've fucked up something :
I've my page who simply importing a component :
"use client";

export default function Home({ params: { lang }}) {
  console.log('LANG', lang)
  return (<>
    <Component lang={lang} .../>
  </>)
}

Basically it's just that :
The component :
export default async function TranslateComponent({ lang, namespace, key }) {
  const dictionary = await getDictionary(lang)
  return (
    <span>{dictionary[namespace][key]}</span>
  );
}

I'm pretty sure the problem comes from the component (because if i comment it i've no more errors)
Maybe a state could solve idk.. i only want to know why it's getting fucked rn
Answered by joulev
async client components will rerender infinitely. so just treat as they don't exist and use a normal component instead
View full answer

10 Replies

Answer
Ah ? in a Client Component i can't use a server one.. ?
no you cannot import a server component to a client component
that makes sense..
but the use a normal component instead is a bit hard :/
May i can down the client logic to make my page not client-side
Sorry for the ping :fine: @joulev
Is that a great thing to do a Client component then to handle the buttons ?
Basically.. <ClientButton onClick={...} /> would be available server side 🤓
That's could make sense.. but i don't want to make anti-pattern or smth lmao
AHAHA why u block me...........
can't put a ❤️ on you.....