Use expo web browser for drawer links

components/Sidebar.js

@@ -6,6 +6,7 @@ import {Badge, Container, Left, ListItem, Right, Text} from "native-base";
 import i18n from "i18n-js";
 import CustomMaterialIcon from '../components/CustomMaterialIcon';
 import ThemeManager from "../utils/ThemeManager";
+import * as WebBrowser from 'expo-web-browser';
 
 const deviceWidth = Dimensions.get("window").width;
 
@@ -48,21 +49,25 @@ export default class SideBar extends React.Component<Props, State> {
             {
                 name: "Amicale",
                 route: "AmicaleScreen",
+                link: "https://amicale-insat.fr/",
                 icon: "alpha-a-box",
             },
             {
                 name: "Élus Étudiants",
                 route: "ElusEtudScreen",
+                link: "https://etud.insa-toulouse.fr/~eeinsat/",
                 icon: "alpha-e-box",
             },
             {
                 name: "Wiketud",
                 route: "WiketudScreen",
+                link: "https://wiki.etud.insa-toulouse.fr",
                 icon: "wikipedia",
             },
             {
                 name: "Tutor'INSA",
                 route: "TutorInsaScreen",
+                link: "https://www.etud.insa-toulouse.fr/~tutorinsa/",
                 icon: "school",
             },
             {
@@ -72,11 +77,13 @@ export default class SideBar extends React.Component<Props, State> {
             {
                 name: i18n.t('screens.bluemind'),
                 route: "BlueMindScreen",
+                link: "https://etud-mel.insa-toulouse.fr/webmail/",
                 icon: "email",
             },
             {
                 name: i18n.t('screens.ent'),
                 route: "EntScreen",
+                link: "https://ent.insa-toulouse.fr/",
                 icon: "notebook",
             },
             {
@@ -112,8 +119,11 @@ export default class SideBar extends React.Component<Props, State> {
     }
 
 
-    onListItemPress(route: string) {
+    onListItemPress(item: Object) {
-        this.props.navigation.navigate(route);
+        if (item.link === undefined)
+            this.props.navigation.navigate(item.route);
+        else
+            WebBrowser.openBrowserAsync(item.link);
     }
 
 
@@ -123,7 +133,7 @@ export default class SideBar extends React.Component<Props, State> {
 
 
     getRenderItem({item}: Object) {
-        const onListItemPress = this.onListItemPress.bind(this, item.route);
+        const onListItemPress = this.onListItemPress.bind(this, item);
 
         if (item.icon !== undefined) {
             return (

navigation/DrawerNavigator.js

@@ -7,12 +7,6 @@ import SettingsScreen from '../screens/SettingsScreen';
 import AboutScreen from '../screens/About/AboutScreen';
 import AboutDependenciesScreen from '../screens/About/AboutDependenciesScreen';
 import SelfMenuScreen from '../screens/SelfMenuScreen';
-import TutorInsaScreen from "../screens/Websites/TutorInsaScreen";
-import AmicaleScreen from "../screens/Websites/AmicaleScreen";
-import WiketudScreen from "../screens/Websites/WiketudScreen";
-import ElusEtudScreen from "../screens/Websites/ElusEtudScreen";
-import BlueMindScreen from "../screens/Websites/BlueMindScreen";
-import EntScreen from "../screens/Websites/EntScreen";
 import AvailableRoomScreen from "../screens/Websites/AvailableRoomScreen";
 import DebugScreen from '../screens/DebugScreen';
 import Sidebar from "../components/Sidebar";
@@ -83,30 +77,6 @@ export default function DrawerNavigator() {
                 name="SelfMenuScreen"
                 component={SelfMenuScreen}
             />
-            <Drawer.Screen
-                name="TutorInsaScreen"
-                component={TutorInsaScreen}
-            />
-            <Drawer.Screen
-                name="AmicaleScreen"
-                component={AmicaleScreen}
-            />
-            <Drawer.Screen
-                name="WiketudScreen"
-                component={WiketudScreen}
-            />
-            <Drawer.Screen
-                name="ElusEtudScreen"
-                component={ElusEtudScreen}
-            />
-            <Drawer.Screen
-                name="BlueMindScreen"
-                component={BlueMindScreen}
-            />
-            <Drawer.Screen
-                name="EntScreen"
-                component={EntScreen}
-            />
             <Drawer.Screen
                 name="AvailableRoomScreen"
                 component={AvailableRoomScreen}

navigation/MainTabNavigator.js

@@ -143,7 +143,7 @@ const Tab = createMaterialBottomTabNavigator();
 export default function TabNavigator() {
     return (
         <Tab.Navigator
-            initialRouteName={AsyncStorageManager.getInstance().preferences.defaultStartScreen}
+            initialRouteName={AsyncStorageManager.getInstance().preferences.defaultStartScreen.current}
             barStyle={{backgroundColor: ThemeManager.getCurrentThemeVariables().brandPrimary}}
             screenOptions={({ route }) => ({
                 tabBarIcon: ({ focused, color, size }) => {

screens/Websites/AmicaleScreen.js

@@ -1,38 +0,0 @@
-// @flow
-
-import * as React from 'react';
-import WebViewScreen from "../../components/WebViewScreen";
-
-type Props = {
-    navigation: Object,
-}
-
-
-const URL = 'https://amicale-insat.fr/';
-
-/**
- * Class defining the app's planex screen.
- * This screen uses a webview to render the planex page
- */
-export default class AmicaleScreen extends React.Component<Props> {
-
-    render() {
-        const nav = this.props.navigation;
-        return (
-            <WebViewScreen
-                navigation={nav}
-                data={[
-                    {
-                        url: URL,
-                        icon: '',
-                        name: '',
-                        customJS: ''
-                    },
-                ]}
-                headerTitle={'Amicale'}
-                hasHeaderBackButton={true}
-                hasSideMenu={false}/>
-        );
-    }
-}
-

screens/Websites/BlueMindScreen.js

@@ -1,52 +0,0 @@
-// @flow
-
-import * as React from 'react';
-import WebViewScreen from "../../components/WebViewScreen";
-import i18n from "i18n-js";
-
-type Props = {
-    navigation: Object,
-}
-
-
-const URL = 'https://etud-mel.insa-toulouse.fr/webmail/';
-
-const CUSTOM_CSS_GENERAL = 'https://etud.insa-toulouse.fr/~amicale_app/custom_css/bluemind/customMobile.css';
-
-
-/**
- * Class defining the app's planex screen.
- * This screen uses a webview to render the planex page
- */
-export default class BlueMindScreen extends React.Component<Props> {
-
-    customInjectedJS: string;
-
-    constructor() {
-        super();
-        // Breaks website on ios
-        this.customInjectedJS = '';
-            // '$("head").append(\'<meta name="viewport" content="width=device-width, initial-scale=1.0">\');' +
-            // '$("head").append(\'<link rel="stylesheet" href="' + CUSTOM_CSS_GENERAL + '" type="text/css"/>\');true;';
-    }
-
-    render() {
-        const nav = this.props.navigation;
-        return (
-            <WebViewScreen
-                navigation={nav}
-                data={[
-                    {
-                        url: URL,
-                        icon: '',
-                        name: '',
-                        customJS: this.customInjectedJS
-                    },
-                ]}
-                headerTitle={i18n.t('screens.bluemind')}
-                hasHeaderBackButton={true}
-                hasSideMenu={false}/>
-        );
-    }
-}
-

screens/Websites/ElusEtudScreen.js

@@ -1,38 +0,0 @@
-// @flow
-
-import * as React from 'react';
-import WebViewScreen from "../../components/WebViewScreen";
-
-type Props = {
-    navigation: Object,
-}
-
-
-const URL = 'https://etud.insa-toulouse.fr/~eeinsat/';
-
-/**
- * Class defining the app's planex screen.
- * This screen uses a webview to render the planex page
- */
-export default class ElusEtudScreen extends React.Component<Props> {
-
-    render() {
-        const nav = this.props.navigation;
-        return (
-            <WebViewScreen
-                navigation={nav}
-                data={[
-                    {
-                        url: URL,
-                        icon: '',
-                        name: '',
-                        customJS: ''
-                    },
-                ]}
-                headerTitle={'Élus Étudiants'}
-                hasHeaderBackButton={true}
-                hasSideMenu={false}/>
-        );
-    }
-}
-

screens/Websites/EntScreen.js

@@ -1,90 +0,0 @@
-// @flow
-
-import * as React from 'react';
-import WebViewScreen from "../../components/WebViewScreen";
-import i18n from "i18n-js";
-
-type Props = {
-    navigation: Object,
-}
-
-
-const URL = 'https://ent.insa-toulouse.fr/';
-
-const CUSTOM_CSS_GENERAL = 'https://etud.insa-toulouse.fr/~amicale_app/custom_css/ent/customMobile.css';
-
-// let stylesheet = document.createElement('link');
-// stylesheet.type = 'text/css';
-// stylesheet.rel = 'stylesheet';
-// stylesheet.href = 'https://etud.insa-toulouse.fr/~amicale_app/custom_css/ent/customMobile.css';
-// let mobileSpec = document.createElement('meta');
-// mobileSpec.name = 'viewport';
-// mobileSpec.content = 'width=device-width, initial-scale=1.0';
-// document.getElementsByTagName('head')[0].appendChild(mobileSpec);
-// // document.getElementsByTagName('head')[0].appendChild(stylesheet);
-// document.getElementsByClassName('preference-items')[0].style.display = 'none';
-// document.getElementsByClassName('logoInsa')[0].style.display = 'none';
-// document.getElementsByClassName('logoPress')[0].style.display = 'none';
-// document.getElementsByClassName('ent')[0].style.display = 'none';
-// document.getElementById('portal-page-header').style.margin = 0;
-// document.querySelectorAll('.uportal-navigation-category').forEach(element => {
-//     element.style.cssText = "width: 100%; display: flex; height: 50px;";
-//     if (element.children.length > 0)
-//         element.children[0].style.margin = 'auto';
-// });
-// true;
-
-
-/**
- * Class defining the app's ent screen.
- * This screen uses a webview to render the ent page
- */
-export default class EntScreen extends React.Component<Props> {
-
-    customInjectedJS: string;
-
-    constructor() {
-        super();
-        this.customInjectedJS =
-            'let stylesheet = document.createElement(\'link\');\n' +
-            'stylesheet.type = \'text/css\';\n' +
-            'stylesheet.rel = \'stylesheet\';\n' +
-            'stylesheet.href = \'' + CUSTOM_CSS_GENERAL + '\';\n' +
-            'let mobileSpec = document.createElement(\'meta\');\n' +
-            'mobileSpec.name = \'viewport\';\n' +
-            'mobileSpec.content = \'width=device-width, initial-scale=1.0\';\n' +
-            'document.getElementsByTagName(\'head\')[0].appendChild(mobileSpec);\n' +
-            'document.getElementsByTagName(\'head\')[0].appendChild(stylesheet);\n' +
-            'document.getElementsByClassName(\'preference-items\')[0].style.display = \'none\';\n' +
-            'document.getElementsByClassName(\'logoInsa\')[0].style.display = \'none\';\n' +
-            'document.getElementsByClassName(\'logoPress\')[0].style.display = \'none\';\n' +
-            'document.getElementsByClassName(\'ent\')[0].style.display = \'none\';\n' +
-            'document.getElementById(\'portal-page-header\').style.margin = 0;\n' +
-            'document.querySelectorAll(\'.uportal-navigation-category\').forEach(element => {\n' +
-            '    element.style.cssText = "width: 100%; display: flex; height: 50px;";\n' +
-            '    if (element.children.length > 0)\n' +
-            '        element.children[0].style.margin = \'auto\';\n' +
-            '});' +
-            'true;';
-    }
-
-    render() {
-        const nav = this.props.navigation;
-        return (
-            <WebViewScreen
-                navigation={nav}
-                data={[
-                    {
-                        url: URL,
-                        icon: '',
-                        name: '',
-                        customJS: this.customInjectedJS
-                    },
-                ]}
-                headerTitle={i18n.t('screens.ent')}
-                hasHeaderBackButton={true}
-                hasSideMenu={false}/>
-        );
-    }
-}
-

screens/Websites/TutorInsaScreen.js

@@ -1,38 +0,0 @@
-// @flow
-
-import * as React from 'react';
-import WebViewScreen from "../../components/WebViewScreen";
-
-type Props = {
-    navigation: Object,
-}
-
-
-const URL = 'https://www.etud.insa-toulouse.fr/~tutorinsa/';
-
-/**
- * Class defining the app's planex screen.
- * This screen uses a webview to render the planex page
- */
-export default class TutorInsaScreen extends React.Component<Props> {
-
-    render() {
-        const nav = this.props.navigation;
-        return (
-            <WebViewScreen
-                navigation={nav}
-                data={[
-                    {
-                        url: URL,
-                        icon: '',
-                        name: '',
-                        customJS: ''
-                    },
-                ]}
-                headerTitle={'Tutor\'INSA'}
-                hasHeaderBackButton={true}
-                hasSideMenu={false}/>
-        );
-    }
-}
-

screens/Websites/WiketudScreen.js

@@ -1,38 +0,0 @@
-// @flow
-
-import * as React from 'react';
-import WebViewScreen from "../../components/WebViewScreen";
-
-type Props = {
-    navigation: Object,
-}
-
-
-const URL = 'https://wiki.etud.insa-toulouse.fr/';
-
-/**
- * Class defining the app's planex screen.
- * This screen uses a webview to render the planex page
- */
-export default class WiketudScreen extends React.Component<Props> {
-
-    render() {
-        const nav = this.props.navigation;
-        return (
-            <WebViewScreen
-                navigation={nav}
-                data={[
-                    {
-                        url: URL,
-                        icon: '',
-                        name: '',
-                        customJS: ''
-                    },
-                ]}
-                headerTitle={'Wiketud'}
-                hasHeaderBackButton={true}
-                hasSideMenu={false}/>
-        );
-    }
-}
-