diff --git a/native/account/registration/keyserver-selection.react.js b/native/account/registration/keyserver-selection.react.js --- a/native/account/registration/keyserver-selection.react.js +++ b/native/account/registration/keyserver-selection.react.js @@ -41,6 +41,13 @@ setCurrentSelection('custom'); }, []); + let buttonState = 'disabled'; + if ( + currentSelection === 'ashoat' || + (currentSelection === 'custom' && customKeyserver) + ) { + buttonState = 'enabled'; + } const onSubmit = React.useCallback(() => {}, []); const styles = useStyles(unboundStyles); @@ -93,7 +100,7 @@ /> - + ); } diff --git a/native/account/registration/registration-button.react.js b/native/account/registration/registration-button.react.js --- a/native/account/registration/registration-button.react.js +++ b/native/account/registration/registration-button.react.js @@ -9,13 +9,34 @@ type Props = { +onPress: () => mixed, +label: string, + +state?: 'enabled' | 'disabled' | 'loading', }; function RegistrationButton(props: Props): React.Node { - const { onPress, label } = props; + const { onPress, label, state } = props; + const styles = useStyles(unboundStyles); + const buttonStyle = React.useMemo(() => { + if (state === 'disabled' || state === 'loading') { + return [styles.button, styles.disabledButton]; + } else { + return styles.button; + } + }, [state, styles.button, styles.disabledButton]); + const buttonTextStyle = React.useMemo(() => { + if (state === 'disabled') { + return [styles.buttonText, styles.disabledButtonText]; + } + return styles.buttonText; + }, [state, styles.buttonText, styles.disabledButtonText]); + return ( - ); } @@ -32,6 +53,12 @@ textAlign: 'center', padding: 12, }, + disabledButton: { + backgroundColor: 'disabledButton', + }, + disabledButtonText: { + color: 'disabledButtonText', + }, }; export default RegistrationButton; diff --git a/native/themes/colors.js b/native/themes/colors.js --- a/native/themes/colors.js +++ b/native/themes/colors.js @@ -15,6 +15,7 @@ blockQuoteBorder: '#CCCCCC', codeBackground: '#E0E0E0', disabledButton: '#E0E0E0', + disabledButtonText: '#808080', disconnectedBarBackground: '#F5F5F5', editButton: '#A4A4A2', floatingButtonBackground: '#999999', @@ -102,6 +103,7 @@ blockQuoteBorder: '#808080', codeBackground: '#0A0A0A', disabledButton: '#404040', + disabledButtonText: '#808080', disconnectedBarBackground: '#1F1F1F', editButton: '#666666', floatingButtonBackground: '#666666',