martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-02-11 19:19:16 +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 { Linking, ActivityIndicator, KeyboardAvoidingView, Modal, ScrollView, View, Switch, Text, TextInput, TouchableOpacity, Alert } from 'react-native';
import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context';
import { useNavigate } from 'react-router-dom';
import { styles } from './Settings.styled';
import { useSettings } from './useSettings.hook';
import MatIcons from 'react-native-vector-icons/MaterialCommunityIcons';
import Colors from 'constants/Colors';
export function Settings() {
const navigate = useNavigate();
const [ busy, setBusy ] = useState(false);
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 (
<ScrollView style={styles.content}>
<SafeAreaView edges={['top']}>
@ -561,20 +581,22 @@ export function Settings() {
<ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} />
<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}
placeholderTextColor={Colors.inputPlaceholder} />
</View>
{ state.sealDelete === state.strings.deleteKey && (
<TouchableOpacity style={styles.dangerButton} activeOpacity={1} onPress={() => sealAction(actions.removeKey, 'Remove')}>
<Text style={styles.dangerButtonText}>{ state.strings.delete }</Text>
</TouchableOpacity>
)}
{ state.sealDelete !== state.strings.deleteKey && (
<View style={styles.disabledButton}>
<Text style={styles.disabledButtonText}>{ state.strings.delete }</Text>
</View>
)}
<View style={styles.buttons}>
{ state.confirm === state.strings.deleteKey && (
<TouchableOpacity style={styles.dangerButton} activeOpacity={1} onPress={deleteAccount}>
<Text style={styles.dangerButtonText}>{ state.strings.delete }</Text>
</TouchableOpacity>
)}
{ state.confirm !== state.strings.deleteKey && (
<View style={styles.disabledButton}>
<Text style={styles.disabledButtonText}>{ state.strings.delete }</Text>
</View>
)}
</View>
</View>
</View>
</Modal>

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

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

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

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