do it client side

app/layout.tsx

@@ -54,32 +54,30 @@ export const viewport: Viewport = {
   themeColor: "#000000",
 };
 
-async function getMe() {
-  const cookieStore = await cookies();
-  const cookieName = MY_TOKEN_KEY();
-  const token = cookieStore.get(cookieName)?.value;
+// async function getMe() {
+//   const cookieStore = await cookies();
+//   const cookieName = MY_TOKEN_KEY();
+//   const token = cookieStore.get(cookieName)?.value;
 
-  if (!token) return { user: null, projects: [], errCode: null };
-  try {
-    const res = await apiServer.get("/me", {
-      headers: {
-        Authorization: `Bearer ${token}`,
-      },
-    });
-    console.log("✅ [Server] User authenticated:", res.data.user?.name);
-    return { user: res.data.user, projects: res.data.projects, errCode: null };
-  } catch (err: any) {
-    console.error("❌ [Server] Auth error:", err.status, err.message);
-    return { user: null, projects: [], errCode: err.status };
-  }
-}
+//   if (!token) return { user: null, projects: [], errCode: null };
+//   try {
+//     const res = await apiServer.get("/me", {
+//       headers: {
+//         Authorization: `Bearer ${token}`,
+//       },
+//     });
+//     return { user: res.data.user, projects: res.data.projects, errCode: null };
+//   } catch (err: any) {
+//     return { user: null, projects: [], errCode: err.status };
+//   }
+// }
 
 export default async function RootLayout({
   children,
 }: Readonly<{
   children: React.ReactNode;
 }>) {
-  const data = await getMe();
+  // const data = await getMe();
 
   // Generate structured data
   const structuredData = generateStructuredData("WebApplication", {
@@ -118,7 +116,7 @@ export default async function RootLayout({
         <IframeDetector />
         <Toaster richColors position="bottom-center" />
         <TanstackContext>
-          <AppContext me={data}>
+          <AppContext>
             <LoginProvider>
               <ProProvider>{children}</ProProvider>
             </LoginProvider>

components/contexts/app-context.tsx

@@ -10,33 +10,32 @@ import { useBroadcastChannel } from "@/lib/useBroadcastChannel";
 
 export default function AppContext({
   children,
-  me: initialData,
-}: {
+}: // me: initialData,
+{
   children: React.ReactNode;
-  me?: {
-    user: User | null;
-    projects: ProjectType[];
-    errCode: number | null;
-  };
+  // me?: {
+  //   user: User | null;
+  //   projects: ProjectType[];
+  //   errCode: number | null;
+  // };
 }) {
-  const { loginFromCode, user, logout, loading, errCode } =
-    useUser(initialData);
+  const { loginFromCode, user, logout, loading, errCode } = useUser();
   const pathname = usePathname();
   const router = useRouter();
 
-  useMount(() => {
-    if (!initialData?.user && !user) {
-      if ([401, 403].includes(errCode as number)) {
-        logout();
-      } else if (pathname.includes("/spaces")) {
-        if (errCode) {
-          toast.error("An error occured while trying to log in");
-        }
-        // If we did not manage to log in (probs because api is down), we simply redirect to the home page
-        router.push("/");
-      }
-    }
-  });
+  // useMount(() => {
+  //   if (!initialData?.user && !user) {
+  //     if ([401, 403].includes(errCode as number)) {
+  //       logout();
+  //     } else if (pathname.includes("/spaces")) {
+  //       if (errCode) {
+  //         toast.error("An error occured while trying to log in");
+  //       }
+  //       // If we did not manage to log in (probs because api is down), we simply redirect to the home page
+  //       router.push("/");
+  //     }
+  //   }
+  // });
 
   const events: any = {};
 

hooks/useUser.ts

@@ -18,22 +18,26 @@ export const useUser = (initialData?: {
   const client = useQueryClient();
   const router = useRouter();
   const [, setCurrentRoute, removeCurrentRoute] = useCookie("deepsite-currentRoute");
-  const [, setToken, removeToken] = useCookie(MY_TOKEN_KEY());
+  const [token, setToken, removeToken] = useCookie(MY_TOKEN_KEY());
 
-  const { data: { user, errCode } = { user: null, errCode: null }, isLoading } =
+  const { data: { user, errCode } = { user: null, errCode: null }, isLoading, refetch: refetchMe } =
     useQuery({
       queryKey: ["user.me"],
       queryFn: async () => {
-        return { user: initialData?.user || null, errCode: initialData?.errCode || null };
+        const me = await api.get("/me");
+        if (me.data) {
+          if (me.data.projects) {
+            setProjects(me.data.projects);
+          }
+          return { user: me.data.user, errCode: me.data.errCode };
+        }
+        return { user: null, errCode: null };
       },
       refetchOnWindowFocus: false,
       refetchOnReconnect: false,
       refetchOnMount: false,
       retry: false,
-      initialData: initialData
-        ? { user: initialData?.user, errCode: initialData?.errCode }
-        : undefined,
-      enabled: false,
+      enabled: true,
     });
 
   const { data: loadingAuth } = useQuery({
@@ -90,21 +94,8 @@ export const useUser = (initialData?: {
           const cookieString = `${MY_TOKEN_KEY()}=${res.data.access_token}; path=/; max-age=${expiresIn}; samesite=lax${cookieOptions.secure ? '; secure' : ''}`;
           document.cookie = cookieString;
           
-          const meResponse = await api.get("/me");
-          if (meResponse.data) {
-            client.setQueryData(["user.me"], {
-              user: meResponse.data.user,
-              errCode: null,
-            });
-            if (meResponse.data.projects) {
-              setProjects(meResponse.data.projects);
-            }
-          }
-          
-          setTimeout(() => {
-            window.location.href = "/";
-          }, 100);
-          
+          refetchMe();
+          router.push("/")
           toast.success("Login successful");
         }
       })