initializing clientside user in rootlayout

Question

I want opinion on this one

const RootLayout = async ({ children }: { children: React.ReactNode }) => {
  const supabase = createClient();

  const {
    data: { user },
  } = await supabase.auth.getUser();
  return (
    <html lang="en">
      <body className={cn(` min-h-screen  ${inter.className} `)}>
        {user && <InitUser user={user} />}
        <SiteHeader />
        <>{children}</>
        <Toaster position="top-center" />
      </body>
    </html>
  );
};

I am initialzing the user for the client side in the rootlayout by fetching it using the

"use client";
import { User } from "@supabase/supabase-js";
import React, { useEffect, useRef } from "react";
import { useUser } from "./user";

export default function InitUser({ user }: { user: User | undefined }) {
  const initState = useRef(false);

  useEffect(() => {
    if (!initState.current) {
      useUser.setState({ user });
    }
    initState.current = true;
    // eslint-disable-next-line
  }, []);

  return <></>;
}

This works for me but I want to know if any performance issues or something that can cause issue

initializing clientside user in rootlayout

0 Replies