88 lines
1.9 KiB
JavaScript
88 lines
1.9 KiB
JavaScript
import React, {useCallback} from 'react';
|
|
import {StyleSheet, View, Text, Button, TextInput} from 'react-native';
|
|
import {KeyboardAwareScrollView} from 'react-native-keyboard-aware-scroll-view';
|
|
import useLogout from '../hooks/useLogout';
|
|
import {useNavigation} from '@react-navigation/native';
|
|
import useSettings from '../hooks/useSettings';
|
|
|
|
const Settings = () => {
|
|
const logOut = useLogout();
|
|
const navigation = useNavigation();
|
|
const [
|
|
isLoaded,
|
|
save,
|
|
awsKeyId,
|
|
setAwsKeyId,
|
|
awsSecretAccessKey,
|
|
setAwsSecretAccessKey,
|
|
] = useSettings();
|
|
|
|
const onLogout = useCallback(() => {
|
|
logOut().then(() => {
|
|
navigation.reset({index: 0, routes: [{name: 'SignIn'}]});
|
|
});
|
|
}, [logOut]);
|
|
|
|
const onSave = useCallback(() => {
|
|
save().then(() => navigation.goBack());
|
|
}, [save, navigation]);
|
|
|
|
if (!isLoaded) {
|
|
return <Text>Loading...</Text>;
|
|
}
|
|
|
|
return (
|
|
<KeyboardAwareScrollView style={styles.root}>
|
|
<Text style={styles.label}>AWS Key ID</Text>
|
|
<TextInput
|
|
style={styles.input}
|
|
value={awsKeyId}
|
|
onChangeText={setAwsKeyId}
|
|
/>
|
|
<Text style={styles.label}>AWS Secret Access Key</Text>
|
|
<TextInput
|
|
style={styles.input}
|
|
value={awsSecretAccessKey}
|
|
onChangeText={setAwsSecretAccessKey}
|
|
/>
|
|
<View style={styles.button}>
|
|
<Button onPress={onSave} title="Save" />
|
|
</View>
|
|
<View style={[styles.button, styles.logout]}>
|
|
<Button onPress={onLogout} title="Sign out" />
|
|
</View>
|
|
</KeyboardAwareScrollView>
|
|
);
|
|
};
|
|
|
|
const styles = StyleSheet.create({
|
|
root: {
|
|
flex: 1,
|
|
backgroundColor: '#FEFEFE',
|
|
padding: 10,
|
|
},
|
|
label: {
|
|
fontSize: 14,
|
|
color: '#333333',
|
|
},
|
|
input: {
|
|
height: 40,
|
|
margin: 12,
|
|
marginBottom: 24,
|
|
borderWidth: 1,
|
|
padding: 10,
|
|
borderRadius: 3,
|
|
backgroundColor: '#DDDDDD',
|
|
color: '#000000',
|
|
},
|
|
button: {
|
|
margin: 12,
|
|
marginBottom: 32,
|
|
},
|
|
logout: {
|
|
marginTop: 64,
|
|
},
|
|
});
|
|
|
|
export default Settings;
|