diff options
| author | Andrej Mihajlov <and@mullvad.net> | 2018-07-03 16:29:17 +0200 |
|---|---|---|
| committer | Andrej Mihajlov <and@mullvad.net> | 2018-07-05 16:01:47 +0200 |
| commit | 42976073ca0af37bbbba026d80a52d1466de42b7 (patch) | |
| tree | 4a2ca1d0d95f36d55abbac8f44191b0b690c4cac | |
| parent | 4b954c5c7e13e7970e7f9dbd8c0dadc0f3236a94 (diff) | |
| download | mullvadvpn-42976073ca0af37bbbba026d80a52d1466de42b7.tar.xz mullvadvpn-42976073ca0af37bbbba026d80a52d1466de42b7.zip | |
Use editable instead of disabled in AccountInput and shallow compare all props
| -rw-r--r-- | app/components/AccountInput.js | 14 | ||||
| -rw-r--r-- | app/components/Login.js | 2 |
2 files changed, 9 insertions, 7 deletions
diff --git a/app/components/AccountInput.js b/app/components/AccountInput.js index 5a8fa47336..cb7cd258c5 100644 --- a/app/components/AccountInput.js +++ b/app/components/AccountInput.js @@ -1,7 +1,7 @@ // @flow import * as React from 'react'; -import { formatAccount } from '../lib/formatters'; import { TextInput } from 'reactxp'; +import { formatAccount } from '../lib/formatters'; import { colors } from '../config'; // @TODO: move it into types.js @@ -66,10 +66,13 @@ export default class AccountInput extends React.Component<AccountInputProps, Acc } shouldComponentUpdate(nextProps: AccountInputProps, nextState: AccountInputState) { + const mergedProps = { ...this.props, ...nextProps }; + const hasPropChanges = Object.keys(mergedProps).some((key) => { + return this.props[key] !== nextProps[key]; + }); + return ( - this.props.value !== nextProps.value || - this.props.onEnter !== nextProps.onEnter || - this.props.onChange !== nextProps.onChange || + hasPropChanges || this.state.value !== nextState.value || this.state.selectionRange[0] !== nextState.selectionRange[0] || this.state.selectionRange[1] !== nextState.selectionRange[1] @@ -78,8 +81,7 @@ export default class AccountInput extends React.Component<AccountInputProps, Acc render() { const displayString = formatAccount(this.state.value || ''); - // eslint-disable-next-line no-unused-vars - const { value, onChange, onEnter, ...otherProps } = this.props; + const { value: _value, onChange: _onChange, onEnter: _onEnter, ...otherProps } = this.props; return ( <TextInput {...otherProps} diff --git a/app/components/Login.js b/app/components/Login.js index e70d84b7aa..355396a77c 100644 --- a/app/components/Login.js +++ b/app/components/Login.js @@ -352,7 +352,7 @@ export default class Login extends Component<Props, State> { onChange={this._onInputChange} onEnter={this._onLogin} value={this.props.accountToken || ''} - disabled={!this._shouldEnableAccountInput()} + editable={this._shouldEnableAccountInput()} autoFocus={true} ref={(ref) => (this._accountInput = ref)} testName="AccountInput" |