no se ni lo que es esto

components/app-sidebar.tsx

@@ -1,4 +1,5 @@
 "use client";
+import { useEffect, useState } from "react";
 import { getUser } from "@/lib/usersService"; 
 
 import {
@@ -51,17 +52,32 @@ const items = [
   },
 ];
 
-const realUser = await getUser()
-
-// Datos del usuario (esto luego vendrá de tu auth)
-const user = {
-  name: `${realUser.firstname} ${realUser.lastname}`,
-  email: realUser.email,
-  avatar: "/avatar.jpg", // o null si no tienes imagen
-  initials: `${realUser.firstname.charAt(0)}${realUser.lastname.charAt(0)}`
-};
-
 export function AppSidebar() {
+  const [user, setUser] = useState({
+    name: "Cargando...",
+    email: "",
+    avatar: "/avatar.jpg",
+    initials: "..."
+  });
+
+  useEffect(() => {
+    async function loadUser() {
+      try {
+        const realUser = await getUser();
+        setUser({
+          name: `${realUser.firstname} ${realUser.lastname}`,
+          email: realUser.email,
+          avatar: "/avatar.jpg",
+          initials: `${realUser.firstname.charAt(0)}${realUser.lastname.charAt(0)}`
+        });
+      } catch (error) {
+        console.error("Failed to load user:", error);
+        setUser(prev => ({ ...prev, name: "Usuario desconocido" }));
+      }
+    }
+    loadUser();
+  }, []);
+
   return (
     <Sidebar>
       <SidebarContent>

lib/usersService.ts

@@ -1,5 +1,6 @@
 import { dolibarrFetch } from "./dolibarrClient";
 
-export async function getUser() {
-  return dolibarrFetch("users/3");
+export async function getUser(id?: string) {
+  const userId = id || process.env.NEXT_PUBLIC_DOLIBARR_USER_ID || "1";
+  return dolibarrFetch(`users/${userId}`);
 }