diff --git a/frontend/src/components/auth/UserMenu.tsx b/frontend/src/components/auth/UserMenu.tsx
new file mode 100644
index 0000000..91fda33
--- /dev/null
+++ b/frontend/src/components/auth/UserMenu.tsx
@@ -0,0 +1,43 @@
+import { clearAccessToken } from '../../lib/oauth';
+import { useAuthContext } from '../../context/AuthContext';
+import LoginButton from './LoginButton';
+
+interface UserMenuProps {
+ /** Optionnel : si fourni, prend le dessus sur le nickname de l'utilisateur */
+ displayName?: string;
+}
+
+export default function UserMenu({ displayName }: UserMenuProps) {
+ const { user } = useAuthContext();
+
+ function handleLogout() {
+ clearAccessToken();
+ window.location.href = '/';
+ }
+
+ if (!user) {
+ return ;
+ }
+
+ const name = displayName ?? user.nickname ?? 'Mon compte';
+
+ return (
+
+ {/* Avatar placeholder */}
+
+ {name !== 'Mon compte' ? name[0].toUpperCase() : '●'}
+
+
+
+ {name}
+
+
+
+
+ );
+}