From a9225280a93121c1d56fb68ed9365c61f93fa3aa Mon Sep 17 00:00:00 2001 From: abhishek71994 <abhishek71994@gmail.com> Date: Fri, 30 Mar 2018 10:53:57 +0530 Subject: [PATCH] password show/hide feature --- app/views/LoginView.js | 29 +++---- app/views/Styles.js | 10 +++ package-lock.json | 172 +++++++++-------------------------------- 3 files changed, 64 insertions(+), 147 deletions(-) diff --git a/app/views/LoginView.js b/app/views/LoginView.js index d1647cfff..6aa06772c 100644 --- a/app/views/LoginView.js +++ b/app/views/LoginView.js @@ -65,6 +65,7 @@ export default class LoginView extends React.Component { username: '', password: '', modalVisible: false, + showPassword: false, oAuthUrl: '' }; this.redirectRegex = new RegExp(`(?=.*(${ this.props.server }))(?=.*(credentialToken))(?=.*(credentialSecret))`, 'g'); @@ -238,19 +239,21 @@ export default class LoginView extends React.Component { onSubmitEditing={() => { this.password.focus(); }} placeholder={this.props.Accounts_EmailOrUsernamePlaceholder || 'Email or username'} /> - <TextInput - ref={(e) => { this.password = e; }} - style={styles.input_white} - onChangeText={password => this.setState({ password })} - secureTextEntry - autoCorrect={false} - returnKeyType='done' - autoCapitalize='none' - underlineColorAndroid='transparent' - onSubmitEditing={this.submit} - placeholder={this.props.Accounts_PasswordPlaceholder || 'Password'} - /> - + <View style={styles.passInput}> + <TextInput + ref={(e) => { this.password = e; }} + style={styles.input_white} + onChangeText={password => this.setState({ password })} + secureTextEntry={!this.state.showPassword} + autoCorrect={false} + returnKeyType='done' + autoCapitalize='none' + underlineColorAndroid='transparent' + onSubmitEditing={this.submit} + placeholder={this.props.Accounts_PasswordPlaceholder || 'Password'} + /> + <Icon name='eye' style={styles.passIcon} size={20} onPress={() => { this.setState({ showPassword: !this.state.showPassword }); }}/> + </View> {this.renderTOTP()} <TouchableOpacity diff --git a/app/views/Styles.js b/app/views/Styles.js index 63c17bac6..f3b1c026d 100644 --- a/app/views/Styles.js +++ b/app/views/Styles.js @@ -32,6 +32,16 @@ export default StyleSheet.create({ justifyContent: 'center', flex: 1 }, + passInput: { + flex: 1, + position: 'relative' + }, + passIcon: { + position: 'absolute', + right: 0, + padding: 10, + color: 'rgba(0,0,0,.45)' + }, loginLogo: { width: Dimensions.get('window').width - 150, height: Dimensions.get('window').width - 150, diff --git a/package-lock.json b/package-lock.json index 20ddb63e9..41a84841d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3884,11 +3884,6 @@ "integrity": "sha1-AMYIq33Nk4l8AAllGx06jh5zu9E=", "dev": true }, - "component-emitter": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.0.tgz", - "integrity": "sha1-zNETqGOI0GSC0D3j/H35hSa6jv4=" - }, "component-inherit": { "version": "0.0.3", "resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz", @@ -7004,11 +6999,6 @@ "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz", "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U=" }, - "get-params": { - "version": "0.1.2", - "resolved": "https://registry.npmjs.org/get-params/-/get-params-0.1.2.tgz", - "integrity": "sha1-uuDfq6WIoMYNeDTA2Nwv9g7u8v4=" - }, "get-stream": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz", @@ -9841,11 +9831,6 @@ "esprima": "2.7.3" } }, - "jsan": { - "version": "3.1.9", - "resolved": "https://registry.npmjs.org/jsan/-/jsan-3.1.9.tgz", - "integrity": "sha1-JwVnbBBY8KfZrCZq0Daldpz6fJY=" - }, "jsbn": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz", @@ -10074,11 +10059,6 @@ "type-check": "0.3.2" } }, - "linked-list": { - "version": "0.1.0", - "resolved": "https://registry.npmjs.org/linked-list/-/linked-list-0.1.0.tgz", - "integrity": "sha1-eYsP+X0bkqT9CEgPVa6k6dSdN78=" - }, "load-json-file": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz", @@ -13674,14 +13654,14 @@ } }, "react-native-keyboard-input": { - "version": "git+https://github.com/RocketChat/react-native-keyboard-input.git#38273b0513f69a5e6e0719f65a675f9f2b5ee883", + "version": "git+https://github.com/RocketChat/react-native-keyboard-input.git#5bc63ae8b80a4ca5a3714a81dd058ee6bbe00a30", "requires": { "lodash": "4.17.5", - "react-native-keyboard-tracking-view": "git+https://github.com/RocketChat/react-native-keyboard-tracking-view.git#3a4084f0a1063e23ae6435facdf1f79152558d15" + "react-native-keyboard-tracking-view": "git+https://github.com/RocketChat/react-native-keyboard-tracking-view.git#151979f82a5aba8755993e7001ba608c135de6b7" } }, "react-native-keyboard-tracking-view": { - "version": "git+https://github.com/RocketChat/react-native-keyboard-tracking-view.git#3a4084f0a1063e23ae6435facdf1f79152558d15" + "version": "git+https://github.com/RocketChat/react-native-keyboard-tracking-view.git#151979f82a5aba8755993e7001ba608c135de6b7" }, "react-native-loading-spinner-overlay": { "version": "0.5.2", @@ -14037,6 +14017,39 @@ "socket.io-client": "1.7.4" } }, + "reactotron-redux": { + "version": "1.13.0", + "resolved": "https://registry.npmjs.org/reactotron-redux/-/reactotron-redux-1.13.0.tgz", + "integrity": "sha512-8imh/blSwBrYdp+1NXR1UNtAQM4Q5DuEd/olWjYafDJOej469+SnimJvTtsriIrFk+drPa1Ny8VeGLQihAj1Sg==", + "dev": true, + "requires": { + "ramda": "0.24.1", + "ramdasauce": "2.1.0", + "reactotron-core-client": "1.13.0", + "redux": "3.7.2" + } + }, + "reactotron-redux-saga": { + "version": "1.13.0", + "resolved": "https://registry.npmjs.org/reactotron-redux-saga/-/reactotron-redux-saga-1.13.0.tgz", + "integrity": "sha512-d+Md68OQhBGTi4LRviPKBSOrPQ5Zl4lQhje8ENn3OP8kp1E+Jw6wKYKb3ywPOnA05F0SroSL6OJIYFtDlb02zA==", + "dev": true, + "requires": { + "ramda": "0.24.1", + "ramdasauce": "2.1.0", + "reactotron-core-client": "1.13.0", + "redux": "3.7.2", + "redux-saga": "0.15.6" + }, + "dependencies": { + "redux-saga": { + "version": "0.15.6", + "resolved": "https://registry.npmjs.org/redux-saga/-/redux-saga-0.15.6.tgz", + "integrity": "sha1-hjjcUi3mxsCklv6LK1RmKHrC3E0=", + "dev": true + } + } + }, "read-all-stream": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/read-all-stream/-/read-all-stream-3.1.0.tgz", @@ -14283,15 +14296,6 @@ "symbol-observable": "1.0.4" } }, - "redux-devtools-instrument": { - "version": "1.8.2", - "resolved": "https://registry.npmjs.org/redux-devtools-instrument/-/redux-devtools-instrument-1.8.2.tgz", - "integrity": "sha1-XpHP5ALnkNrj/S8NI197fYSwn/4=", - "requires": { - "lodash": "4.17.5", - "symbol-observable": "1.0.4" - } - }, "redux-enhancer-react-native-appstate": { "version": "0.3.0", "resolved": "https://registry.npmjs.org/redux-enhancer-react-native-appstate/-/redux-enhancer-react-native-appstate-0.3.0.tgz", @@ -14399,39 +14403,6 @@ "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz", "integrity": "sha1-VNvzd+UUQKypCkzSdGANP/LYiKk=" }, - "remote-redux-devtools": { - "version": "0.5.12", - "resolved": "https://registry.npmjs.org/remote-redux-devtools/-/remote-redux-devtools-0.5.12.tgz", - "integrity": "sha1-QsuV36nlTB2WcTF8Xnu6QeaMrsI=", - "requires": { - "jsan": "3.1.9", - "querystring": "0.2.0", - "redux-devtools-instrument": "1.8.2", - "remotedev-utils": "0.1.4", - "rn-host-detect": "1.1.3", - "socketcluster-client": "5.5.2" - } - }, - "remotedev-serialize": { - "version": "0.1.0", - "resolved": "https://registry.npmjs.org/remotedev-serialize/-/remotedev-serialize-0.1.0.tgz", - "integrity": "sha1-B0do6Yy3qoBvRZlO6wyK+VEg7jI=", - "requires": { - "jsan": "3.1.9" - } - }, - "remotedev-utils": { - "version": "0.1.4", - "resolved": "https://registry.npmjs.org/remotedev-utils/-/remotedev-utils-0.1.4.tgz", - "integrity": "sha1-ZDcAgZqUNngHPHXrGF6B2WYgs0g=", - "requires": { - "get-params": "0.1.2", - "jsan": "3.1.9", - "lodash": "4.17.5", - "remotedev-serialize": "0.1.0", - "shortid": "2.2.8" - } - }, "remove-trailing-separator": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz", @@ -14641,7 +14612,8 @@ "rn-host-detect": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/rn-host-detect/-/rn-host-detect-1.1.3.tgz", - "integrity": "sha1-JC124vpIXEjXUUFuZbfM5ZaWnpE=" + "integrity": "sha1-JC124vpIXEjXUUFuZbfM5ZaWnpE=", + "dev": true }, "run-async": { "version": "2.3.0", @@ -14702,32 +14674,6 @@ "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz", "integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==" }, - "sc-channel": { - "version": "1.0.6", - "resolved": "https://registry.npmjs.org/sc-channel/-/sc-channel-1.0.6.tgz", - "integrity": "sha1-s4vUepk+eCkPvFNGeGf2sqCghjk=", - "requires": { - "sc-emitter": "1.1.0" - } - }, - "sc-emitter": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/sc-emitter/-/sc-emitter-1.1.0.tgz", - "integrity": "sha1-7xGdQiL0xk+Ie0hpZO8REWzdDnU=", - "requires": { - "component-emitter": "1.2.0" - } - }, - "sc-errors": { - "version": "1.3.3", - "resolved": "https://registry.npmjs.org/sc-errors/-/sc-errors-1.3.3.tgz", - "integrity": "sha1-wAvEx2apcMyNWTfQjNWOkx19rgU=" - }, - "sc-formatter": { - "version": "3.0.1", - "resolved": "https://registry.npmjs.org/sc-formatter/-/sc-formatter-3.0.1.tgz", - "integrity": "sha512-Jl2bH8zUtKn70JJIIPTEfWGDXK+TB9wV55C/zwSoDum4T1X1bsIBudO1QkxOG2RZMgkcKexfGQLlDCH37c/4fg==" - }, "schema-utils": { "version": "0.3.0", "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.3.0.tgz", @@ -14910,11 +14856,6 @@ "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.1.tgz", "integrity": "sha512-vFwSUfQvqybiICwZY5+DAWIPLKsWO31Q91JSKl3UYv+K5c2QRPzn0qzec6QPu1Qc9eHYItiP3NdJqNVqetYAww==" }, - "shortid": { - "version": "2.2.8", - "resolved": "https://registry.npmjs.org/shortid/-/shortid-2.2.8.tgz", - "integrity": "sha1-AzsRfWoul1gE9vCWnb59PQs1UTE=" - }, "signal-exit": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz", @@ -15385,43 +15326,6 @@ } } }, - "socketcluster-client": { - "version": "5.5.2", - "resolved": "https://registry.npmjs.org/socketcluster-client/-/socketcluster-client-5.5.2.tgz", - "integrity": "sha1-nUNp4Oci/35V5UIsLUT1r+Gv8Sg=", - "requires": { - "base-64": "0.1.0", - "clone": "2.1.1", - "linked-list": "0.1.0", - "querystring": "0.2.0", - "sc-channel": "1.0.6", - "sc-emitter": "1.1.0", - "sc-errors": "1.3.3", - "sc-formatter": "3.0.1", - "ws": "3.0.0" - }, - "dependencies": { - "clone": { - "version": "2.1.1", - "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.1.tgz", - "integrity": "sha1-0hfR6WERjjrJpLi7oyhVU79kfNs=" - }, - "safe-buffer": { - "version": "5.0.1", - "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz", - "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c=" - }, - "ws": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/ws/-/ws-3.0.0.tgz", - "integrity": "sha1-mN2wAFbIOQy3Ued4h4hJf5kQO2w=", - "requires": { - "safe-buffer": "5.0.1", - "ultron": "1.1.0" - } - } - } - }, "sort-keys": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-1.1.2.tgz", -- GitLab