Improved doc

screens/HomeScreen.js

 
     /**
      * Converts a dateString using Unix Timestamp to a formatted date
+     *
      * @param dateString {string} The Unix Timestamp representation of a date
      * @return {string} The formatted output date
      */
         this.props.navigation.navigate('SelfMenuScreen');
     }
 
+    /**
+     * Extract a key for the given item
+     *
+     * @param item The item to extract the key from
+     * @return {*} The extracted key
+     */
     getKeyExtractor(item: Object) {
         return item !== undefined ? item.id : undefined;
     }
 
+    /**
+     * Creates the dataset to be used in the FlatList
+     *
+     * @param fetchedData
+     * @return {*}
+     */
     createDataset(fetchedData: Object) {
         // fetchedData = DATA;
         let newsData = [];
         ];
     }
 
+    /**
+     * Generates the dataset associated to the dashboard to be displayed in the FlatList as a section
+     *
+     * @param dashboardData
+     * @return {*}
+     */
     generateDashboardDataset(dashboardData: Object) {
         let dataset = [
 
         return dataset
     }
 
+    /**
+     * Gets a dashboard item
+     *
+     * @param item The item to display
+     * @return {*}
+     */
     getDashboardItem(item: Object) {
         let content = item['content'];
         if (item['id'] === 'event')
     }
 
     /**
-     * Get the time limit depending on the current day:
+     * Gets the time limit depending on the current day:
      * 17:30 for every day of the week except for thursday 11:30
      * 00:00 on weekends
      */
     }
 
     /**
-     * Get the duration (in milliseconds) of an event
+     * Gets the duration (in milliseconds) of an event
+     *
      * @param event {Object}
      * @return {number} The number of milliseconds
      */
     }
 
     /**
-     * Get events starting after the limit
+     * Gets events starting after the limit
      *
      * @param events
      * @param limit
     }
 
     /**
-     * Get the event with the longest duration in the given array.
+     * Gets the event with the longest duration in the given array.
      * If all events have the same duration, return the first in the array.
+     *
      * @param events
      */
     getLongestEvent(events: Array<Object>): Object {
     }
 
     /**
-     * Get events that have not yet ended/started
+     * Gets events that have not yet ended/started
      *
      * @param events
      */
     }
 
     /**
-     *
+     * Gets the event to display in the preview
      *
      * @param events
      * @return {Object}
         return displayEvent;
     }
 
-
+    /**
+     * Gets the event render item.
+     * If a preview is available, it will be rendered inside
+     *
+     * @param content
+     * @return {*}
+     */
     getDashboardEventItem(content: Array<Object>) {
         let icon = 'calendar-range';
         let title = i18n.t('homeScreen.dashboard.todayEventsTitle');
         );
     }
 
-
+    /**
+     * Gets a classic dashboard item.
+     *
+     * @param content
+     * @return {*}
+     */
     getDashboardMiddleItem(content: Array<Object>) {
         let proxiwashData = content[0]['data'];
         let tutorinsaData = content[1]['data'];
         WebBrowser.openBrowserAsync(link);
     }
 
+    /**
+     * Gets a render item for the given feed object
+     *
+     * @param item The feed item to display
+     * @return {*}
+     */
     getFeedItem(item: Object) {
         const onImagePress = this.openLink.bind(this, item.full_picture);
         const onOutLinkPress = this.openLink.bind(this, item.permalink_url);
         );
     }
 
+    /**
+     * Gets a FlatList render item
+     *
+     * @param item The item to display
+     * @param section The current section
+     * @return {*}
+     */
     getRenderItem({item, section}: Object) {
         return (section['id'] === SECTIONS_ID[0] ?
             this.getDashboardItem(item) : this.getFeedItem(item));

screens/Planning/PlanningDisplayScreen.js

 }
 
 /**
- * Class defining an about screen. This screen shows the user information about the app and it's author.
+ * Class defining a planning event information page.
  */
 class PlanningDisplayScreen extends React.Component<Props> {
 

screens/Planning/PlanningScreen.js

         this.onBackButtonPressAndroid = this.onBackButtonPressAndroid.bind(this);
     }
 
+    /**
+     * Captures focus and blur events to hook on android back button
+     */
     componentDidMount() {
         this.onRefresh();
         this.didFocusSubscription = this.props.navigation.addListener(
         );
     }
 
+    /**
+     * Overrides default android back button behaviour to close the calendar if it was open.
+     *
+     * @return {boolean}
+     */
     onBackButtonPressAndroid() {
         if (this.state.calendarShowing) {
             this.agendaRef.chooseDay(this.agendaRef.state.selectedDay);
         }
     };
 
+    /**
+     * Function used to check if a row has changed
+     *
+     * @param r1
+     * @param r2
+     * @return {boolean}
+     */
     rowHasChanged(r1: Object, r2: Object) {
         return false;
         // if (r1 !== undefined && r2 !== undefined)
     }
 
     /**
-     * Refresh data and show a toast if any error occurred
-     * @private
+     * Refreshes data and shows an animation while doing it
      */
     onRefresh = () => {
         let canRefresh;
         }
     };
 
+    /**
+     * Callback used when receiving the agenda ref
+     *
+     * @param ref
+     */
     onAgendaRef(ref: Object) {
         this.agendaRef = ref;
     }
 
+    /**
+     * Callback used when a button is pressed to toggle the calendar
+     *
+     * @param isCalendarOpened True is the calendar is already open, false otherwise
+     */
     onCalendarToggled(isCalendarOpened: boolean) {
         this.setState({calendarShowing: isCalendarOpened});
     }
 
+    /**
+     * Gets an event render item
+     *
+     * @param item The current event to render
+     * @return {*}
+     */
     getRenderItem(item: eventObject) {
         const onPress = this.props.navigation.navigate.bind(this, 'PlanningDisplayScreen', {data: item});
         if (item.logo !== null) {
         }
     }
 
+    /**
+     * Gets an empty render item for an empty date
+     *
+     * @return {*}
+     */
     getRenderEmptyDate() {
         return (
             <Divider/>

screens/Proximo/ProximoAboutScreen.js

 };
 
 /**
- * Class defining an about screen. This screen shows the user information about the app and it's author.
+ * Class defining the proximo about screen.
  */
 export default class ProximoAboutScreen extends React.Component<Props> {
 

screens/Proximo/ProximoListScreen.js

 // @flow
 
 import * as React from 'react';
-import {Platform, Image, ScrollView, View} from "react-native";
+import {Image, Platform, ScrollView, View} from "react-native";
 import i18n from "i18n-js";
 import CustomModal from "../../components/CustomModal";
 import {Avatar, IconButton, List, RadioButton, Searchbar, Subheading, Text, Title, withTheme} from "react-native-paper";
 
 
     /**
-     * Set the sort mode from state when components are ready
+     * Creates the header content
      */
     componentDidMount() {
-        const button = this.getSortMenu.bind(this);
+        const button = this.getSortMenuButton.bind(this);
         const title = this.getSearchBar.bind(this);
         this.props.navigation.setOptions({
             headerRight: button,
     }
 
     /**
-     * Set the current sort mode.
+     * Gets the header search bar
+     *
+     * @return {*}
+     */
+    getSearchBar() {
+        return (
+            <Searchbar
+                placeholder={i18n.t('proximoScreen.search')}
+                onChangeText={this.onSearchStringChange}
+            />
+        );
+    }
+
+    /**
+     * Gets the sort menu header button
+     *
+     * @return {*}
+     */
+    getSortMenuButton() {
+        return (
+            <IconButton
+                icon="sort"
+                color={this.colors.text}
+                size={26}
+                onPress={this.onSortMenuPress}
+            />
+        );
+    }
+
+    /**
+     * Callback used when clicking on the sort menu button.
+     * It will open the modal to show a sort selection
+     */
+    onSortMenuPress() {
+        this.setState({
+            modalCurrentDisplayItem: this.getModalSortMenu()
+        });
+        if (this.modalRef) {
+            this.modalRef.open();
+        }
+    }
+
+    /**
+     * Sets the current sort mode.
      *
      * @param mode The number representing the mode
      */
         }
     }
 
-    getSearchBar() {
-        return (
-            <Searchbar
-                placeholder={i18n.t('proximoScreen.search')}
-                onChangeText={this.onSearchStringChange}
-            />
-        );
-    }
-
     /**
-     * get color depending on quantity available
+     * Gets a color depending on the quantity available
      *
-     * @param availableStock
+     * @param availableStock The quantity available
      * @return
      */
     getStockColor(availableStock: number) {
         return color;
     }
 
-    sanitizeString(str: string) {
+    /**
+     * Sanitizes the given string to improve search performance
+     *
+     * @param str The string to sanitize
+     * @return {string} The sanitized string
+     */
+    sanitizeString(str: string): 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 only articles whose name contains the given string.
+     * Case and accents insensitive.
+     *
+     * @param str The string used to filter article names
      * @returns {[]}
      */
     filterData(str: string) {
         return filteredData;
     }
 
+    /**
+     * Callback used when the search changes
+     *
+     * @param str The new search string
+     */
     onSearchStringChange(str: string) {
         this.setState({
             currentlyDisplayedData: this.filterData(str)
         })
     }
 
+    /**
+     * Gets the modal content depending on the given article
+     *
+     * @param item The article to display
+     * @return {*}
+     */
     getModalItemContent(item: Object) {
         return (
             <View style={{
         );
     }
 
+    /**
+     * Gets the modal content to display a sort menu
+     *
+     * @return {*}
+     */
     getModalSortMenu() {
         return (
             <View style={{
         );
     }
 
+    /**
+     * Callback used when clicking an article in the list.
+     * It opens the modal to show detailed information about the article
+     *
+     * @param item The article pressed
+     */
     onListItemPress(item: Object) {
         this.setState({
             modalCurrentDisplayItem: this.getModalItemContent(item)
         }
     }
 
-    onSortMenuPress() {
-        this.setState({
-            modalCurrentDisplayItem: this.getModalSortMenu()
-        });
-        if (this.modalRef) {
-            this.modalRef.open();
-        }
-    }
-
-    getSortMenu() {
-        return (
-            <IconButton
-                icon="sort"
-                color={this.colors.text}
-                size={26}
-                onPress={this.onSortMenuPress}
-            />
-        );
-    }
-
+    /**
+     * Gets a render item for the given article
+     *
+     * @param item The article to render
+     * @return {*}
+     */
     renderItem({item}: Object) {
         const onPress = this.onListItemPress.bind(this, item);
         return (
         );
     }
 
+    /**
+     * Extracts a key for the given article
+     *
+     * @param item The article to extract the key from
+     * @return {*} The extracted key
+     */
     keyExtractor(item: Object) {
         return item.name + item.code;
     }
 
+    /**
+     * Callback used when receiving the modal ref
+     *
+     * @param ref
+     */
     onModalRef(ref: Object) {
         this.modalRef = ref;
     }

screens/Proximo/ProximoMainScreen.js

 }
 
 /**
- * Class defining the main proximo screen. This screen shows the different categories of articles
- * offered by proximo.
+ * Class defining the main proximo screen.
+ * This screen shows the different categories of articles offered by proximo.
  */
 class ProximoMainScreen extends React.Component<Props, State> {
 
         this.colors = props.theme.colors;
     }
 
+    /**
+     * Function used to sort items in the list.
+     * Makes the All category stick to the top and sorts the others by name ascending
+     *
+     * @param a
+     * @param b
+     * @return {number}
+     */
     static sortFinalData(a: Object, b: Object) {
         let str1 = a.type.name.toLowerCase();
         let str2 = b.type.name.toLowerCase();
         return 0;
     }
 
+    /**
+     * Creates header button
+     */
     componentDidMount() {
-        const rightButton = this.getRightButton.bind(this);
+        const rightButton = this.getHeaderButtons.bind(this);
         this.props.navigation.setOptions({
             headerRight: rightButton,
         });
     }
 
+    /**
+     * Callback used when the search button is pressed.
+     * This will open a new ProximoListScreen with all items displayed
+     */
+    onPressSearchBtn() {
+        let searchScreenData = {
+            shouldFocusSearchBar: true,
+            data: {
+                type: {
+                    id: "0",
+                    name: i18n.t('proximoScreen.all'),
+                    icon: 'star'
+                },
+                data: this.articles !== undefined ?
+                    this.getAvailableArticles(this.articles, undefined) : []
+            },
+        };
+        this.props.navigation.navigate('ProximoListScreen', searchScreenData);
+    }
+
+    /**
+     * Callback used when the about button is pressed.
+     * This will open the ProximoAboutScreen
+     */
+    onPressAboutBtn() {
+        this.props.navigation.navigate('ProximoAboutScreen');
+    }
+
+    /**
+     * Gets the header buttons
+     * @return {*}
+     */
+    getHeaderButtons() {
+        return (
+            <View
+                style={{
+                    flexDirection: 'row',
+                }}>
+                <HeaderButton icon={'magnify'} onPress={this.onPressSearchBtn}/>
+                <HeaderButton icon={'information'} onPress={this.onPressAboutBtn}/>
+            </View>
+        );
+    }
+
+    /**
+     * Extracts a key for the given category
+     *
+     * @param item The category to extract the key from
+     * @return {*} The extracted key
+     */
     getKeyExtractor(item: Object) {
         return item !== undefined ? item.type['id'] : undefined;
     }
 
+    /**
+     * Creates the dataset to be used in the FlatList
+     *
+     * @param fetchedData
+     * @return {*}
+     * */
     createDataset(fetchedData: Object) {
         return [
             {
         return availableArticles;
     }
 
-    onPressSearchBtn() {
-        let searchScreenData = {
-            shouldFocusSearchBar: true,
-            data: {
-                type: {
-                    id: "0",
-                    name: i18n.t('proximoScreen.all'),
-                    icon: 'star'
-                },
-                data: this.articles !== undefined ?
-                    this.getAvailableArticles(this.articles, undefined) : []
-            },
-        };
-        this.props.navigation.navigate('ProximoListScreen', searchScreenData);
-    }
-
-    onPressAboutBtn() {
-        this.props.navigation.navigate('ProximoAboutScreen');
-    }
-
-    getRightButton() {
-        return (
-            <View
-                style={{
-                    flexDirection: 'row',
-                }}>
-                <HeaderButton icon={'magnify'} onPress={this.onPressSearchBtn}/>
-                <HeaderButton icon={'information'} onPress={this.onPressAboutBtn}/>
-            </View>
-        );
-    }
-
-
+    /**
+     * Gets the given category render item
+     *
+     * @param item The category to render
+     * @return {*}
+     */
     getRenderItem({item}: Object) {
         let dataToSend = {
             shouldFocusSearchBar: false,

screens/Proxiwash/ProxiwashAboutScreen.js

 };
 
 /**
- * Class defining an about screen. This screen shows the user information about the app and it's author.
+ * Class defining the proxiwash about screen.
  */
 export default class ProxiwashAboutScreen extends React.Component<Props> {
 

screens/Proxiwash/ProxiwashScreen.js

         refreshing: false,
         firstLoading: true,
         fetchedData: {},
-        // machinesWatched: JSON.parse(dataString),
         machinesWatched: [],
         modalCurrentDisplayItem: null,
         bannerVisible: AsyncStorageManager.getInstance().preferences.proxiwashShowBanner.current === '1',
         this.colors = props.theme.colors;
     }
 
+    /**
+     * Callback used when closing the banner.
+     * This hides the banner and saves to preferences to prevent it from reopening
+     */
     onHideBanner() {
         this.setState({bannerVisible: false});
         AsyncStorageManager.getInstance().savePref(
      * Setup notification channel for android and add listeners to detect notifications fired
      */
     componentDidMount() {
-        const rightButton = this.getRightButton.bind(this);
+        const rightButton = this.getAboutButton.bind(this);
         this.props.navigation.setOptions({
             headerRight: rightButton,
         });
         }
     }
 
-    getDryersKeyExtractor(item: Object) {
-        return item !== undefined ? "dryer" + item.number : undefined;
+    /**
+     * Callback used when pressing the about button.
+     * This will open the ProxiwashAboutScreen.
+     */
+    onAboutPress() {
+        this.props.navigation.navigate('ProxiwashAboutScreen');
     }
 
-    getWashersKeyExtractor(item: Object) {
-        return item !== undefined ? "washer" + item.number : undefined;
+    /**
+     * Gets the about header button
+     *
+     * @return {*}
+     */
+    getAboutButton() {
+        return <HeaderButton icon={'information'} onPress={this.onAboutPress}/>;
     }
 
     /**
-     * Setup notifications for the machine with the given ID.
+     * Extracts the key for the given item
+     *
+     * @param item The item to extract the key from
+     * @return {*} The extracted key
+     */
+    getKeyExtractor(item: Object) {
+        return item !== undefined ? item.number : undefined;
+    }
+
+    /**
+     * Setups notifications for the machine with the given ID.
      * One notification will be sent at the end of the program.
      * Another will be send a few minutes before the end, based on the value of reminderNotifTime
      *
         }
     }
 
+    /**
+     * Shows a warning telling the user notifications are disabled for the app
+     */
     showNotificationsDisabledWarning() {
         Alert.alert(
             i18n.t("proxiwashScreen.modal.notificationErrorTitle"),
     }
 
     /**
-     * Stop scheduled notifications for the machine of the given ID.
+     * Stops scheduled notifications for the machine of the given ID.
      * This will also remove the notification if it was already shown.
      *
      * @param machineId The machine's ID
     }
 
     /**
-     * Add the given notifications associated to a machine ID to the watchlist, and save the array to the preferences
+     * Adds the given notifications associated to a machine ID to the watchlist, and saves the array to the preferences
      *
      * @param machineId
      */
     }
 
     /**
-     * remove the given index from the watchlist array and save it to preferences
+     * Removes the given index from the watchlist array and saves it to preferences
      *
      * @param index
      */
     }
 
     /**
-     * Set the given data as the watchlist and save it to preferences
+     * Sets the given data as the watchlist
      *
      * @param data
      */
     updateNotificationState(data: Array<Object>) {
         this.setState({machinesWatched: data});
-        // let prefKey = AsyncStorageManager.getInstance().preferences.proxiwashWatchedMachines.key;
-        // AsyncStorageManager.getInstance().savePref(prefKey, JSON.stringify(data));
     }
 
     /**
         return this.state.machinesWatched.indexOf(machineID) !== -1;
     }
 
+    /**
+     * Creates the dataset to be used by the flatlist
+     *
+     * @param fetchedData
+     * @return {*}
+     */
     createDataset(fetchedData: Object) {
         let data = fetchedData;
         if (AprilFoolsManager.getInstance().isAprilFoolsEnabled()) {
                 icon: 'tumble-dryer',
                 data: data.dryers === undefined ? [] : data.dryers,
                 extraData: this.state,
-                keyExtractor: this.getDryersKeyExtractor
+                keyExtractor: this.getKeyExtractor
             },
             {
                 title: i18n.t('proxiwashScreen.washers'),
                 icon: 'washing-machine',
                 data: data.washers === undefined ? [] : data.washers,
                 extraData: this.state,
-                keyExtractor: this.getWashersKeyExtractor
+                keyExtractor: this.getKeyExtractor
             },
         ];
     }
 
+    /**
+     * Shows a modal for the given item
+     *
+     * @param title The title to use
+     * @param item The item to display information for in the modal
+     * @param isDryer True if the given item is a dryer
+     */
     showModal(title: string, item: Object, isDryer: boolean) {
         this.setState({
             modalCurrentDisplayItem: this.getModalContent(title, item, isDryer)
         }
     }
 
+    /**
+     * Callback used when the user clicks on enable notifications for a machine
+     *
+     * @param machineId The machine's id to set notifications for
+     */
     onSetupNotificationsPress(machineId: string) {
         if (this.modalRef) {
             this.modalRef.close();
         this.setupNotifications(machineId)
     }
 
+    /**
+     * Generates the modal content.
+     * This shows information for the given machine.
+     *
+     * @param title The title to use
+     * @param item The item to display information for in the modal
+     * @param isDryer True if the given item is a dryer
+     * @return {*}
+     */
     getModalContent(title: string, item: Object, isDryer: boolean) {
         let button = {
             text: i18n.t("proxiwashScreen.modal.ok"),
         );
     }
 
-    onAboutPress() {
-        this.props.navigation.navigate('ProxiwashAboutScreen');
-    }
-
-    getRightButton() {
-        return (
-            <HeaderButton icon={'information'} onPress={this.onAboutPress}/>
-        );
-    }
-
+    /**
+     * Callback used when receiving modal ref
+     *
+     * @param ref
+     */
     onModalRef(ref: Object) {
         this.modalRef = ref;
     }
 
+    /**
+     * Gets the number of machines available
+     *
+     * @param isDryer True if we are only checking for dryer, false for washers
+     * @return {number} The number of machines available
+     */
     getMachineAvailableNumber(isDryer: boolean) {
         let data;
         if (isDryer)
         return count;
     }
 
+    /**
+     * Gets the section render item
+     *
+     * @param section The section to render
+     * @return {*}
+     */
     getRenderSectionHeader({section}: Object) {
         const isDryer = section.title === i18n.t('proxiwashScreen.dryers');
         const nbAvailable = this.getMachineAvailableNumber(isDryer);
     }
 
     /**
-     * Get list item to be rendered
+     * Gets the list item to be rendered
      *
      * @param item The object containing the item's FetchedData
      * @param section The object describing the current SectionList section
                     refreshOnFocus={true}
                     updateData={this.state.machinesWatched.length}/>
             </View>
-
         );
     }
 }

screens/SelfMenuScreen.js

 
 /**
  * Class defining the app's menu screen.
- * This screen fetches data from etud to render the RU menu
  */
 class SelfMenuScreen extends React.Component<Props> {
 
         this.colors = props.theme.colors;
     }
 
+    /**
+     * Extract a key for the given item
+     *
+     * @param item The item to extract the key from
+     * @return {*} The extracted key
+     */
     getKeyExtractor(item: Object) {
         return item !== undefined ? item['name'] : undefined;
     }
 
+    /**
+     * Creates the dataset to be used in the FlatList
+     *
+     * @param fetchedData
+     * @return {[]}
+     */
     createDataset(fetchedData: Object) {
         let result = [];
         // Prevent crash by giving a default value when fetchedData is empty (not yet available)
         return result
     }
 
+    /**
+     * Gets the render section header
+     *
+     * @param section The section to render the header from
+     * @return {*}
+     */
     getRenderSectionHeader({section}: Object) {
         return (
             <Card style={{
         );
     }
 
+    /**
+     * Gets a FlatList render item
+     *
+     * @param item The item to render
+     * @return {*}
+     */
     getRenderItem({item}: Object) {
         return (
             <Card style={{
         );
     }
 
+    /**
+     * Formats the given string to make sure it starts with a capital letter
+     *
+     * @param name The string to format
+     * @return {string} The formatted string
+     */
     formatName(name: String) {
         return name.charAt(0) + name.substr(1).toLowerCase();
     }

screens/SettingsScreen.js

     state = {
         nightMode: ThemeManager.getNightMode(),
         nightModeFollowSystem: AsyncStorageManager.getInstance().preferences.nightModeFollowSystem.current === '1' &&
-        Appearance.getColorScheme() !== 'no-preference',
+            Appearance.getColorScheme() !== 'no-preference',
         proxiwashNotifPickerSelected: AsyncStorageManager.getInstance().preferences.proxiwashNotifications.current,
         startScreenPickerSelected: AsyncStorageManager.getInstance().preferences.defaultStartScreen.current,
     };
     }
 
     /**
-     * Save the value for the proxiwash reminder notification time
+     * Saves the value for the proxiwash reminder notification time
      *
      * @param value The value to store
      */
     }
 
     /**
-     * Save the value for the proxiwash reminder notification time
+     * Saves the value for the proxiwash reminder notification time
      *
      * @param value The value to store
      */
     }
 
     /**
-     * Toggle night mode and save it to preferences
+     * Toggles night mode and saves it to preferences
      */
     onToggleNightMode() {
         ThemeManager.getInstance().setNightMode(!this.state.nightMode);
     }
 
     /**
-     * Get a list item using a checkbox control
+     * Gets a list item using a checkbox control
      *
      * @param onPressCallback The callback when the checkbox state changes
      * @param icon The icon name to display on the list item
                         ) : null}
                         {
                             Appearance.getColorScheme() === 'no-preference' || !this.state.nightModeFollowSystem ?
-                            this.getToggleItem(
-                                this.onToggleNightMode,
-                                'theme-light-dark',
-                                i18n.t('settingsScreen.nightMode'),
-                                this.state.nightMode ?
-                                    i18n.t('settingsScreen.nightModeSubOn') :
-                                    i18n.t('settingsScreen.nightModeSubOff'),
-                                this.state.nightMode
-                            ) : null
+                                this.getToggleItem(
+                                    this.onToggleNightMode,
+                                    'theme-light-dark',
+                                    i18n.t('settingsScreen.nightMode'),
+                                    this.state.nightMode ?
+                                        i18n.t('settingsScreen.nightModeSubOn') :
+                                        i18n.t('settingsScreen.nightModeSubOff'),
+                                    this.state.nightMode
+                                ) : null
                         }
                         <List.Accordion
                             title={i18n.t('settingsScreen.startScreen')}
                         </List.Accordion>
                     </List.Section>
                 </Card>
-
             </ScrollView>
         );
     }

screens/Websites/AvailableRoomScreen.js

 const CUSTOM_CSS_GENERAL = 'https://etud.insa-toulouse.fr/~amicale_app/custom_css/rooms/customMobile.css';
 
 /**
- * Class defining the app's planex screen.
- * This screen uses a webview to render the planex page
+ * Class defining the app's available rooms screen.
+ * This screen uses a webview to render the page
  */
 export default class AvailableRoomScreen extends React.Component<Props> {
 
     customInjectedJS: string;
-    customBibInjectedJS: string;
 
+    /**
+     * Defines custom injected JavaScript to improve the page display on mobile
+     */
     constructor() {
         super();
         this.customInjectedJS =

screens/Websites/BibScreen.js

 const CUSTOM_CSS_Bib = 'https://etud.insa-toulouse.fr/~amicale_app/custom_css/rooms/customBibMobile.css';
 
 /**
- * Class defining the app's planex screen.
- * This screen uses a webview to render the planex page
+ * Class defining the app's Bib screen.
+ * This screen uses a webview to render the page
  */
 export default class AvailableRoomScreen extends React.Component<Props> {
 
     customInjectedJS: string;
     customBibInjectedJS: string;
 
+    /**
+     * Defines custom injected JavaScript to improve the page display on mobile
+     */
     constructor() {
         super();
         this.customInjectedJS =

screens/Websites/PlanexScreen.js

     '    removeAlpha($(this));\n' +
     '});';
 /**
- * Class defining the app's planex screen.
- * This screen uses a webview to render the planex page
+ * Class defining the app's Planex screen.
+ * This screen uses a webview to render the page
  */
 export default class PlanexScreen extends React.Component<Props, State> {
 
     customInjectedJS: string;
     onHideBanner: Function;
     onGoToSettings: Function;
+    state = {
+        bannerVisible:
+            AsyncStorageManager.getInstance().preferences.planexShowBanner.current === '1' &&
+            AsyncStorageManager.getInstance().preferences.defaultStartScreen.current !== 'Planex',
+    };
 
+    /**
+     * Defines custom injected JavaScript to improve the page display on mobile
+     */
     constructor() {
         super();
         this.customInjectedJS =
 
         this.customInjectedJS +=
             'removeAlpha();' +
-            '});true;'; // Prevent crash on ios
+            '});true;'; // Prevents crash on ios
         this.onHideBanner = this.onHideBanner.bind(this);
         this.onGoToSettings = this.onGoToSettings.bind(this);
     }
 
-    state = {
-        bannerVisible:
-            AsyncStorageManager.getInstance().preferences.planexShowBanner.current === '1' &&
-            AsyncStorageManager.getInstance().preferences.defaultStartScreen.current !== 'Planex',
-    };
-
+    /**
+     * Callback used when closing the banner.
+     * This hides the banner and saves to preferences to prevent it from reopening
+     */
     onHideBanner() {
         this.setState({bannerVisible: false});
         AsyncStorageManager.getInstance().savePref(
         );
     }
 
+    /**
+     * Callback used when the used click on the navigate to settings button.
+     * This will hide the banner and open the SettingsScreen
+     *
+     */
     onGoToSettings() {
         this.onHideBanner();
         this.props.navigation.navigate('SettingsScreen');

utils/AsyncStorageManager.js

             default: '5',
             current: '',
         },
-        proxiwashWatchedMachines: {
-            key: 'proxiwashWatchedMachines',
-            default: '[]',
-            current: '',
-        },
         nightModeFollowSystem: {
             key: 'nightModeFollowSystem',
             default: '1',