diff options
Diffstat (limited to 'src/components/ui/Input.js')
-rw-r--r-- | src/components/ui/Input.js | 25 |
1 files changed, 12 insertions, 13 deletions
diff --git a/src/components/ui/Input.js b/src/components/ui/Input.js index 7417fef1c..335367f03 100644 --- a/src/components/ui/Input.js +++ b/src/components/ui/Input.js | |||
@@ -3,18 +3,17 @@ import PropTypes from 'prop-types'; | |||
3 | import { observer } from 'mobx-react'; | 3 | import { observer } from 'mobx-react'; |
4 | import { Field } from 'mobx-react-form'; | 4 | import { Field } from 'mobx-react-form'; |
5 | import classnames from 'classnames'; | 5 | import classnames from 'classnames'; |
6 | import { defineMessages, intlShape } from 'react-intl'; | 6 | import { defineMessages, injectIntl } from 'react-intl'; |
7 | 7 | ||
8 | import { scorePassword as scorePasswordFunc } from '../../helpers/password-helpers'; | 8 | import { scorePassword as scorePasswordFunc } from '../../helpers/password-helpers'; |
9 | 9 | ||
10 | const messages = defineMessages({ | 10 | const messages = defineMessages({ |
11 | passwordToggle: { | 11 | passwordToggle: { |
12 | id: 'settings.app.form.passwordToggle', | 12 | id: 'settings.app.form.passwordToggle', |
13 | defaultMessage: '!!!Password toggle', | 13 | defaultMessage: 'Password toggle', |
14 | }, | 14 | }, |
15 | }); | 15 | }); |
16 | 16 | ||
17 | export default | ||
18 | @observer | 17 | @observer |
19 | class Input extends Component { | 18 | class Input extends Component { |
20 | static propTypes = { | 19 | static propTypes = { |
@@ -38,10 +37,6 @@ class Input extends Component { | |||
38 | suffix: '', | 37 | suffix: '', |
39 | }; | 38 | }; |
40 | 39 | ||
41 | static contextTypes = { | ||
42 | intl: intlShape, | ||
43 | }; | ||
44 | |||
45 | state = { | 40 | state = { |
46 | showPassword: false, | 41 | showPassword: false, |
47 | passwordScore: 0, | 42 | passwordScore: 0, |
@@ -82,7 +77,7 @@ class Input extends Component { | |||
82 | 77 | ||
83 | const { passwordScore } = this.state; | 78 | const { passwordScore } = this.state; |
84 | 79 | ||
85 | const { intl } = this.context; | 80 | const { intl } = this.props; |
86 | 81 | ||
87 | let { type } = field; | 82 | let { type } = field; |
88 | if (type === 'password' && this.state.showPassword) { | 83 | if (type === 'password' && this.state.showPassword) { |
@@ -106,10 +101,10 @@ class Input extends Component { | |||
106 | name={field.name} | 101 | name={field.name} |
107 | value={field.value} | 102 | value={field.value} |
108 | placeholder={field.placeholder} | 103 | placeholder={field.placeholder} |
109 | onChange={(e) => this.onChange(e)} | 104 | onChange={e => this.onChange(e)} |
110 | onBlur={field.onBlur} | 105 | onBlur={field.onBlur} |
111 | onFocus={field.onFocus} | 106 | onFocus={field.onFocus} |
112 | ref={(element) => { | 107 | ref={element => { |
113 | this.inputElement = element; | 108 | this.inputElement = element; |
114 | }} | 109 | }} |
115 | disabled={field.disabled} | 110 | disabled={field.disabled} |
@@ -124,9 +119,11 @@ class Input extends Component { | |||
124 | 'mdi-eye': !this.state.showPassword, | 119 | 'mdi-eye': !this.state.showPassword, |
125 | 'mdi-eye-off': this.state.showPassword, | 120 | 'mdi-eye-off': this.state.showPassword, |
126 | })} | 121 | })} |
127 | onClick={() => this.setState((prevState) => ({ | 122 | onClick={() => |
128 | showPassword: !prevState.showPassword, | 123 | this.setState(prevState => ({ |
129 | }))} | 124 | showPassword: !prevState.showPassword, |
125 | })) | ||
126 | } | ||
130 | tabIndex={-1} | 127 | tabIndex={-1} |
131 | aria-label={intl.formatMessage(messages.passwordToggle)} | 128 | aria-label={intl.formatMessage(messages.passwordToggle)} |
132 | /> | 129 | /> |
@@ -154,3 +151,5 @@ class Input extends Component { | |||
154 | ); | 151 | ); |
155 | } | 152 | } |
156 | } | 153 | } |
154 | |||
155 | export default injectIntl(Input); | ||