diff --git a/navigation/AppNavigator.js b/navigation/AppNavigator.js index b8072aa..f9fb664 100644 --- a/navigation/AppNavigator.js +++ b/navigation/AppNavigator.js @@ -5,7 +5,6 @@ import {createMaterialBottomTabNavigatorWithInitialRoute} from './MainTabNavigat import SettingsScreen from '../screens/SettingsScreen'; import AboutScreen from '../screens/About/AboutScreen'; import ProximoListScreen from '../screens/Proximo/ProximoListScreen'; -import ProximoSearchScreen from "../screens/Proximo/ProximoSearchScreen"; import AboutDependenciesScreen from '../screens/About/AboutDependenciesScreen'; import ProxiwashAboutScreen from '../screens/Proxiwash/ProxiwashAboutScreen'; import ProximoAboutScreen from '../screens/Proximo/ProximoAboutScreen'; @@ -27,7 +26,6 @@ function createAppContainerWithInitialRoute(initialRoute: string) { Main: createMaterialBottomTabNavigatorWithInitialRoute(initialRoute), // Drawer: MainDrawerNavigator, ProximoListScreen: {screen: ProximoListScreen}, - ProximoSearchScreen: {screen: ProximoSearchScreen}, SettingsScreen: {screen: SettingsScreen}, AboutScreen: {screen: AboutScreen}, AboutDependenciesScreen: {screen: AboutDependenciesScreen}, @@ -44,7 +42,7 @@ function createAppContainerWithInitialRoute(initialRoute: string) { initialRouteName: "Main", mode: 'card', headerMode: "none", - // transitionConfig: () => fromRight(), + transitionConfig: () => fromRight(), }) ); } diff --git a/screens/Proximo/ProximoListScreen.js b/screens/Proximo/ProximoListScreen.js index 8e367c2..3280582 100644 --- a/screens/Proximo/ProximoListScreen.js +++ b/screens/Proximo/ProximoListScreen.js @@ -51,6 +51,7 @@ type State = { sortPriceIcon: React.Node, sortNameIcon: React.Node, modalCurrentDisplayItem: Object, + currentlyDisplayedData: Array, }; /** @@ -59,19 +60,21 @@ type State = { export default class ProximoListScreen extends React.Component { modalRef: { current: null | Modalize }; + originalData: Array; constructor(props: any) { super(props); this.modalRef = React.createRef(); + this.originalData = this.props.navigation.getParam('data', []); } state = { - navData: this.props.navigation.getParam('data', []).sort(sortPrice), + currentlyDisplayedData: this.props.navigation.getParam('data', []).sort(sortPrice), currentSortMode: sortMode.price, isSortReversed: false, sortPriceIcon: '', sortNameIcon: '', - modalCurrentDisplayItem: {} + modalCurrentDisplayItem: {}, }; _menu: Menu; @@ -111,7 +114,7 @@ export default class ProximoListScreen extends React.Component { currentSortMode: mode, isSortReversed: isReverse }); - let data = this.state.navData; + let data = this.state.currentlyDisplayedData; switch (mode) { case sortMode.price: if (isReverse) { @@ -192,6 +195,35 @@ export default class ProximoListScreen extends React.Component { } } + + sanitizeString(str: string) { + return str.toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, ""); + } + + /** + * Returns only the articles whose name contains str. Case and accents insensitive. + * @param str + * @returns {[]} + */ + filterData(str: string) { + let filteredData = []; + const testStr = this.sanitizeString(str); + const articles = this.originalData; + for (const article of articles) { + const name = this.sanitizeString(article.name); + if (name.includes(testStr)) { + filteredData.push(article) + } + } + return filteredData; + } + + search(str: string) { + this.setState({ + currentlyDisplayedData: this.filterData(str) + }) + } + getModalContent() { return ( { hasBackButton={true} navigation={nav} hasSearchField={true} - searchCallback={(text) => console.log(text)} + searchCallback={(text) => this.search(text)} rightButton={this.getSortMenu()}/> item.name + item.code} style={{minHeight: 300, width: '100%'}} renderItem={({item}) => diff --git a/screens/Proximo/ProximoMainScreen.js b/screens/Proximo/ProximoMainScreen.js index 586e7b9..f04044f 100644 --- a/screens/Proximo/ProximoMainScreen.js +++ b/screens/Proximo/ProximoMainScreen.js @@ -102,25 +102,13 @@ export default class ProximoMainScreen extends FetchedDataSectionList { getRightButton() { return ( - - this.props.navigation.navigate('ProximoSearchScreen', {data: this.state.fetchedData})}> - - - this.props.navigation.navigate('ProximoAboutScreen')}> - - - + this.props.navigation.navigate('ProximoAboutScreen')}> + + ); } @@ -138,15 +126,16 @@ export default class ProximoMainScreen extends FetchedDataSectionList { {item.type.name} - + {item.data.length} {item.data.length > 1 ? i18n.t('proximoScreen.articles') : i18n.t('proximoScreen.article')} - + diff --git a/screens/Proximo/ProximoSearchScreen.js b/screens/Proximo/ProximoSearchScreen.js deleted file mode 100644 index a03e7e6..0000000 --- a/screens/Proximo/ProximoSearchScreen.js +++ /dev/null @@ -1,115 +0,0 @@ -// @flow - -import * as React from 'react'; -import {Body, Container, Content, Left, ListItem, Right, Text, Thumbnail,} from 'native-base'; -import {FlatList} from "react-native"; -import i18n from "i18n-js"; -import ThemeManager from "../../utils/ThemeManager"; -import CustomHeader from "../../components/CustomHeader"; - -type Props = { - navigation: Object, -}; - -type State = { - filteredData: Array, -}; - -/** - * Class defining proximo's article list of a certain category. - */ -export default class ProximoSearchScreen extends React.Component { - - state = { - filteredData: this.props.navigation.getParam('data', {articles: [{name: "Error"}]}).articles, - }; - - /** - * get color depending on quantity available - * - * @param availableStock - * @return - */ - getStockColor(availableStock: number) { - let color: string; - if (availableStock > 3) - color = ThemeManager.getCurrentThemeVariables().brandSuccess; - else if (availableStock > 0) - color = ThemeManager.getCurrentThemeVariables().brandWarning; - else - color = ThemeManager.getCurrentThemeVariables().brandDanger; - return color; - } - - - showItemDetails(item: Object) { - //TODO: implement onClick function (copy-paste from ProximoListScreen) - } - - /** - * Returns only the articles whose name contains str. Case and accents insensitive. - * @param str - * @returns {[]} - */ - filterData(str: string) { - let filteredData = []; - const testStr: String = str.toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, ""); - const articles: Object = this.props.navigation.getParam('data', {articles: [{name: "Error"}]}).articles; - for (const article: Object of articles) { - const name: String = String(article.name.toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, "")); - if (name.includes(testStr)) { - filteredData.push(article) - } - } - return filteredData; - } - - search(str: string) { - this.setState({ - filteredData: this.filterData(str) - }) - } - - render() { - return ( - - this.search(text)}/> - - item.name + item.code} - style={{minHeight: 300, width: '100%'}} - renderItem={({item}) => - {this.showItemDetails(item);}} > - - - - - - {item.name} - - - {item.quantity + ' ' + i18n.t('proximoScreen.inStock')} - - - - - {item.price}€ - - - } - /> - - - ); - } -}