import React from 'react'; import { ScrollView, StyleSheet, Text } from 'react-native'; import { connect } from 'react-redux'; import { Dispatch } from 'redux'; import { StackNavigationOptions, StackNavigationProp } from '@react-navigation/stack'; import I18n from '../i18n'; import { withTheme } from '../theme'; import Button from '../containers/Button'; import { themes } from '../constants/colors'; import TextInput from '../containers/TextInput'; import SafeAreaView from '../containers/SafeAreaView'; import * as HeaderButton from '../containers/HeaderButton'; import { encryptionDecodeKey as encryptionDecodeKeyAction } from '../actions/encryption'; import scrollPersistTaps from '../utils/scrollPersistTaps'; import KeyboardView from '../presentation/KeyboardView'; import StatusBar from '../containers/StatusBar'; import { events, logEvent } from '../utils/log'; import sharedStyles from './Styles'; import { E2EEnterYourPasswordStackParamList } from '../stacks/types'; const styles = StyleSheet.create({ container: { padding: 28 }, info: { fontSize: 14, marginVertical: 8, ...sharedStyles.textRegular } }); interface IE2EEnterYourPasswordViewState { password: string; } interface IE2EEnterYourPasswordViewProps { encryptionDecodeKey: (password: string) => void; theme: string; navigation: StackNavigationProp; } class E2EEnterYourPasswordView extends React.Component { private passwordInput?: TextInput; static navigationOptions = ({ navigation }: Pick): StackNavigationOptions => ({ headerLeft: () => , title: I18n.t('Enter_Your_E2E_Password') }); constructor(props: IE2EEnterYourPasswordViewProps) { super(props); this.state = { password: '' }; } submit = () => { logEvent(events.E2E_ENTER_PW_SUBMIT); const { password } = this.state; const { encryptionDecodeKey } = this.props; encryptionDecodeKey(password); }; render() { const { password } = this.state; const { theme } = this.props; return ( { this.passwordInput = e; }} placeholder={I18n.t('Password')} returnKeyType='send' secureTextEntry onSubmitEditing={this.submit} onChangeText={value => this.setState({ password: value })} testID='e2e-enter-your-password-view-password' textContentType='password' autoCompleteType='password' theme={theme} />