58 lines
2.1 KiB
TypeScript
58 lines
2.1 KiB
TypeScript
import { View, Text, TouchableOpacity, Alert, ScrollView } from 'react-native';
|
|
import { useAuthStore } from '../../stores/authStore';
|
|
import { router } from 'expo-router';
|
|
|
|
export default function ProfileScreen() {
|
|
const { user, logout, tenantSlug } = useAuthStore();
|
|
|
|
const handleLogout = () => {
|
|
Alert.alert('Sign Out', 'Are you sure you want to sign out?', [
|
|
{ text: 'Cancel', style: 'cancel' },
|
|
{
|
|
text: 'Sign Out', style: 'destructive',
|
|
onPress: async () => {
|
|
await logout();
|
|
router.replace('/(auth)/company-code');
|
|
}
|
|
}
|
|
]);
|
|
};
|
|
|
|
return (
|
|
<ScrollView className="flex-1 bg-gray-50">
|
|
<View className="px-4 pt-14 pb-6 bg-primary">
|
|
<View className="w-16 h-16 rounded-full bg-white/20 items-center justify-center mb-3">
|
|
<Text className="text-white text-2xl font-bold">
|
|
{user?.firstName?.[0]?.toUpperCase() ?? 'U'}
|
|
</Text>
|
|
</View>
|
|
<Text className="text-white text-xl font-bold">{user?.firstName} {user?.lastName}</Text>
|
|
<Text className="text-white/70 text-sm">{user?.role} · {tenantSlug}</Text>
|
|
</View>
|
|
|
|
<View className="px-4 py-6">
|
|
<View className="bg-white rounded-2xl border border-gray-100 mb-4">
|
|
{[
|
|
{ label: 'Username', value: user?.username },
|
|
{ label: 'Email', value: user?.email },
|
|
{ label: 'Role', value: user?.role },
|
|
{ label: 'Company', value: tenantSlug },
|
|
].map((item, i) => (
|
|
<View key={item.label} className={`px-4 py-3 ${i > 0 ? 'border-t border-gray-100' : ''}`}>
|
|
<Text className="text-gray-500 text-xs mb-0.5">{item.label}</Text>
|
|
<Text className="text-gray-900 font-medium">{item.value ?? '—'}</Text>
|
|
</View>
|
|
))}
|
|
</View>
|
|
|
|
<TouchableOpacity
|
|
className="bg-red-50 border border-red-200 rounded-2xl py-4 items-center"
|
|
onPress={handleLogout}
|
|
>
|
|
<Text className="text-red-600 font-semibold">Sign Out</Text>
|
|
</TouchableOpacity>
|
|
</View>
|
|
</ScrollView>
|
|
);
|
|
}
|