@ -1,4 +1,4 @@
import React , { Component } from 'react' ; import React , { Component , useEffect , useState } from 'react' ;
import { ScrollView , View , Switch , TouchableOpacity } from 'react-native' ; import { ScrollView , View , Switch , TouchableOpacity } from 'react-native' ;
import { import {
BlueText , BlueText ,
@ -10,116 +10,97 @@ import {
BlueListItem , BlueListItem ,
} from '../../BlueComponents' ; } from '../../BlueComponents' ;
import AsyncStorage from '@react-native-community/async-storage' ; import AsyncStorage from '@react-native-community/async-storage' ;
import PropTypes from 'prop-types' ;
import { AppStorage } from '../../class' ; import { AppStorage } from '../../class' ;
import Biometric from '../../class/biometrics' ; import Biometric from '../../class/biometrics' ;
import { useNavigation } from 'react-navigation-hooks' ;
const BlueApp = require ( '../../BlueApp' ) ; const BlueApp = require ( '../../BlueApp' ) ;
le tloc = require ( '../../loc' ) ; cons tloc = require ( '../../loc' ) ;
export default class Settings extends Component { export const Settings = ( ) => {
static navigationOptions = { const [ isLoading , setIsLoading ] = useState ( true ) ;
... BlueNavigationStyle , const [ showAdvancedOptions , setShowAdvancedOptions ] = useState ( false ) ;
} ; const [ advancedModeEnabled , setAdvancedModeEnabled ] = useState ( false ) ;
const [ biometrics , setBiometrics ] = useState ( { isDeviceBiometricCapable : false , isBiometricsEnabled : false , biometricsType : '' } ) ;
constructor ( props ) { const { navigate } = useNavigation ( ) ;
super ( props ) ;
this . state = {
isLoading : true ,
language : loc . getLanguage ( ) ,
biometrics : { isDeviceBiometricCapable : false , isBiometricsEnabled : false } ,
} ;
}
async componentDidMount ( ) { useEffect ( ( ) => {
const advancedModeEnabled = ! ! ( await AsyncStorage . getItem ( AppStorage . ADVANCED_MODE_ENABLED ) ) ; ( async ( ) => {
const isBiometricsEnabled = await Biometric . isBiometricUseEnabled ( ) ; setAdvancedModeEnabled ( ! ! ( await AsyncStorage . getItem ( AppStorage . ADVANCED_MODE_ENABLED ) ) ) ;
const isDeviceBiometricCapable = await Biometric . isDeviceBiometricCapable ( ) ; const isBiometricsEnabled = await Biometric . isBiometricUseEnabled ( ) ;
const biometricsType = ( await Biometric . biometricType ( ) ) || 'biometrics' ; const isDeviceBiometricCapable = await Biometric . isDeviceBiometricCapable ( ) ;
this . setState ( { const biometricsType = ( await Biometric . biometricType ( ) ) || 'biometrics' ;
isLoading : false , setBiometrics ( { isBiometricsEnabled , isDeviceBiometricCapable , biometricsType } ) ;
advancedModeEnabled , setIsLoading ( false ) ;
biometrics : { isBiometricsEnabled , isDeviceBiometricCapable , biometricsType } , } ) ( ) ;
} ) ; } ) ;
}
asyn conAdvancedModeSwitch ( value ) { const onAdvancedModeSwitch = async value => {
if ( value ) { if ( value ) {
await AsyncStorage . setItem ( AppStorage . ADVANCED_MODE_ENABLED , '1' ) ; await AsyncStorage . setItem ( AppStorage . ADVANCED_MODE_ENABLED , '1' ) ;
} else { } else {
await AsyncStorage . removeItem ( AppStorage . ADVANCED_MODE_ENABLED ) ; await AsyncStorage . removeItem ( AppStorage . ADVANCED_MODE_ENABLED ) ;
} }
this . setState ( { advancedModeEnabled : value } ) ; setAdvancedModeEnabled ( value ) ;
} } ;
onUseBiometricSwitch = async value => { const onUseBiometricSwitch = async value => {
let isBiometricsEnabled = this . state . biometrics ; let isBiometricsEnabled = biometrics ;
if ( await Biometric . unlockWithBiometrics ( ) ) { if ( await Biometric . unlockWithBiometrics ( ) ) {
isBiometricsEnabled . isBiometricsEnabled = value ; isBiometricsEnabled . isBiometricsEnabled = value ;
await Biometric . setBiometricUseEnabled ( value ) ; await Biometric . setBiometricUseEnabled ( value ) ;
this . setState ( { biometrics : isBiometricsEnabled } ) ; setBiometrics ( isBiometricsEnabled ) ;
} }
} ; } ;
render ( ) { const onShowAdvancedOptions = ( ) => {
if ( this . state . isLoading ) { setShowAdvancedOptions ( ! showAdvancedOptions ) ;
return < BlueLoading / > ; } ;
}
return isLoading ? (
< BlueLoading / >
) : (
< SafeBlueArea forceInset = { { horizontal : 'always' } } style = { { flex : 1 } } >
< BlueHeaderDefaultSub leftText = { loc . settings . header } rightComponent = { null } / >
< ScrollView >
{ BlueApp . getWallets ( ) . length > 1 && (
< BlueListItem component = { TouchableOpacity } onPress = { ( ) => navigate ( 'DefaultView' ) } title = "On Launch" / >
) }
< BlueListItem title = { loc . settings . encrypt_storage } onPress = { ( ) => navigate ( 'EncryptStorage' ) } component = { TouchableOpacity } / >
{ biometrics . isDeviceBiometricCapable && (
< BlueListItem
hideChevron
title = { ` Use ${ biometrics . biometricsType } ` }
switchButton
onSwitch = { onUseBiometricSwitch }
switched = { biometrics . isBiometricsEnabled }
/ >
) }
< BlueListItem title = { loc . settings . lightning_settings } component = { TouchableOpacity } onPress = { ( ) => navigate ( 'LightningSettings' ) } / >
< BlueListItem title = { loc . settings . language } component = { TouchableOpacity } onPress = { ( ) => navigate ( 'Language' ) } / >
< BlueListItem title = { loc . settings . currency } component = { TouchableOpacity } onPress = { ( ) => navigate ( 'Currency' ) } / >
< BlueListItem title = { 'Electrum server' } component = { TouchableOpacity } onPress = { ( ) => navigate ( 'ElectrumSettings' ) } / >
< BlueListItem title = { loc . settings . advanced_options } component = { TouchableOpacity } onPress = { onShowAdvancedOptions } / >
{ showAdvancedOptions && (
< BlueCard >
< View style = { { flexDirection : 'row' , alignItems : 'center' , justifyContent : 'space-between' } } >
< BlueText > { loc . settings . enable_advanced_mode } < / B l u e T e x t >
< Switch value = { advancedModeEnabled } onValueChange = { onAdvancedModeSwitch } / >
< / V i e w >
< / B l u e C a r d >
) }
return ( < BlueListItem title = { loc . settings . about } component = { TouchableOpacity } onPress = { ( ) => navigate ( 'About' ) } / >
< SafeBlueArea forceInset = { { horizontal : 'always' } } style = { { flex : 1 } } > < / S c r o l l V i e w >
< BlueHeaderDefaultSub leftText = { loc . settings . header } rightComponent = { null } / > < / S a f e B l u e A r e a >
< ScrollView > ) ;
{ BlueApp . getWallets ( ) . length > 1 && ( } ;
< BlueListItem component = { TouchableOpacity } onPress = { ( ) => this . props . navigation . navigate ( 'DefaultView' ) } title = "On Launch" / >
) } export default class SettingsContainer extends Component {
< TouchableOpacity onPress = { ( ) => this . props . navigation . navigate ( 'EncryptStorage' ) } > static navigationOptions = {
< BlueListItem title = { loc . settings . encrypt_storage } / > ... BlueNavigationStyle ,
< / T o u c h a b l e O p a c i t y > } ;
{ this . state . biometrics . isDeviceBiometricCapable && (
< BlueListItem
hideChevron
title = { ` Use ${ this . state . biometrics . biometricsType } ` }
switchButton
onSwitch = { this . onUseBiometricSwitch }
switched = { this . state . biometrics . isBiometricsEnabled }
/ >
) }
< TouchableOpacity onPress = { ( ) => this . props . navigation . navigate ( 'LightningSettings' ) } >
< BlueListItem title = { loc . settings . lightning_settings } / >
< / T o u c h a b l e O p a c i t y >
< TouchableOpacity onPress = { ( ) => this . props . navigation . navigate ( 'Language' ) } >
< BlueListItem title = { loc . settings . language } / >
< / T o u c h a b l e O p a c i t y >
< TouchableOpacity onPress = { ( ) => this . props . navigation . navigate ( 'Currency' ) } >
< BlueListItem title = { loc . settings . currency } / >
< / T o u c h a b l e O p a c i t y >
< TouchableOpacity onPress = { ( ) => this . props . navigation . navigate ( 'ElectrumSettings' ) } >
< BlueListItem title = { 'Electrum server' } / >
< / T o u c h a b l e O p a c i t y >
< TouchableOpacity onPress = { ( ) => this . setState ( { showAdvancedOptions : ! this . state . showAdvancedOptions } ) } >
< BlueListItem title = { loc . settings . advanced_options } / >
< / T o u c h a b l e O p a c i t y >
{ this . state . showAdvancedOptions && (
< BlueCard >
< View style = { { flexDirection : 'row' , alignItems : 'center' , justifyContent : 'space-between' } } >
< BlueText > { loc . settings . enable_advanced_mode } < / B l u e T e x t >
< Switch value = { this . state . advancedModeEnabled } onValueChange = { value => this . onAdvancedModeSwitch ( value ) } / >
< / V i e w >
< / B l u e C a r d >
) }
< TouchableOpacity onPress = { ( ) => this . props . navigation . navigate ( 'About' ) } > render ( ) {
< BlueListItem title = { loc . settings . about } / > return < Settings / > ;
< / T o u c h a b l e O p a c i t y >
< / S c r o l l V i e w >
< / S a f e B l u e A r e a >
) ;
} }
} }
Settings . propTypes = {
navigation : PropTypes . shape ( {
navigate : PropTypes . func ,
goBack : PropTypes . func ,
} ) ,
} ;
Marcos Rodriguez
5 years ago
Overtorment