diff --git a/src/components/account-dialog.tsx b/src/components/account-dialog.tsx
index 7df0ee5..9827a88 100644
--- a/src/components/account-dialog.tsx
+++ b/src/components/account-dialog.tsx
@@ -2,20 +2,55 @@
 
 import { AccountInfo } from "@/components/account-info";
 import { UserDataContext } from "@/components/providers/userdata-provider";
-import { useContext } from "react";
+import { Skeleton } from "@/components/ui/skeleton";
+import type { IUserData } from "@/interfaces/userdata.interface";
+import {
+	type Dispatch,
+	type SetStateAction,
+	useContext,
+	useEffect,
+	useState,
+} from "react";
 
 export function AccountDialog() {
 	const userContext = useContext(UserDataContext);
+	const [isLoaded, setIsLoaded] = useState<boolean>(false);
 
 	if (!userContext?.userData) {
-		userContext?.setUserData({ name: "Mathis" });
-		return <p>Loading...</p>;
+		userContext?.setUserData({
+			age: 0,
+			city: "Chambéry",
+			created_at: "jaj",
+			dollarAvailables: 34,
+			email: "mherriot@tutanota.com",
+			id: "",
+			isActive: false,
+			lastName: "Herriot",
+			pseudo: "Avnyr",
+			roleId: "",
+			updated_at: "",
+			firstName: "Mathis",
+		});
 	}
 
-	//TODO No account context
+	useEffect(() => {
+		if (userContext?.userData) {
+			setIsLoaded(true);
+		}
+	}, [userContext?.userData]);
 
-	//TODO Loading context
+	if (!isLoaded) {
+		return <Skeleton className="w-14 h-10 rounded" />;
+	}
 
-	//TODO Account context
-	return <AccountInfo userData={userContext.userData} />;
+	return (
+		<div>
+			<AccountInfo
+				userData={userContext?.userData as IUserData}
+				setUserData={
+					userContext?.setUserData as Dispatch<SetStateAction<IUserData | undefined>>
+				}
+			/>
+		</div>
+	);
 }