account settings update

src/layouts/DashboardLayout.tsx

@@ -1,4 +1,27 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
+import { pb } from '../config/pocketbase';
+
+interface User {
+  id: string;
+  email: string;
+  emailVisibility: boolean;
+  verified: boolean;
+  name: string;
+  role: string;
+  company: string;
+  mfa_enabled: boolean;
+  created: string;
+  updated: string
+}
+
+interface Company {
+  id: string;
+  name: string;
+  no: string;
+  vip_level: string;
+  created: string;
+  updated: string
+}
 
 // Définition stricte des propriétés attendues par le Layout
 interface DashboardLayoutProps {
@@ -9,6 +32,27 @@ interface DashboardLayoutProps {
 }
 
 export default function DashboardLayout({ children, activeView, onNavigate, onLogout }: DashboardLayoutProps) {
+  const [user, setUser] = useState<User | null>(null);
+  const [company, setCompany] = useState<Company | null>(null);
+  const [isLoading, setIsLoading] = useState(true);
+
+  const fetchInformations = async () => {
+          setIsLoading(true);
+        try {
+          const userRecords = await pb.collection('aegis_users').getFullList<User>();
+          setUser(userRecords[0]);
+          const companyRecords = await pb.collection('aegis_companies').getFullList<Company>();
+          setCompany(companyRecords[0])
+        } catch (error) {
+          console.error("Erreur lors de la récupération des infos utilisateur :", error);
+        } finally {
+          setIsLoading(false);
+        }
+      };
+  
+      useEffect(()=>{
+        fetchInformations();
+      },[]);
   
   const navItems = [
     { id: 'dashboard', label: 'Tableau de bord', icon: (
@@ -66,10 +110,14 @@ export default function DashboardLayout({ children, activeView, onNavigate, onLo
             }`}
           >
             <div className="w-8 h-8 rounded-full bg-slate-200 flex items-center justify-center text-slate-600 font-bold text-sm shrink-0">
-              DC
+              {isLoading? "":user?.name.split(" ").map((n)=>n[0]).join("")}
             </div>
             <div className="ml-3 overflow-hidden">
-              <p className="text-sm font-medium text-slate-900 truncate">Direction Client</p>
+            {isLoading?
+              <p className="text-sm font-medium text-slate-200 bg-slate-200 rounded ">*</p>
+              :
+              <p className="text-sm font-medium text-slate-900 truncate">{user?.name}</p>
+            }
               <p className="text-xs text-slate-500 truncate">Paramètres du compte</p>
             </div>
           </button>