pezkuwichain/pezkuwi-mobile-app
1
0
Fork 0
mirror of https://github.com/pezkuwichain/pezkuwi-mobile-app.git synced 2026-06-13 20:41:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

auto-commit for 5eee8fc1-53e2-4f5b-8aaa-389d4abdae4f

Browse Source
This commit is contained in:
emergent-agent-e1
2025-11-08 21:34:47 +00:00
parent ae34aa7b50
commit d7a512424f
1 changed files with 250 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/screens/SettingsScreen.tsx
+250
View File
@@ -0,0 +1,250 @@
import React from 'react';
import {
View,
Text,
StyleSheet,
ScrollView,
TouchableOpacity,
Switch,
} from 'react-native';
import { Ionicons } from '@expo/vector-icons';
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { useAuth } from '../contexts/AuthContext';
export default function SettingsScreen({ navigation }: any) {
const insets = useSafeAreaInsets();
const { user, signOut } = useAuth();
const [biometricsEnabled, setBiometricsEnabled] = React.useState(false);
const [notificationsEnabled, setNotificationsEnabled] = React.useState(true);
const handleSignOut = async () => {
await signOut();
navigation.replace('Language');
};
const SettingSection = ({ title, children }: any) => (
<View style={styles.section}>
<Text style={styles.sectionTitle}>{title}</Text>
{children}
</View>
);
const SettingItem = ({ icon, title, subtitle, onPress, rightElement }: any) => (
<TouchableOpacity style={styles.settingItem} onPress={onPress} disabled={!onPress}>
<View style={styles.settingItemLeft}>
<View style={styles.iconContainer}>
<Ionicons name={icon} size={20} color="#EE2A35" />
</View>
<View style={styles.settingItemContent}>
<Text style={styles.settingItemTitle}>{title}</Text>
{subtitle && <Text style={styles.settingItemSubtitle}>{subtitle}</Text>}
</View>
</View>
{rightElement || <Ionicons name="chevron-forward" size={20} color="#9CA3AF" />}
</TouchableOpacity>
);
return (
<View style={[styles.container, { paddingTop: insets.top }]}>
{/* Header */}
<View style={styles.header}>
<TouchableOpacity onPress={() => navigation.goBack()} style={styles.backButton}>
<Ionicons name="arrow-back" size={24} color="#1F2937" />
</TouchableOpacity>
<Text style={styles.headerTitle}>Settings</Text>
<View style={{ width: 40 }} />
</View>
<ScrollView contentContainerStyle={styles.scrollContent}>
{/* Profile Section */}
<SettingSection title="Profile">
<SettingItem
icon="person"
title="Edit Profile"
subtitle={user?.email || 'Update your information'}
onPress={() => {}}
/>
<SettingItem
icon="wallet"
title="Wallet Address"
subtitle="5GgTgG9sRm...ioki45"
onPress={() => {}}
/>
</SettingSection>
{/* Security Section */}
<SettingSection title="Security">
<SettingItem
icon="finger-print"
title="Biometric Authentication"
subtitle="Use fingerprint or Face ID"
rightElement={
<Switch
value={biometricsEnabled}
onValueChange={setBiometricsEnabled}
trackColor={{ false: '#E5E7EB', true: '#EE2A3580' }}
thumbColor={biometricsEnabled ? '#EE2A35' : '#F3F4F6'}
/>
}
/>
<SettingItem
icon="key"
title="Change Password"
subtitle="Update your password"
onPress={() => {}}
/>
<SettingItem
icon="shield-checkmark"
title="Two-Factor Authentication"
subtitle="Add extra security"
onPress={() => {}}
/>
</SettingSection>
{/* Preferences Section */}
<SettingSection title="Preferences">
<SettingItem
icon="notifications"
title="Push Notifications"
subtitle="Receive alerts and updates"
rightElement={
<Switch
value={notificationsEnabled}
onValueChange={setNotificationsEnabled}
trackColor={{ false: '#E5E7EB', true: '#EE2A3580' }}
thumbColor={notificationsEnabled ? '#EE2A35' : '#F3F4F6'}
/>
}
/>
<SettingItem
icon="language"
title="Language"
subtitle="English"
onPress={() => {}}
/>
<SettingItem
icon="moon"
title="Dark Mode"
subtitle="Coming soon"
/>
</SettingSection>
{/* About Section */}
<SettingSection title="About">
<SettingItem icon="information-circle" title="Version" subtitle="1.0.0" />
<SettingItem icon="document-text" title="Terms of Service" onPress={() => {}} />
<SettingItem icon="shield" title="Privacy Policy" onPress={() => {}} />
<SettingItem icon="help-circle" title="Help & Support" onPress={() => {}} />
</SettingSection>
{/* Sign Out */}
<TouchableOpacity style={styles.signOutButton} onPress={handleSignOut}>
<Ionicons name="log-out-outline" size={20} color="#EF4444" />
<Text style={styles.signOutText}>Sign Out</Text>
</TouchableOpacity>
</ScrollView>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#F8F9FA',
},
header: {
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'space-between',
paddingHorizontal: 16,
paddingVertical: 16,
backgroundColor: '#FFF',
borderBottomWidth: 1,
borderBottomColor: '#E5E7EB',
},
backButton: {
width: 40,
height: 40,
borderRadius: 20,
backgroundColor: '#F3F4F6',
alignItems: 'center',
justifyContent: 'center',
},
headerTitle: {
fontSize: 18,
fontWeight: '700',
color: '#1F2937',
},
scrollContent: {
padding: 16,
paddingBottom: 80,
},
section: {
marginBottom: 24,
},
sectionTitle: {
fontSize: 14,
fontWeight: '600',
color: '#6B7280',
marginBottom: 12,
paddingHorizontal: 4,
textTransform: 'uppercase',
letterSpacing: 0.5,
},
settingItem: {
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'space-between',
backgroundColor: '#FFF',
padding: 16,
borderRadius: 12,
marginBottom: 8,
shadowColor: '#000',
shadowOffset: { width: 0, height: 1 },
shadowOpacity: 0.05,
shadowRadius: 4,
elevation: 2,
},
settingItemLeft: {
flexDirection: 'row',
alignItems: 'center',
flex: 1,
},
iconContainer: {
width: 40,
height: 40,
borderRadius: 20,
backgroundColor: '#FEE2E2',
alignItems: 'center',
justifyContent: 'center',
marginRight: 12,
},
settingItemContent: {
flex: 1,
},
settingItemTitle: {
fontSize: 16,
fontWeight: '600',
color: '#1F2937',
marginBottom: 2,
},
settingItemSubtitle: {
fontSize: 14,
color: '#6B7280',
},
signOutButton: {
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'center',
backgroundColor: '#FEE2E2',
padding: 16,
borderRadius: 12,
marginTop: 8,
},
signOutText: {
fontSize: 16,
fontWeight: '600',
color: '#EF4444',
marginLeft: 8,
},
});