From 6ee48ffb9d628a04c487b73b222be76241ff3ec4 Mon Sep 17 00:00:00 2001
From: Mohamed Bassem <me@mbassem.com>
Date: Mon, 29 Dec 2025 10:23:36 +0200
Subject: feat(mobile): make the settings menu look more native (#2307)

* feat(mobile): make the settings menu look more native

* more fixes

* review comments
---
 .../components/settings/UserProfileHeader.tsx      | 27 ++++++++++++++++++++++
 1 file changed, 27 insertions(+)
 create mode 100644 apps/mobile/components/settings/UserProfileHeader.tsx

(limited to 'apps/mobile/components/settings/UserProfileHeader.tsx')

diff --git a/apps/mobile/components/settings/UserProfileHeader.tsx b/apps/mobile/components/settings/UserProfileHeader.tsx
new file mode 100644
index 00000000..6e389877
--- /dev/null
+++ b/apps/mobile/components/settings/UserProfileHeader.tsx
@@ -0,0 +1,27 @@
+import { View } from "react-native";
+import { Avatar } from "@/components/ui/Avatar";
+import { Text } from "@/components/ui/Text";
+
+interface UserProfileHeaderProps {
+  image?: string | null;
+  name?: string | null;
+  email?: string | null;
+}
+
+export function UserProfileHeader({
+  image,
+  name,
+  email,
+}: UserProfileHeaderProps) {
+  return (
+    <View className="w-full items-center gap-2 py-6">
+      <Avatar image={image} name={name} size={88} />
+      <View className="items-center gap-1">
+        <Text className="text-xl font-semibold">{name || "User"}</Text>
+        {email && (
+          <Text className="text-sm text-muted-foreground">{email}</Text>
+        )}
+      </View>
+    </View>
+  );
+}
-- 
cgit v1.2.3-70-g09d2