ysimard/application-amicale
1
0
Fork 0
forked from vergnet/application-amicale
Code Issues Pull requests Releases Wiki Activity

Fixed focusing on search bar not working

Browse source
This commit is contained in:
keplyx 2019-11-15 19:29:25 +01:00
parent fd75675681
commit ab7e8f92fc
3 changed files with 14 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
components/CustomHeader.js
View file

@ -1,7 +1,7 @@
// @flow
import * as React from "react";
import {Body, Header, Input, Item, Left, Right, Title} from "native-base";
import {Body, Header, Input, Item, Left, Right, Title, Form} from "native-base";
import {Platform, StyleSheet, View} from "react-native";
import {getStatusBarHeight} from "react-native-status-bar-height";
import Touchable from 'react-native-platform-touchable';
@ -42,15 +42,16 @@ export default class CustomHeader extends React.Component<Props> {
hasTabs: false,
};
searchBarRef: Input;
componentDidMount() {
if (this.searchBarRef !== undefined && this.props.shouldFocusSearchBar)
this.searchBarRef.focus();
if (this.refs.searchInput !== undefined && this.props.shouldFocusSearchBar) {
// does not work if called to early for some reason...
setInterval(() => this.refs.searchInput._root.focus(), 500);
}
}
getSearchBar() {
return (
<Form>
<Item
style={{
width: '100%',
@ -60,11 +61,12 @@ export default class CustomHeader extends React.Component<Props> {
icon={'magnify'}
color={ThemeManager.getCurrentThemeVariables().toolbarBtnColor}/>
<Input
ref={(ref) => this.searchBarRef = ref}
ref="searchInput"
placeholder={i18n.t('proximoScreen.search')}
placeholderTextColor={ThemeManager.getCurrentThemeVariables().toolbarPlaceholderColor}
onChangeText={(text) => this.props.searchCallback(text)}/>
</Item>
</Form>
);
}

5
screens/Proximo/ProximoListScreen.js
View file

@ -45,7 +45,6 @@ type Props = {
}
type State = {
navData: Array<Object>,
currentSortMode: string,
isSortReversed: boolean,
sortPriceIcon: React.Node,
@ -62,13 +61,12 @@ export default class ProximoListScreen extends React.Component<Props, State> {
modalRef: { current: null | Modalize };
originalData: Array<Object>;
navData = this.props.navigation.getParam('data', []);
shouldFocusSearchBar = this.navData['shouldFocusSearchBar'];
shouldFocusSearchBar = this.props.navigation.getParam('shouldFocusSearchBar', false);
constructor(props: any) {
super(props);
this.modalRef = React.createRef();
this.originalData = this.navData['data'];
}
state = {
@ -300,7 +298,6 @@ export default class ProximoListScreen extends React.Component<Props, State> {
render() {
const nav = this.props.navigation;
const navType = nav.getParam('type', '{name: "Error"}');
return (
<Container>
<Modalize ref={this.modalRef}

9
screens/Proximo/ProximoMainScreen.js
View file

@ -38,7 +38,7 @@ export default class ProximoMainScreen extends FetchedDataSectionList {
return [
{
title: '',
data: ProximoMainScreen.generateData(fetchedData),
data: this.generateData(fetchedData),
extraData: super.state,
keyExtractor: this.getKeyExtractor
}
@ -52,7 +52,7 @@ export default class ProximoMainScreen extends FetchedDataSectionList {
* @param fetchedData The array of articles represented by objects
* @returns {Array} The formatted dataset
*/
static generateData(fetchedData: Object) {
generateData(fetchedData: Object) {
let finalData = [];
if (fetchedData.types !== undefined && fetchedData.articles !== undefined) {
let types = fetchedData.types;
@ -84,7 +84,7 @@ export default class ProximoMainScreen extends FetchedDataSectionList {
* @param type The type of articles to find (undefined for any type)
* @return {Array} The array of available articles
*/
static getAvailableArticles(articles: Array<Object>, type: ?Object) {
getAvailableArticles(articles: Array<Object>, type: ?Object) {
let availableArticles = [];
for (let k = 0; k < articles.length; k++) {
if ((type !== undefined && type !== null && articles[k]['type'].includes(type['id'])
@ -109,7 +109,8 @@ export default class ProximoMainScreen extends FetchedDataSectionList {
name: i18n.t('proximoScreen.all'),
icon: 'star'
},
data: this.getAvailableArticles(this.state.fetchedData.articles, undefined)
data: this.state.fetchedData.articles !== undefined ?
this.getAvailableArticles(this.state.fetchedData.articles, undefined) : []
},
};