Differential D8154 Diff 27619 native/account/registration/keyserver-selection.react.js

Changeset View

Standalone View

native/account/registration/keyserver-selection.react.js

// @flow		// @flow

		import invariant from 'invariant';
import * as React from 'react';		import * as React from 'react';
import { Text } from 'react-native';		import { Text } from 'react-native';

import RegistrationButtonContainer from './registration-button-container.react.js';		import RegistrationButtonContainer from './registration-button-container.react.js';
import RegistrationButton from './registration-button.react.js';		import RegistrationButton from './registration-button.react.js';
import RegistrationContainer from './registration-container.react.js';		import RegistrationContainer from './registration-container.react.js';
import RegistrationContentContainer from './registration-content-container.react.js';		import RegistrationContentContainer from './registration-content-container.react.js';
		import { RegistrationContext } from './registration-context.js';
import type { RegistrationNavigationProp } from './registration-navigator.react.js';		import type { RegistrationNavigationProp } from './registration-navigator.react.js';
import RegistrationTextInput from './registration-text-input.react.js';		import RegistrationTextInput from './registration-text-input.react.js';
import {		import {
RegistrationTile,		RegistrationTile,
RegistrationTileHeader,		RegistrationTileHeader,
} from './registration-tile.react.js';		} from './registration-tile.react.js';
import type { CoolOrNerdMode } from './registration-types.js';		import type { CoolOrNerdMode } from './registration-types.js';
import CommIcon from '../../components/comm-icon.react.js';		import CommIcon from '../../components/comm-icon.react.js';
Show All 10 Lines	+userSelections: {
+coolOrNerdMode: CoolOrNerdMode,		+coolOrNerdMode: CoolOrNerdMode,
},		},
};		};

type Props = {		type Props = {
+navigation: RegistrationNavigationProp<'KeyserverSelection'>,		+navigation: RegistrationNavigationProp<'KeyserverSelection'>,
+route: NavigationRoute<'KeyserverSelection'>,		+route: NavigationRoute<'KeyserverSelection'>,
};		};
// eslint-disable-next-line no-unused-vars
function KeyserverSelection(props: Props): React.Node {		function KeyserverSelection(props: Props): React.Node {
const [customKeyserver, setCustomKeyserver] = React.useState('');		const registrationContext = React.useContext(RegistrationContext);
		invariant(registrationContext, 'registrationContext should be set');
		const { cachedSelections, setCachedSelections } = registrationContext;

		const initialKeyserverUsername = cachedSelections.keyserverUsername;
		const [customKeyserver, setCustomKeyserver] = React.useState(
		initialKeyserverUsername === 'ashoat' ? '' : initialKeyserverUsername,
		);
const customKeyserverTextInputRef = React.useRef();		const customKeyserverTextInputRef = React.useRef();

const [currentSelection, setCurrentSelection] = React.useState<?Selection>();		let initialSelection;
		if (initialKeyserverUsername === 'ashoat') {
		initialSelection = 'ashoat';
		} else if (initialKeyserverUsername) {
		initialSelection = 'custom';
		}

		const [currentSelection, setCurrentSelection] =
		React.useState<?Selection>(initialSelection);
const selectAshoat = React.useCallback(() => {		const selectAshoat = React.useCallback(() => {
setCurrentSelection('ashoat');		setCurrentSelection('ashoat');
customKeyserverTextInputRef.current?.blur();		customKeyserverTextInputRef.current?.blur();
}, []);		}, []);
const customKeyserverEmpty = !customKeyserver;		const customKeyserverEmpty = !customKeyserver;
const selectCustom = React.useCallback(() => {		const selectCustom = React.useCallback(() => {
setCurrentSelection('custom');		setCurrentSelection('custom');
if (customKeyserverEmpty) {		if (customKeyserverEmpty) {
Show All 14 Lines	function KeyserverSelection(props: Props): React.Node {
const buttonState = keyserverUsername ? 'enabled' : 'disabled';		const buttonState = keyserverUsername ? 'enabled' : 'disabled';

const { navigate } = props.navigation;		const { navigate } = props.navigation;
const { coolOrNerdMode } = props.route.params.userSelections;		const { coolOrNerdMode } = props.route.params.userSelections;
const onSubmit = React.useCallback(() => {		const onSubmit = React.useCallback(() => {
if (!keyserverUsername) {		if (!keyserverUsername) {
return;		return;
}		}
		setCachedSelections(oldUserSelections => ({
		...oldUserSelections,
		keyserverUsername,
		}));
navigate<'ConnectEthereum'>({		navigate<'ConnectEthereum'>({
name: ConnectEthereumRouteName,		name: ConnectEthereumRouteName,
params: { userSelections: { coolOrNerdMode, keyserverUsername } },		params: { userSelections: { coolOrNerdMode, keyserverUsername } },
});		});
}, [navigate, coolOrNerdMode, keyserverUsername]);		}, [navigate, coolOrNerdMode, keyserverUsername, setCachedSelections]);

const styles = useStyles(unboundStyles);		const styles = useStyles(unboundStyles);
const colors = useColors();		const colors = useColors();
return (		return (
<RegistrationContainer>		<RegistrationContainer>
<RegistrationContentContainer>		<RegistrationContentContainer>
<Text style={styles.header}>Select a keyserver to join</Text>		<Text style={styles.header}>Select a keyserver to join</Text>
<Text style={styles.body}>		<Text style={styles.body}>
▲ Show 20 Lines • Show All 83 Lines • Show Last 20 Lines