fix uri bar text input selection. update react navigation packages.
This commit is contained in:
Akinwale Ariwodola
parent
2d91c83628
commit
b3e20e78cb
5 changed files with 83 additions and 73 deletions
115
package-lock.json
generated
115
package-lock.json
generated
|
|
@ -2073,6 +2073,11 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"@react-native-community/masked-view": {
|
||||
"version": "0.1.5",
|
||||
"resolved": "https://registry.npmjs.org/@react-native-community/masked-view/-/masked-view-0.1.5.tgz",
|
||||
"integrity": "sha512-Lj1DzfCmW0f4HnmHtEuX8Yy2f7cnUA8r5KGGUuDDGtQt1so6QJkKeUmsnLo2zYDtsF8due6hvIL06Vdo5xxuLQ=="
|
||||
},
|
||||
"@react-navigation/core": {
|
||||
"version": "3.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@react-navigation/core/-/core-3.5.1.tgz",
|
||||
|
|
@ -2111,6 +2116,21 @@
|
|||
"requires": {
|
||||
"react-is": "^16.7.0"
|
||||
}
|
||||
},
|
||||
"react-native-safe-area-view": {
|
||||
"version": "0.14.8",
|
||||
"resolved": "https://registry.npmjs.org/react-native-safe-area-view/-/react-native-safe-area-view-0.14.8.tgz",
|
||||
"integrity": "sha512-MtRSIcZNstxv87Jet+UsPhEd1tpGe8cVskDXlP657x6rHpSrbrc+y13ZNXrwAgGNNhqQNX7UJT68ZIq//ZRmvw==",
|
||||
"requires": {
|
||||
"hoist-non-react-statics": "^2.3.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"hoist-non-react-statics": {
|
||||
"version": "2.5.5",
|
||||
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
|
||||
"integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -9890,13 +9910,10 @@
|
|||
"resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-1.4.0.tgz",
|
||||
"integrity": "sha512-tO7nSNNP+iRLVbkcSS5GXyDBb7tSI02+XuRL3/S39EAr35rnvUy2JfeLUQG+fWSObJjnMVhasUDEUwlENk8IXw=="
|
||||
},
|
||||
"react-native-safe-area-view": {
|
||||
"version": "0.14.8",
|
||||
"resolved": "https://registry.npmjs.org/react-native-safe-area-view/-/react-native-safe-area-view-0.14.8.tgz",
|
||||
"integrity": "sha512-MtRSIcZNstxv87Jet+UsPhEd1tpGe8cVskDXlP657x6rHpSrbrc+y13ZNXrwAgGNNhqQNX7UJT68ZIq//ZRmvw==",
|
||||
"requires": {
|
||||
"hoist-non-react-statics": "^2.3.1"
|
||||
}
|
||||
"react-native-safe-area-context": {
|
||||
"version": "0.6.2",
|
||||
"resolved": "https://registry.npmjs.org/react-native-safe-area-context/-/react-native-safe-area-context-0.6.2.tgz",
|
||||
"integrity": "sha512-VtBW0JymVCwVt0TGxTv25Co3wtOv3Yb/K5pAUYkjKXNhWFDz5ZwUG/Yho/p0EkWYlFdroJcSqlvVFl2n3AU7SA=="
|
||||
},
|
||||
"react-native-screens": {
|
||||
"version": "1.0.0-alpha.23",
|
||||
|
|
@ -9928,12 +9945,9 @@
|
|||
}
|
||||
},
|
||||
"react-native-tab-view": {
|
||||
"version": "1.4.1",
|
||||
"resolved": "https://registry.npmjs.org/react-native-tab-view/-/react-native-tab-view-1.4.1.tgz",
|
||||
"integrity": "sha512-Bke8KkDcDhvB/z0AS7MnQKMD2p6Kwfc1rSKlMOvg9CC5CnClQ2QEnhPSbwegKDYhUkBI92iH/BYy7hNSm5kbUQ==",
|
||||
"requires": {
|
||||
"prop-types": "^15.6.1"
|
||||
}
|
||||
"version": "2.11.0",
|
||||
"resolved": "https://registry.npmjs.org/react-native-tab-view/-/react-native-tab-view-2.11.0.tgz",
|
||||
"integrity": "sha512-vqetlxGO7A8bnqvXcB50MWpRZAImXFrDGz1WCQKdCqe03Ey3ZzENe7yLuWrtBJYlepGfOLAsmCXv+wW82Yfm1w=="
|
||||
},
|
||||
"react-native-vector-icons": {
|
||||
"version": "6.6.0",
|
||||
|
|
@ -10097,33 +10111,12 @@
|
|||
}
|
||||
},
|
||||
"react-navigation": {
|
||||
"version": "3.13.0",
|
||||
"resolved": "https://registry.npmjs.org/react-navigation/-/react-navigation-3.13.0.tgz",
|
||||
"integrity": "sha512-r64bTImY2aNye8wtd39ubouVB6ZMJqjVQYKxH4LFmOav4FsI59fQTDN7sZzyJa29owowYw/wVkh+NWGT+tdD1A==",
|
||||
"version": "4.0.10",
|
||||
"resolved": "https://registry.npmjs.org/react-navigation/-/react-navigation-4.0.10.tgz",
|
||||
"integrity": "sha512-7PqvmsdQ7HIyxPUMYbd9Uq//VoMdniEOLAOSvIhb/ExtbAt/1INSjUF+RiMWOMCWLTCNvNPRvTz7xy7qwWureg==",
|
||||
"requires": {
|
||||
"@react-navigation/core": "~3.5.1",
|
||||
"@react-navigation/native": "~3.6.2",
|
||||
"react-navigation-drawer": "~1.4.0",
|
||||
"react-navigation-stack": "1.5.3",
|
||||
"react-navigation-tabs": "~1.2.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"react-navigation-drawer": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/react-navigation-drawer/-/react-navigation-drawer-1.4.0.tgz",
|
||||
"integrity": "sha512-ZyWBozcjB2aZ7vwCALv90cYA2NpDjM+WALaiYRshvPvue8l7cqynePbHK8GhlMGyJDwZqp4MxQmu8u1XAKp3Bw==",
|
||||
"requires": {
|
||||
"react-native-tab-view": "^1.2.0"
|
||||
}
|
||||
},
|
||||
"react-navigation-stack": {
|
||||
"version": "1.5.3",
|
||||
"resolved": "https://registry.npmjs.org/react-navigation-stack/-/react-navigation-stack-1.5.3.tgz",
|
||||
"integrity": "sha512-MQcwDVbZUYsTtDJb5cFOSm+K+e7KpUCoROaGoUOR+JHWE3uuaJ3pd/Nu+32a57J98TNBf4qq0+2TPJWl6z6IBg==",
|
||||
"requires": {
|
||||
"prop-types": "^15.7.2"
|
||||
}
|
||||
}
|
||||
"@react-navigation/core": "^3.5.1",
|
||||
"@react-navigation/native": "^3.6.2"
|
||||
}
|
||||
},
|
||||
"react-navigation-drawer": {
|
||||
|
|
@ -10140,21 +10133,47 @@
|
|||
}
|
||||
},
|
||||
"react-navigation-stack": {
|
||||
"version": "1.8.1",
|
||||
"resolved": "https://registry.npmjs.org/react-navigation-stack/-/react-navigation-stack-1.8.1.tgz",
|
||||
"integrity": "sha512-XOkHuYlQjZKnD4jTU0Ml847sKjpwsJpQ6JX4ZfOq8D0e6fPWXbpYNhvUnzHMHMm+tnbhTqkqP1Umu40Hmx748Q==",
|
||||
"version": "1.10.3",
|
||||
"resolved": "https://registry.npmjs.org/react-navigation-stack/-/react-navigation-stack-1.10.3.tgz",
|
||||
"integrity": "sha512-1gksFi/g/Lg9sBhgLlD0OiEB5xnatHb4C0eNMA5tli9cTVlhq375XNPIqOiTyftibBmjdApAsZFj5srUCoOu/w==",
|
||||
"requires": {
|
||||
"prop-types": "^15.7.2"
|
||||
}
|
||||
},
|
||||
"react-navigation-tabs": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/react-navigation-tabs/-/react-navigation-tabs-1.2.0.tgz",
|
||||
"integrity": "sha512-I6vq3XX4ub9KhWQzcrggznls+2Z2C6w2ro46vokDGGvJ02CBpQRar7J0ETV29Ot5AJY67HucNUmZdH3yDFckmQ==",
|
||||
"version": "2.7.0",
|
||||
"resolved": "https://registry.npmjs.org/react-navigation-tabs/-/react-navigation-tabs-2.7.0.tgz",
|
||||
"integrity": "sha512-fQEHjFrIBi+89loLL521HjGS0Z9tl4Y89SSamRkDl8Of6bPS1Ep++an3ctl2j7c3veqBZBrj3H1qa7qjd3apBQ==",
|
||||
"requires": {
|
||||
"hoist-non-react-statics": "^2.5.0",
|
||||
"prop-types": "^15.6.1",
|
||||
"react-native-tab-view": "^1.4.1"
|
||||
"hoist-non-react-statics": "^3.3.0",
|
||||
"react-lifecycles-compat": "^3.0.4",
|
||||
"react-native-safe-area-view": "^0.14.6",
|
||||
"react-native-tab-view": "^2.11.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"hoist-non-react-statics": {
|
||||
"version": "3.3.1",
|
||||
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz",
|
||||
"integrity": "sha512-wbg3bpgA/ZqWrZuMOeJi8+SKMhr7X9TesL/rXMjTzh0p0JUBo3II8DHboYbuIXWRlttrUFxwcu/5kygrCw8fJw==",
|
||||
"requires": {
|
||||
"react-is": "^16.7.0"
|
||||
}
|
||||
},
|
||||
"react-native-safe-area-view": {
|
||||
"version": "0.14.8",
|
||||
"resolved": "https://registry.npmjs.org/react-native-safe-area-view/-/react-native-safe-area-view-0.14.8.tgz",
|
||||
"integrity": "sha512-MtRSIcZNstxv87Jet+UsPhEd1tpGe8cVskDXlP657x6rHpSrbrc+y13ZNXrwAgGNNhqQNX7UJT68ZIq//ZRmvw==",
|
||||
"requires": {
|
||||
"hoist-non-react-statics": "^2.3.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"hoist-non-react-statics": {
|
||||
"version": "2.5.5",
|
||||
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
|
||||
"integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"react-redux": {
|
||||
|
|
|
|||
|
|
@ -20,6 +20,7 @@
|
|||
"react": "16.9.0",
|
||||
"react-native": "0.61.5",
|
||||
"@react-native-community/async-storage": "^1.5.1",
|
||||
"@react-native-community/masked-view": "^0.1.5",
|
||||
"react-native-camera": "^3.15.0",
|
||||
"react-native-country-picker-modal": "^1.10.0",
|
||||
"react-native-exception-handler": "2.9.0",
|
||||
|
|
@ -30,14 +31,16 @@
|
|||
"react-native-password-strength-meter": "^0.0.2",
|
||||
"react-native-phone-input": "lbryio/react-native-phone-input",
|
||||
"react-native-reanimated": "1.4.0",
|
||||
"react-native-safe-area-context": "^0.6.2",
|
||||
"react-native-snackbar": "2.0.4",
|
||||
"react-native-super-grid": "^3.0.4",
|
||||
"react-native-vector-icons": "^6.6.0",
|
||||
"react-native-video": "lbryio/react-native-video#7992ff945872f9bd00a3736d9ff1318f343abf47",
|
||||
"react-navigation": "^3.13.0",
|
||||
"react-navigation": "^4.0.10",
|
||||
"react-navigation-drawer": "^2.3.3",
|
||||
"react-navigation-redux-helpers": "^3.0.2",
|
||||
"react-navigation-stack": "^1.8.1",
|
||||
"react-navigation-tabs": "^2.7.0",
|
||||
"react-navigation-stack": "^1.10.3",
|
||||
"react-redux": "^5.0.3",
|
||||
"redux": "^4.0.4",
|
||||
"redux-persist": "^6.0.0",
|
||||
|
|
|
|||
|
|
@ -18,8 +18,9 @@ class UriBar extends React.PureComponent {
|
|||
|
||||
keyboardDidHideListener = null;
|
||||
|
||||
changeTextTimeout = -1;
|
||||
|
||||
state = {
|
||||
changeTextTimeout: null,
|
||||
currentValue: null,
|
||||
inputText: null,
|
||||
focused: false,
|
||||
|
|
@ -29,7 +30,6 @@ class UriBar extends React.PureComponent {
|
|||
componentDidMount() {
|
||||
this.keyboardDidShowListener = Keyboard.addListener('keyboardDidShow', this._keyboardDidShow);
|
||||
this.keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', this._keyboardDidHide);
|
||||
this.setSelection();
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
|
|
@ -52,14 +52,14 @@ class UriBar extends React.PureComponent {
|
|||
|
||||
handleChangeText = text => {
|
||||
const newValue = text || '';
|
||||
clearTimeout(this.state.changeTextTimeout);
|
||||
clearTimeout(this.changeTextTimeout);
|
||||
const { updateSearchQuery, onSearchSubmitted, showUriBarSuggestions, navigation } = this.props;
|
||||
|
||||
updateSearchQuery(text);
|
||||
|
||||
let timeout = -1;
|
||||
this.changeTextTimeout = -1;
|
||||
if (!showUriBarSuggestions) {
|
||||
timeout = setTimeout(() => {
|
||||
/* this.changeTextTimeout = setTimeout(() => {
|
||||
if (text.trim().length === 0) {
|
||||
// don't do anything if the text is empty
|
||||
return;
|
||||
|
|
@ -73,9 +73,9 @@ class UriBar extends React.PureComponent {
|
|||
navigation.navigate({ routeName: 'Search', key: 'searchPage', params: { searchQuery: text } });
|
||||
}
|
||||
}
|
||||
}, UriBar.INPUT_TIMEOUT);
|
||||
}, UriBar.INPUT_TIMEOUT); */
|
||||
}
|
||||
this.setState({ inputText: newValue, currentValue: newValue, changeTextTimeout: timeout });
|
||||
this.setState({ inputText: newValue, currentValue: newValue });
|
||||
};
|
||||
|
||||
handleItemPress = item => {
|
||||
|
|
@ -123,12 +123,6 @@ class UriBar extends React.PureComponent {
|
|||
this.setState({ focused: false, keyboardHeight: 0 });
|
||||
};
|
||||
|
||||
setSelection() {
|
||||
if (this.textInput && !this.state.focused) {
|
||||
this.textInput.setNativeProps({ selection: { start: 0, end: 0 } });
|
||||
}
|
||||
}
|
||||
|
||||
handleSubmitEditing = () => {
|
||||
const { navigation, onSearchSubmitted, updateSearchQuery } = this.props;
|
||||
if (this.state.inputText) {
|
||||
|
|
@ -252,11 +246,7 @@ class UriBar extends React.PureComponent {
|
|||
}}
|
||||
autoCorrect={false}
|
||||
style={uriBarStyle.uriText}
|
||||
onLayout={() => {
|
||||
if (!this.state.focused) {
|
||||
this.setSelection();
|
||||
}
|
||||
}}
|
||||
selection={!this.state.focused ? { start: 0, end: 0 } : null}
|
||||
selectTextOnFocus
|
||||
placeholder={__('Search movies, music, and more')}
|
||||
underlineColorAndroid={'transparent'}
|
||||
|
|
@ -267,12 +257,8 @@ class UriBar extends React.PureComponent {
|
|||
inlineImageLeft={'baseline_search_black_24'}
|
||||
inlineImagePadding={16}
|
||||
onFocus={() => this.setState({ focused: true })}
|
||||
onBlur={() => {
|
||||
this.setState({ focused: false });
|
||||
this.setSelection();
|
||||
}}
|
||||
onBlur={() => this.setState({ focused: false })}
|
||||
onChangeText={this.handleChangeText}
|
||||
onChange={this.handleChange}
|
||||
onSubmitEditing={this.handleSubmitEditing}
|
||||
/>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -58,6 +58,7 @@ window.__ = __;
|
|||
|
||||
const globalExceptionHandler = (error, isFatal) => {
|
||||
if (error && NativeModules.Firebase) {
|
||||
console.log(error);
|
||||
NativeModules.Firebase.logException(!!isFatal, error.message ? error.message : 'No message', JSON.stringify(error));
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -31,6 +31,7 @@ const uriBarStyle = StyleSheet.create({
|
|||
paddingRight: 12,
|
||||
fontFamily: 'Inter-UI-Regular',
|
||||
fontSize: 16,
|
||||
height: 44,
|
||||
lineHeight: 18,
|
||||
flex: 17,
|
||||
},
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue