Added proximo info screen and improved proxiwash one

navigation/AppNavigator.js

@@ -7,6 +7,7 @@ import AboutScreen from '../screens/About/AboutScreen';
 import ProximoListScreen from '../screens/Proximo/ProximoListScreen';
 import AboutDependenciesScreen from '../screens/About/AboutDependenciesScreen';
 import ProxiwashAboutScreen from '../screens/ProxiwashAboutScreen';
+import ProximoAboutScreen from '../screens/Proximo/ProximoAboutScreen';
 import SelfMenuScreen from '../screens/SelfMenuScreen';
 import {fromRight} from "react-navigation-transitions";
 
@@ -23,6 +24,7 @@ export default createAppContainer(
             AboutDependenciesScreen: {screen: AboutDependenciesScreen},
             SelfMenuScreen: {screen: SelfMenuScreen},
             ProxiwashAboutScreen: {screen: ProxiwashAboutScreen},
+            ProximoAboutScreen: {screen: ProximoAboutScreen},
         },
         {
             initialRouteName: "Main",

screens/Proximo/ProximoAboutScreen.js

@@ -0,0 +1,78 @@
+// @flow
+
+import * as React from 'react';
+import {Image, Linking, View} from 'react-native';
+import {Body, Card, CardItem, Container, Content, H2, Left, Text} from 'native-base';
+import CustomHeader from "../../components/CustomHeader";
+import i18n from "i18n-js";
+import CustomMaterialIcon from "../../components/CustomMaterialIcon";
+
+type Props = {
+    navigation: Object,
+};
+
+/**
+ * Opens a link in the device's browser
+ * @param link The link to open
+ */
+function openWebLink(link) {
+    Linking.openURL(link).catch((err) => console.error('Error opening link', err));
+}
+
+/**
+ * Class defining an about screen. This screen shows the user information about the app and it's author.
+ */
+export default class ProximoAboutScreen extends React.Component<Props> {
+
+    render() {
+        const nav = this.props.navigation;
+        return (
+            <Container>
+                <CustomHeader navigation={nav} title={i18n.t('screens.proximo')} hasBackButton={true}/>
+                <Content padder>
+                    <View style={{
+                        width: '100%',
+                        height: 100,
+                        marginTop: 20,
+                        marginBottom: 20,
+                        justifyContent: 'center',
+                        alignItems: 'center'
+                    }}>
+                        <Image
+                            source={require('../../assets/proximo-logo.png')}
+                            style={{flex: 1, resizeMode: "contain"}}
+                            resizeMode="contain"/>
+                    </View>
+                    <Text>
+                        Le Proximo c’est ta petite épicerie étudiante tenu par les étudiants directement sur le
+                        campus. Ouvert tous les jours de 18h30 à 19h30, nous t’accueillons et te souvent quand tu n’as
+                        plus de pâtes ou de diluant ! Différents produits pour différentes galère, le tout à prix
+                        coûtant. Tu peux payer par Lydia ou par espèce.
+                    </Text>
+                    <Card>
+                        <CardItem>
+                            <Left>
+                                <CustomMaterialIcon icon={'clock-outline'}/>
+                                <H2>Horaires</H2>
+                            </Left>
+                        </CardItem>
+                        <CardItem>
+                            <Text>18h30 - 19h30</Text>
+                        </CardItem>
+                    </Card>
+                    <Card>
+                        <CardItem>
+                            <Left>
+                                <CustomMaterialIcon icon={'cash'}/>
+                                <H2>Paiement</H2>
+                            </Left>
+                        </CardItem>
+                        <CardItem>
+                            <Text>Espèce ou Lydia</Text>
+                        </CardItem>
+                    </Card>
+                </Content>
+            </Container>
+        );
+    }
+}

screens/Proximo/ProximoMainScreen.js

@@ -1,11 +1,13 @@
 // @flow
 
 import * as React from 'react';
-import {View} from 'react-native'
+import {Platform, View} from 'react-native'
 import {Badge, Body, H2, Left, ListItem, Right, Text} from 'native-base';
 import i18n from "i18n-js";
 import CustomMaterialIcon from "../../components/CustomMaterialIcon";
 import FetchedDataSectionList from "../../components/FetchedDataSectionList";
+import ThemeManager from "../../utils/ThemeManager";
+import Touchable from "react-native-platform-touchable";
 
 const DATA_URL = "https://srv-falcon.etud.insa-toulouse.fr/~proximo/data/stock.json";
 
@@ -78,6 +80,18 @@ export default class ProximoMainScreen extends FetchedDataSectionList {
         return finalData;
     }
 
+    getRightButton() {
+        return (
+            <Touchable
+                style={{padding: 6}}
+                onPress={() => this.props.navigation.navigate('ProximoAboutScreen')}>
+                <CustomMaterialIcon
+                    color={Platform.OS === 'ios' ? ThemeManager.getCurrentThemeVariables().brandPrimary : "#fff"}
+                    icon="information"/>
+            </Touchable>
+        );
+    }
+
     getRenderItem(item: Object, section: Object, data: Object) {
         if (item.data.length > 0) {
             return (

screens/ProxiwashAboutScreen.js

@@ -2,7 +2,7 @@
 
 import * as React from 'react';
 import {Image, Linking, View} from 'react-native';
-import {Body, Card, CardItem, Container, Content, H1, Left, Tab, TabHeading, Tabs, Text} from 'native-base';
+import {Card, CardItem, Container, Content, H2, Left, Tab, TabHeading, Tabs, Text} from 'native-base';
 import CustomHeader from "../components/CustomHeader";
 import i18n from "i18n-js";
 import CustomMaterialIcon from "../components/CustomMaterialIcon";
@@ -62,9 +62,8 @@ export default class ProxiwashAboutScreen extends React.Component<Props> {
                             <Card>
                                 <CardItem>
                                     <Left>
-                                        <Body>
+                                        <CustomMaterialIcon icon={'tumble-dryer'}/>
-                                            <H1>Seche linge</H1>
+                                        <H2>Seche linge</H2>
-                                        </Body>
                                     </Left>
                                 </CardItem>
                                 <CardItem>
@@ -74,9 +73,8 @@ export default class ProxiwashAboutScreen extends React.Component<Props> {
                             <Card>
                                 <CardItem>
                                     <Left>
-                                        <Body>
+                                        <CustomMaterialIcon icon={'washing-machine'}/>
-                                            <H1>Machine a laver</H1>
+                                        <H2>Machine a laver</H2>
-                                        </Body>
                                     </Left>
                                 </CardItem>
                                 <CardItem>
@@ -102,9 +100,8 @@ export default class ProxiwashAboutScreen extends React.Component<Props> {
                             <Card>
                                 <CardItem>
                                     <Left>
-                                        <Body>
+                                        <CustomMaterialIcon icon={'coins'}/>
-                                            <H1>Tarifs</H1>
+                                        <H2>Tarifs</H2>
-                                        </Body>
                                     </Left>
                                 </CardItem>
                                 <CardItem>
@@ -114,9 +111,8 @@ export default class ProxiwashAboutScreen extends React.Component<Props> {
                             <Card>
                                 <CardItem>
                                     <Left>
-                                        <Body>
+                                        <CustomMaterialIcon icon={'cash'}/>
-                                            <H1>Moyens de Paiement</H1>
+                                        <H2>Moyens de Paiement</H2>
-                                        </Body>
                                     </Left>
                                 </CardItem>
                                 <CardItem>