martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-02-14 12:39:17 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

adding delete modal to new settings screen

Browse Source
This commit is contained in:
balzack 2023-08-31 16:35:04 -07:00
parent bcbdfeb963
commit 3768593502
3 changed files with 40 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
app/mobile/src/session/settings/Settings.jsx
View File

@ -1,13 +1,15 @@
import { useState } from 'react'; import { useState } from 'react';
import { Linking, ActivityIndicator, KeyboardAvoidingView, Modal, ScrollView, View, Switch, Text, TextInput, TouchableOpacity, Alert } from 'react-native'; import { Linking, ActivityIndicator, KeyboardAvoidingView, Modal, ScrollView, View, Switch, Text, TextInput, TouchableOpacity, Alert } from 'react-native';
import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context'; import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context';
import { useNavigate } from 'react-router-dom';
import { styles } from './Settings.styled'; import { styles } from './Settings.styled';
import { useSettings } from './useSettings.hook'; import { useSettings } from './useSettings.hook';
import MatIcons from 'react-native-vector-icons/MaterialCommunityIcons'; import MatIcons from 'react-native-vector-icons/MaterialCommunityIcons';
import Colors from 'constants/Colors'; import Colors from 'constants/Colors';
export function Settings() { export function Settings() {
const navigate = useNavigate();
const [ busy, setBusy ] = useState(false); const [ busy, setBusy ] = useState(false);
const { state, actions } = useSettings(); const { state, actions } = useSettings();
@ -77,6 +79,24 @@ export function Settings() {
} }
} }
const deleteAccount = async () => {
if (!busy) {
try {
setBusy(true);
await actions.deleteAccount();
navigate('/');
}
catch (err) {
console.log(err);
Alert.alert(
'Failed to Delete Account',
'Please try again.',
);
}
setBusy(false);
}
}
return ( return (
<ScrollView style={styles.content}> <ScrollView style={styles.content}>
<SafeAreaView edges={['top']}> <SafeAreaView edges={['top']}>
@ -561,20 +581,22 @@ export function Settings() {
<ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} /> <ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} />
<View style={styles.modalInput}> <View style={styles.modalInput}>
<TextInput style={styles.inputText} value={state.sealDelete} onChangeText={actions.setSealDelete} <TextInput style={styles.inputText} value={state.confirm} onChangeText={actions.setConfirm}
autoCapitalize={'none'} placeholder={state.strings.typeDelete} autoCapitalize={'none'} placeholder={state.strings.typeDelete}
placeholderTextColor={Colors.inputPlaceholder} /> placeholderTextColor={Colors.inputPlaceholder} />
</View> </View>
{ state.sealDelete === state.strings.deleteKey && ( <View style={styles.buttons}>
<TouchableOpacity style={styles.dangerButton} activeOpacity={1} onPress={() => sealAction(actions.removeKey, 'Remove')}> { state.confirm === state.strings.deleteKey && (
<Text style={styles.dangerButtonText}>{ state.strings.delete }</Text> <TouchableOpacity style={styles.dangerButton} activeOpacity={1} onPress={deleteAccount}>
</TouchableOpacity> <Text style={styles.dangerButtonText}>{ state.strings.delete }</Text>
)} </TouchableOpacity>
{ state.sealDelete !== state.strings.deleteKey && ( )}
<View style={styles.disabledButton}> { state.confirm !== state.strings.deleteKey && (
<Text style={styles.disabledButtonText}>{ state.strings.delete }</Text> <View style={styles.disabledButton}>
</View> <Text style={styles.disabledButtonText}>{ state.strings.delete }</Text>
)} </View>
)}
</View>
</View> </View>
</View> </View>
</Modal> </Modal>

4
app/mobile/src/session/settings/Settings.styled.js
View File

@ -217,8 +217,8 @@ export const styles = StyleSheet.create({
fontFamily: 'Roboto', fontFamily: 'Roboto',
}, },
dangerButton: { dangerButton: {
marginTop: 32, marginTop: 8,
marginBottom: 16, marginBottom: 8,
paddingTop: 8, paddingTop: 8,
paddingBottom: 8, paddingBottom: 8,
paddingLeft: 32, paddingLeft: 32,

5
app/mobile/src/session/settings/useSettings.hook.js
View File

@ -103,6 +103,9 @@ export function useSettings() {
changeLogin: async () => { changeLogin: async () => {
await account.actions.setLogin(state.username, state.password); await account.actions.setLogin(state.username, state.password);
}, },
deleteAccount: async () => {
await app.actions.remove();
},
setUsername: (username) => { setUsername: (username) => {
clearTimeout(debounce.current); clearTimeout(debounce.current);
checking.current = username; checking.current = username;
@ -130,7 +133,7 @@ export function useSettings() {
await app.actions.logout(); await app.actions.logout();
}, },
showDelete: () => { showDelete: () => {
updateState({ delete: true }); updateState({ delete: true, confirm: null });
}, },
hideDelete: () => { hideDelete: () => {
updateState({ delete: false }); updateState({ delete: false });