diff --git a/src/screens/Services/Proximo/ProximoAboutScreen.js b/src/screens/Services/Proximo/ProximoAboutScreen.js deleted file mode 100644 index f8882af..0000000 --- a/src/screens/Services/Proximo/ProximoAboutScreen.js +++ /dev/null @@ -1,83 +0,0 @@ -/* - * Copyright (c) 2019 - 2020 Arnaud Vergnet. - * - * This file is part of Campus INSAT. - * - * Campus INSAT is free software: you can redistribute it and/or modify - * it under the terms of the GNU General Public License as published by - * the Free Software Foundation, either version 3 of the License, or - * (at your option) any later version. - * - * Campus INSAT is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU General Public License for more details. - * - * You should have received a copy of the GNU General Public License - * along with Campus INSAT. If not, see . - */ - -// @flow - -import * as React from 'react'; -import {Image, View} from 'react-native'; -import i18n from 'i18n-js'; -import {Card, Avatar, Paragraph, Text} from 'react-native-paper'; -import CustomTabBar from '../../../components/Tabbar/CustomTabBar'; -import CollapsibleScrollView from '../../../components/Collapsible/CollapsibleScrollView'; -import type {CardTitleIconPropsType} from '../../../constants/PaperStyles'; - -const LOGO = 'https://etud.insa-toulouse.fr/~amicale_app/images/Proximo.png'; - -/** - * Class defining the proximo about screen. - */ -// eslint-disable-next-line react/prefer-stateless-function -export default class ProximoAboutScreen extends React.Component { - render(): React.Node { - return ( - - - - - {i18n.t('screens.proximo.description')} - - ( - - )} - /> - - 18h30 - 19h30 - - - - ( - - )} - /> - - - {i18n.t('screens.proximo.paymentMethodsDescription')} - - - - - ); - } -} diff --git a/src/screens/Services/Proximo/ProximoAboutScreen.tsx b/src/screens/Services/Proximo/ProximoAboutScreen.tsx new file mode 100644 index 0000000..21eae9f --- /dev/null +++ b/src/screens/Services/Proximo/ProximoAboutScreen.tsx @@ -0,0 +1,78 @@ +/* + * Copyright (c) 2019 - 2020 Arnaud Vergnet. + * + * This file is part of Campus INSAT. + * + * Campus INSAT is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * Campus INSAT is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with Campus INSAT. If not, see . + */ + +// @flow + +import * as React from 'react'; +import {Image, View} from 'react-native'; +import i18n from 'i18n-js'; +import {Card, Avatar, Paragraph, Text} from 'react-native-paper'; +import CustomTabBar from '../../../components/Tabbar/CustomTabBar'; +import CollapsibleScrollView from '../../../components/Collapsible/CollapsibleScrollView'; + +const LOGO = 'https://etud.insa-toulouse.fr/~amicale_app/images/Proximo.png'; + +/** + * Class defining the proximo about screen. + */ +export default function ProximoAboutScreen() { + return ( + + + + + {i18n.t('screens.proximo.description')} + + ( + + )} + /> + + 18h30 - 19h30 + + + + ( + + )} + /> + + + {i18n.t('screens.proximo.paymentMethodsDescription')} + + + + + ); +} diff --git a/src/screens/Services/Proximo/ProximoListScreen.js b/src/screens/Services/Proximo/ProximoListScreen.tsx similarity index 87% rename from src/screens/Services/Proximo/ProximoListScreen.js rename to src/screens/Services/Proximo/ProximoListScreen.tsx index c504259..ce4c317 100644 --- a/src/screens/Services/Proximo/ProximoListScreen.js +++ b/src/screens/Services/Proximo/ProximoListScreen.tsx @@ -17,8 +17,6 @@ * along with Campus INSAT. If not, see . */ -// @flow - import * as React from 'react'; import {Image, Platform, ScrollView, View} from 'react-native'; import i18n from 'i18n-js'; @@ -38,7 +36,6 @@ import ProximoListItem from '../../../components/Lists/Proximo/ProximoListItem'; import MaterialHeaderButtons, { Item, } from '../../../components/Overrides/CustomHeaderButton'; -import type {CustomThemeType} from '../../../managers/ThemeManager'; import CollapsibleFlatList from '../../../components/Collapsible/CollapsibleFlatList'; import type {ProximoArticleType} from './ProximoMainScreen'; @@ -54,34 +51,42 @@ function sortPriceReverse( } function sortName(a: ProximoArticleType, b: ProximoArticleType): number { - if (a.name.toLowerCase() < b.name.toLowerCase()) return -1; - if (a.name.toLowerCase() > b.name.toLowerCase()) return 1; + if (a.name.toLowerCase() < b.name.toLowerCase()) { + return -1; + } + if (a.name.toLowerCase() > b.name.toLowerCase()) { + return 1; + } return 0; } function sortNameReverse(a: ProximoArticleType, b: ProximoArticleType): number { - if (a.name.toLowerCase() < b.name.toLowerCase()) return 1; - if (a.name.toLowerCase() > b.name.toLowerCase()) return -1; + if (a.name.toLowerCase() < b.name.toLowerCase()) { + return 1; + } + if (a.name.toLowerCase() > b.name.toLowerCase()) { + return -1; + } return 0; } const LIST_ITEM_HEIGHT = 84; type PropsType = { - navigation: StackNavigationProp, + navigation: StackNavigationProp; route: { params: { - data: {data: Array}, - shouldFocusSearchBar: boolean, - }, - }, - theme: CustomThemeType, + data: {data: Array}; + shouldFocusSearchBar: boolean; + }; + }; + theme: ReactNativePaper.Theme; }; type StateType = { - currentSortMode: number, - modalCurrentDisplayItem: React.Node, - currentSearchString: string, + currentSortMode: number; + modalCurrentDisplayItem: React.ReactNode; + currentSearchString: string; }; /** @@ -96,6 +101,7 @@ class ProximoListScreen extends React.Component { constructor(props: PropsType) { super(props); + this.modalRef = null; this.listData = props.route.params.data.data.sort(sortName); this.shouldFocusSearchBar = props.route.params.shouldFocusSearchBar; this.state = { @@ -186,7 +192,9 @@ class ProximoListScreen extends React.Component { this.listData.sort(sortName); break; } - if (this.modalRef && currentMode !== currentSortMode) this.modalRef.close(); + if (this.modalRef && currentMode !== currentSortMode) { + this.modalRef.close(); + } } /** @@ -198,9 +206,13 @@ class ProximoListScreen extends React.Component { getStockColor(availableStock: number): string { const {theme} = this.props; let color: string; - if (availableStock > 3) color = theme.colors.success; - else if (availableStock > 0) color = theme.colors.warning; - else color = theme.colors.danger; + if (availableStock > 3) { + color = theme.colors.success; + } else if (availableStock > 0) { + color = theme.colors.warning; + } else { + color = theme.colors.danger; + } return color; } @@ -209,7 +221,7 @@ class ProximoListScreen extends React.Component { * * @return {*} */ - getSortMenuButton = (): React.Node => { + getSortMenuButton = () => { return ( @@ -222,8 +234,9 @@ class ProximoListScreen extends React.Component { * * @return {*} */ - getSearchBar = (): React.Node => { + getSearchBar = () => { return ( + // @ts-ignore { * @param item The article to display * @return {*} */ - getModalItemContent(item: ProximoArticleType): React.Node { + getModalItemContent(item: ProximoArticleType) { return ( { * * @return {*} */ - getModalSortMenu(): React.Node { + getModalSortMenu() { const {currentSortMode} = this.state; return ( { onValueChange={(value: string) => { this.setSortMode(value); }} - value={currentSortMode}> + value={currentSortMode.toString()}> @@ -327,7 +340,7 @@ class ProximoListScreen extends React.Component { * @param item The article to render * @return {*} */ - getRenderItem = ({item}: {item: ProximoArticleType}): React.Node => { + getRenderItem = ({item}: {item: ProximoArticleType}) => { const {currentSearchString} = this.state; if (stringMatchQuery(item.name, currentSearchString)) { const onPress = () => { @@ -364,15 +377,15 @@ class ProximoListScreen extends React.Component { }; itemLayout = ( - data: ProximoArticleType, + data: Array | null | undefined, index: number, - ): {length: number, offset: number, index: number} => ({ + ): {length: number; offset: number; index: number} => ({ length: LIST_ITEM_HEIGHT, offset: LIST_ITEM_HEIGHT * index, index, }); - render(): React.Node { + render() { const {state} = this; return ( , - image: string, + name: string; + description: string; + quantity: string; + price: string; + code: string; + id: string; + type: Array; + image: string; }; export type ProximoMainListItemType = { - type: ProximoCategoryType, - data: Array, + type: ProximoCategoryType; + data: Array; }; export type ProximoDataType = { - types: Array, - articles: Array, + types: Array; + articles: Array; }; type PropsType = { - navigation: StackNavigationProp, - theme: CustomThemeType, + navigation: StackNavigationProp; + theme: ReactNativePaper.Theme; }; /** @@ -87,12 +85,20 @@ class ProximoMainScreen extends React.Component { const str2 = b.type.name.toLowerCase(); // Make 'All' category with id -1 stick to the top - if (a.type.id === -1) return -1; - if (b.type.id === -1) return 1; + if (a.type.id === '-1') { + return -1; + } + if (b.type.id === '-1') { + return 1; + } // Sort others by name ascending - if (str1 < str2) return -1; - if (str1 > str2) return 1; + if (str1 < str2) { + return -1; + } + if (str1 > str2) { + return 1; + } return 0; } @@ -105,16 +111,17 @@ class ProximoMainScreen extends React.Component { */ static getAvailableArticles( articles: Array | null, - type: ?ProximoCategoryType, + type?: ProximoCategoryType, ): Array { - const availableArticles = []; + const availableArticles: Array = []; if (articles != null) { articles.forEach((article: ProximoArticleType) => { if ( ((type != null && article.type.includes(type.id)) || type == null) && parseInt(article.quantity, 10) > 0 - ) + ) { availableArticles.push(article); + } }); } return availableArticles; @@ -122,13 +129,18 @@ class ProximoMainScreen extends React.Component { articles: Array | null; + constructor(props: PropsType) { + super(props); + this.articles = null; + } + /** * Creates header button */ componentDidMount() { const {navigation} = this.props; navigation.setOptions({ - headerRight: (): React.Node => this.getHeaderButtons(), + headerRight: () => this.getHeaderButtons(), }); } @@ -168,7 +180,7 @@ class ProximoMainScreen extends React.Component { * Gets the header buttons * @return {*} */ - getHeaderButtons(): React.Node { + getHeaderButtons() { return ( { * @param item The category to render * @return {*} */ - getRenderItem = ({item}: {item: ProximoMainListItemType}): React.Node => { + getRenderItem = ({item}: {item: ProximoMainListItemType}) => { const {navigation, theme} = this.props; const dataToSend = { shouldFocusSearchBar: false, @@ -219,14 +231,14 @@ class ProximoMainScreen extends React.Component { title={item.type.name} description={subtitle} onPress={onPress} - left={(props: ListIconPropsType): React.Node => ( + left={(props) => ( )} - right={(props: ListIconPropsType): React.Node => ( + right={(props) => ( { return finalData; } - render(): React.Node { + render() { const {navigation} = this.props; return (