Added intro slide on update, changed planning event display on click

App.js

@@ -20,6 +20,7 @@ type Props = {};
 type State = {
     isLoading: boolean,
     showIntro: boolean,
+    showUpdate: boolean,
     currentTheme: ?Object,
 };
 
@@ -28,6 +29,7 @@ export default class App extends React.Component<Props, State> {
     state = {
         isLoading: true,
         showIntro: true,
+        showUpdate: true,
         currentTheme: null,
     };
 
@@ -47,11 +49,15 @@ export default class App extends React.Component<Props, State> {
     }
 
     /**
-     * Callback when user ends the intro. Save in preferences to avaoid showing back the slides
+     * Callback when user ends the intro. Save in preferences to avaoid showing back the introSlides
      */
     onIntroDone() {
-        this.setState({showIntro: false});
+        this.setState({
+            showIntro: false,
+            showUpdate: false,
+        });
         AsyncStorageManager.getInstance().savePref(AsyncStorageManager.getInstance().preferences.showIntro.key, '0');
+        AsyncStorageManager.getInstance().savePref(AsyncStorageManager.getInstance().preferences.showUpdate1.key, '0');
     }
 
     async loadAssetsAsync() {
@@ -73,7 +79,8 @@ export default class App extends React.Component<Props, State> {
         this.setState({
             isLoading: false,
             currentTheme: ThemeManager.getCurrentTheme(),
-            showIntro: AsyncStorageManager.getInstance().preferences.showIntro.current === '1'
+            showIntro: AsyncStorageManager.getInstance().preferences.showIntro.current === '1',
+            showUpdate: AsyncStorageManager.getInstance().preferences.showUpdate1.current === '1'
             // showIntro: true
         });
     }
@@ -91,8 +98,8 @@ export default class App extends React.Component<Props, State> {
                 />
             );
         }
-        if (this.state.showIntro) {
+        if (this.state.showIntro || this.state.showUpdate) {
-            return <CustomIntroSlider onDone={() => this.onIntroDone()}/>;
+            return <CustomIntroSlider onDone={() => this.onIntroDone()} isUpdate={this.state.showUpdate && !this.state.showIntro}/>;
         } else {
             const AppNavigator = createAppContainerWithInitialRoute(AsyncStorageManager.getInstance().preferences.defaultStartScreen.current);
             return (

components/CustomIntroSlider.js

@@ -39,15 +39,17 @@ const styles = StyleSheet.create({
 
 type Props = {
     onDone: Function,
+    isUpdate: boolean
 };
 
 export default class CustomIntroSlider extends React.Component<Props> {
 
-    slides: Array<Object>;
+    introSlides: Array<Object>;
+    updateSlides: Array<Object>;
 
     constructor() {
         super();
-        this.slides = [
+        this.introSlides = [
             {
                 key: '1',
                 title: i18n.t('intro.slide1.title'),
@@ -91,11 +93,20 @@ export default class CustomIntroSlider extends React.Component<Props> {
                 colors: ['#37c13e', '#26852b'],
             },
         ];
+        this.updateSlides = [
+            {
+                key: '1',
+                title: i18n.t('intro.updateSlide.title'),
+                text: i18n.t('intro.updateSlide.text'),
+                icon: 'calendar-range',
+                colors: ['#e01928', '#be1522'],
+            },
+        ]
     }
 
 
     /**
-     * Render item to be used for the intro slides
+     * Render item to be used for the intro introSlides
      * @param item
      * @param dimensions
      */
@@ -125,7 +136,7 @@ export default class CustomIntroSlider extends React.Component<Props> {
     render() {
         return (
             <AppIntroSlider renderItem={({item, dimensions}) => CustomIntroSlider.getIntroRenderItem(item, dimensions)}
-                            slides={this.slides} onDone={() => this.props.onDone()} bottomButton showSkipButton/>
+                            slides={this.props.isUpdate ? this.updateSlides : this.introSlides} onDone={() => this.props.onDone()} bottomButton showSkipButton/>
         );
     }
 

screens/PlanningScreen.js

@@ -60,7 +60,7 @@ export default class PlanningScreen extends React.Component<Props, State> {
     state = {
         modalCurrentDisplayItem: {},
         refreshing: false,
-        agendaItems: {}
+        agendaItems: {},
     };
 
     getCurrentDate() {
@@ -124,7 +124,7 @@ export default class PlanningScreen extends React.Component<Props, State> {
 
     showItemDetails(item: Object) {
         this.setState({
-            modalCurrentDisplayItem: item
+            modalCurrentDisplayItem: item,
         });
         if (this.modalRef.current) {
             this.modalRef.current.open();
@@ -203,7 +203,7 @@ export default class PlanningScreen extends React.Component<Props, State> {
     _onRefresh = () => {
         let canRefresh;
         if (this.lastRefresh !== undefined)
-            canRefresh = (new Date().getTime() - this.lastRefresh.getTime())/1000 > this.minTimeBetweenRefresh;
+            canRefresh = (new Date().getTime() - this.lastRefresh.getTime()) / 1000 > this.minTimeBetweenRefresh;
         else
             canRefresh = true;
 
@@ -292,6 +292,12 @@ export default class PlanningScreen extends React.Component<Props, State> {
         return array[0] + ':' + array[1];
     }
 
+    onModalClosed() {
+        this.setState({
+            modalCurrentDisplayItem: {},
+        });
+    }
+
     render() {
         const nav = this.props.navigation;
         return (
@@ -299,7 +305,9 @@ export default class PlanningScreen extends React.Component<Props, State> {
                 <Modalize ref={this.modalRef}
                           modalStyle={{
                               backgroundColor: ThemeManager.getCurrentThemeVariables().containerBgColor,
-                          }}>
+                          }}
+                          adjustToContentHeight
+                          onClosed={() => this.onModalClosed()}>
                     {this.getModalContent()}
                 </Modalize>
                 <Agenda
@@ -310,7 +318,7 @@ export default class PlanningScreen extends React.Component<Props, State> {
                     // initially selected day
                     selected={this.getCurrentDate()}
                     // Minimum date that can be selected, dates before minDate will be grayed out. Default = undefined
-                    minDate={"2019-09-01"}
+                    minDate={this.getCurrentDate()}
                     // Max amount of months allowed to scroll to the past. Default = 50
                     pastScrollRange={1}
                     // Max amount of months allowed to scroll to the future. Default = 50

translations/en.json

@@ -33,6 +33,10 @@
     "slide6": {
       "title": "More to come...",
       "text": "New features are coming soon, do not hesitate to give us feedback to improve the app"
+    },
+    "updateSlide": {
+      "title": "New in this update!",
+      "text": "Discover every event occurring on the campus in the new Planning screen!"
     }
   },
   "settingsScreen": {

translations/fr.json

@@ -33,6 +33,10 @@
     "slide6": {
       "title": "Plus à venir...",
       "text": "D'autres fonctionnalités arrivent bientôt, n'hésitez pas à nous donner votre avis pour améliorer l'appli"
+    },
+    "updateSlide": {
+      "title": "Nouveau dans cette mise à jour !",
+      "text": "Découvre tous les événements du campus dans la nouvelle section Planning !"
     }
   },
   "settingsScreen": {

utils/AsyncStorageManager.js

@@ -29,6 +29,11 @@ export default class AsyncStorageManager {
             default: '1',
             current: '',
         },
+        showUpdate1: {
+            key: 'showUpdate1',
+            default: '1',
+            current: '',
+        },
         proxiwashNotifications: {
             key: 'proxiwashNotifications',
             default: '5',