From 5bda2825c578589020faedc9157556b4a5865b25 Mon Sep 17 00:00:00 2001
From: keplyx <keplyx@gmail.com>
Date: Sun, 28 Jul 2019 12:40:35 +0200
Subject: [PATCH] Changed fb data url to use etud, changed proxiwash display to
 use a tab system

---
 components/CustomHeader.js           |  2 +
 components/FetchedDataSectionList.js | 97 +++++++++++++++++++---------
 screens/HomeScreen.js                |  5 +-
 screens/Proximo/ProximoMainScreen.js |  2 +-
 screens/ProxiwashScreen.js           | 16 +++--
 5 files changed, 83 insertions(+), 39 deletions(-)

diff --git a/components/CustomHeader.js b/components/CustomHeader.js
index 22e941e..3073e4a 100644
--- a/components/CustomHeader.js
+++ b/components/CustomHeader.js
@@ -11,6 +11,7 @@ type Props = {
     rightMenu: React.Node,
     title: string,
     navigation: Object,
+    hasTabs: boolean,
 };
 
 /**
@@ -26,6 +27,7 @@ export default class CustomHeader extends React.Component<Props> {
     static defaultProps = {
         backButton: false,
         rightMenu: <Right/>,
+        hasTabs: false,
     };
 
     render() {
diff --git a/components/FetchedDataSectionList.js b/components/FetchedDataSectionList.js
index dc96b8f..bbd9972 100644
--- a/components/FetchedDataSectionList.js
+++ b/components/FetchedDataSectionList.js
@@ -2,9 +2,9 @@
 
 import * as React from 'react';
 import WebDataManager from "../utils/WebDataManager";
-import {Container, Content, H2} from "native-base";
+import {Container, Content, Tab, TabHeading, Tabs, Text} from "native-base";
 import CustomHeader from "./CustomHeader";
-import {SectionList, RefreshControl, View} from "react-native";
+import {RefreshControl, SectionList, View} from "react-native";
 
 type Props = {
     navigation: Object,
@@ -14,12 +14,12 @@ type State = {
     refreshing: boolean,
     firstLoading: boolean,
     fetchedData: Object,
-    machinesWatched : Array<Object>
+    machinesWatched: Array<Object>
 };
 
 export default class FetchedDataSectionList extends React.Component<Props, State> {
 
-    webDataManager : WebDataManager;
+    webDataManager: WebDataManager;
 
     constructor() {
         super();
@@ -30,7 +30,7 @@ export default class FetchedDataSectionList extends React.Component<Props, State
         refreshing: false,
         firstLoading: true,
         fetchedData: {},
-        machinesWatched : [],
+        machinesWatched: [],
     };
 
     getFetchUrl() {
@@ -41,7 +41,7 @@ export default class FetchedDataSectionList extends React.Component<Props, State
         return "Header";
     }
 
-    getUpdateToastTranslations () {
+    getUpdateToastTranslations() {
         return ["whoa", "nah"];
     }
 
@@ -64,12 +64,12 @@ export default class FetchedDataSectionList extends React.Component<Props, State
         });
     };
 
-    getRenderItem(item: Object, section : Object, data : Object) {
-        return <View />;
+    getRenderItem(item: Object, section: Object, data: Object) {
+        return <View/>;
     }
 
     getRenderSectionHeader(title: String) {
-        return <View />;
+        return <View/>;
     }
 
     /**
@@ -77,7 +77,7 @@ export default class FetchedDataSectionList extends React.Component<Props, State
      * @param fetchedData {Object}
      * @return {Array}
      */
-    createDataset(fetchedData : Object) : Array<Object> {
+    createDataset(fetchedData: Object): Array<Object> {
         return [];
     }
 
@@ -86,35 +86,72 @@ export default class FetchedDataSectionList extends React.Component<Props, State
      * @param item {Object}
      * @return {*}
      */
-    getKeyExtractor(item : Object) {
+    getKeyExtractor(item: Object) {
         return item.id;
     }
 
+    hasTabs() {
+        return false;
+    }
+
+    getSectionList(dataset: Array<Object>) {
+        return (
+            <SectionList
+                sections={dataset}
+                keyExtractor={(item) => this.getKeyExtractor(item)}
+                refreshControl={
+                    <RefreshControl
+                        refreshing={this.state.refreshing}
+                        onRefresh={this._onRefresh}
+                    />
+                }
+                renderSectionHeader={({section: {title}}) =>
+                    this.getRenderSectionHeader(title)
+                }
+                renderItem={({item, section}) =>
+                    this.getRenderItem(item, section, dataset)
+                }
+                style={{minHeight: 300, width: '100%'}}
+            />
+        );
+    }
+
+    getTabbedView(dataset: Array<Object>) {
+        let tabbedView = [];
+        for (let i = 0; i < dataset.length; i++) {
+            tabbedView.push(
+                <Tab heading={<TabHeading><Text>{dataset[i].title}</Text></TabHeading>}>
+                    <Content padder>
+                        {this.getSectionList(
+                            [
+                                {
+                                    title: dataset[i].title,
+                                    data: dataset[i].data,
+                                    extraData: dataset[i].extraData,
+                                }
+                            ]
+                        )}
+                    </Content>
+                </Tab>);
+        }
+        return tabbedView;
+    }
+
     render() {
         const nav = this.props.navigation;
         const dataset = this.createDataset(this.state.fetchedData);
         return (
             <Container>
                 <CustomHeader navigation={nav} title={this.getHeaderTranslation()}/>
-                <Content padder>
-                    <SectionList
-                        sections={dataset}
-                        keyExtractor={(item) => this.getKeyExtractor(item)}
-                        refreshControl={
-                            <RefreshControl
-                                refreshing={this.state.refreshing}
-                                onRefresh={this._onRefresh}
-                            />
-                        }
-                        renderSectionHeader={({section: {title}}) =>
-                            this.getRenderSectionHeader(title)
-                        }
-                        renderItem={({item, section}) =>
-                            this.getRenderItem(item, section, dataset)
-                        }
-                        style={{minHeight: 300, width: '100%'}}
-                    />
-                </Content>
+                {this.hasTabs() ?
+                    <Tabs>
+                        {this.getTabbedView(dataset)}
+                    </Tabs>
+                    :
+                    <Content padder>
+                        {this.getSectionList(dataset)}
+                    </Content>
+                }
             </Container>
         );
     }
diff --git a/screens/HomeScreen.js b/screens/HomeScreen.js
index eac4665..eef0918 100644
--- a/screens/HomeScreen.js
+++ b/screens/HomeScreen.js
@@ -9,7 +9,8 @@ import FetchedDataSectionList from "../components/FetchedDataSectionList";
 
 const ICON_AMICALE = require('../assets/amicale.png');
 const NAME_AMICALE = 'Amicale INSA Toulouse';
-const FB_URL = "https://graph.facebook.com/v3.3/amicale.deseleves/posts?fields=message%2Cfull_picture%2Ccreated_time%2Cpermalink_url&&date_format=U&access_token=EAAGliUs4Ei8BAGwHmg7SNnosoEDMuDhP3i5lYOGrIGzZBNeMeGzGhpUigJt167cKXEIM0GiurSgaC0PS4Xg2GBzOVNiZCfr8u48VVB15a9YbOsuhjBqhHAMb2sz6ibwOuDhHSvwRZCUpBZCjmAW12e7RjWJp0jvyNoYYvIQbfaLWi3Nk2mBc";
+const FB_URL = "https://etud.insa-toulouse.fr/~vergnet/appli-amicale/facebook_data.json";
+
 
 /**
  * Opens a link in the device's browser
@@ -33,7 +34,7 @@ export default class HomeScreen extends FetchedDataSectionList {
     }
 
     getKeyExtractor(item : Object) {
-        return item.id;
+        return item !== undefined ? item.id : undefined;
     }
 
     createDataset(fetchedData : Object) {
diff --git a/screens/Proximo/ProximoMainScreen.js b/screens/Proximo/ProximoMainScreen.js
index df1f23b..cae6d4e 100644
--- a/screens/Proximo/ProximoMainScreen.js
+++ b/screens/Proximo/ProximoMainScreen.js
@@ -36,7 +36,7 @@ export default class ProximoMainScreen extends FetchedDataSectionList {
     }
 
     getKeyExtractor(item: Object) {
-        return item.type;
+        return item !== undefined ? item.type : undefined;
     }
 
     createDataset(fetchedData: Object) {
diff --git a/screens/ProxiwashScreen.js b/screens/ProxiwashScreen.js
index 66b8511..97aef8a 100644
--- a/screens/ProxiwashScreen.js
+++ b/screens/ProxiwashScreen.js
@@ -78,7 +78,7 @@ export default class ProxiwashScreen extends FetchedDataSectionList {
     }
 
     getKeyExtractor(item: Object) {
-        return item.number;
+        return item !== undefined ? item.number : undefined;
     }
 
     /**
@@ -204,6 +204,10 @@ export default class ProxiwashScreen extends FetchedDataSectionList {
         ];
     }
 
+    hasTabs(): boolean {
+        return true;
+    }
+
     /**
      * Get list item to be rendered
      *
@@ -233,12 +237,12 @@ export default class ProxiwashScreen extends FetchedDataSectionList {
                         backgroundColor: ThemeManager.getInstance().getCurrentThemeVariables().containerBgColor
                     }}/>
                     <Left>
-                        <CustomMaterialIcon icon={section.title === data[0].title ? 'tumble-dryer' : 'washing-machine'}
+                        <CustomMaterialIcon icon={section.title === i18n.t('proxiwashScreen.dryers') ? 'tumble-dryer' : 'washing-machine'}
                                             fontSize={30}
                         />
                         <Body>
                             <Text>
-                                {section.title === data[0].title ? i18n.t('proxiwashScreen.dryer') : i18n.t('proxiwashScreen.washer')} n°{item.number}
+                                {section.title === i18n.t('proxiwashScreen.dryers') ? i18n.t('proxiwashScreen.dryer') : i18n.t('proxiwashScreen.washer')} n°{item.number}
                             </Text>
                             <Text note>
                                 {item.startTime !== '' ? item.startTime + '/' + item.endTime : ''}
@@ -280,7 +284,7 @@ export default class ProxiwashScreen extends FetchedDataSectionList {
             </Card>);
     }
 
-    getRenderSectionHeader(title: String) {
-        return <H2 style={{textAlign: 'center', paddingVertical: 10}}>{title}</H2>;
-    }
+    // getRenderSectionHeader(title: String) {
+    //     return <H2 style={{textAlign: 'center', paddingVertical: 10}}>{title}</H2>;
+    // }
 }