From 009a07e83a1239dc8c70c7fc1a97978cd7d6cdd4 Mon Sep 17 00:00:00 2001
From: enahum <nahumhbl@gmail.com>
Date: Thu, 18 May 2017 12:51:40 -0400
Subject: [PATCH] GitLab login (#552)

---
 app/constants/view.js                      |   5 ++-
 app/mattermost.js                          |   5 ++-
 app/reducers/navigation/index.js           |   4 +-
 app/screens/index.js                       |   4 +-
 app/screens/login_options/index.js         |   3 +-
 app/screens/login_options/login_options.js |  44 +++++++++++++++++---
 app/screens/select_server/index.js         |   3 +-
 app/screens/select_server/select_server.js |   9 ++--
 app/screens/{saml => sso}/index.js         |   4 +-
 app/screens/{saml/saml.js => sso/sso.js}   |  46 ++++++++++++++++-----
 assets/base/i18n/en.json                   |   2 +-
 assets/base/images/gitlab.png              | Bin 0 -> 665 bytes
 12 files changed, 101 insertions(+), 28 deletions(-)
 rename app/screens/{saml => sso}/index.js (88%)
 rename app/screens/{saml/saml.js => sso/sso.js} (69%)
 create mode 100644 assets/base/images/gitlab.png

diff --git a/app/constants/view.js b/app/constants/view.js
index b90031ef4..6851ccf95 100644
--- a/app/constants/view.js
+++ b/app/constants/view.js
@@ -35,7 +35,10 @@ const ViewTypes = keyMirror({
 
     SET_CHANNEL_LOADER: null,
 
-    SET_LAST_CHANNEL_FOR_TEAM: null
+    SET_LAST_CHANNEL_FOR_TEAM: null,
+
+    GITLAB: null,
+    SAML: null
 });
 
 export default ViewTypes;
diff --git a/app/mattermost.js b/app/mattermost.js
index 44d7785aa..854071e22 100644
--- a/app/mattermost.js
+++ b/app/mattermost.js
@@ -15,7 +15,7 @@ import {
 import DeviceInfo from 'react-native-device-info';
 import semver from 'semver';
 
-import {setAppState, setDeviceToken} from 'mattermost-redux/actions/general';
+import {setAppState, setDeviceToken, setServerVersion} from 'mattermost-redux/actions/general';
 import {logout} from 'mattermost-redux/actions/users';
 import {Client4} from 'mattermost-redux/client';
 import {General} from 'mattermost-redux/constants';
@@ -64,14 +64,17 @@ export default class Mattermost {
                     }]
                 );
             } else {
+                setServerVersion('')(dispatch, getState);
                 loadConfigAndLicense(serverVersion)(dispatch, getState);
             }
         }
     };
 
     handleReset = () => {
+        const {dispatch, getState} = store;
         Client4.serverVersion = '';
         PushNotification.cancelAllLocalNotifications();
+        setServerVersion('')(dispatch, getState);
         this.startApp('fade');
     };
 
diff --git a/app/reducers/navigation/index.js b/app/reducers/navigation/index.js
index 47847dfc6..b6dc942f7 100644
--- a/app/reducers/navigation/index.js
+++ b/app/reducers/navigation/index.js
@@ -8,7 +8,9 @@ import EventEmitter from 'mattermost-redux/utils/event_emitter';
 export default function(state = '', action) {
     switch (action.type) {
     case UserTypes.LOGOUT_SUCCESS:
-        EventEmitter.emit(NavigationTypes.NAVIGATION_RESET);
+        setTimeout(() => {
+            EventEmitter.emit(NavigationTypes.NAVIGATION_RESET);
+        });
         break;
     }
 
diff --git a/app/screens/index.js b/app/screens/index.js
index 028f079cc..f5980dbad 100644
--- a/app/screens/index.js
+++ b/app/screens/index.js
@@ -23,7 +23,7 @@ import MoreDirectMessages from 'app/screens/more_dms';
 import Notification from 'app/screens/notification';
 import OptionsModal from 'app/screens/options_modal';
 import Root from 'app/screens/root';
-import Saml from 'app/screens/saml';
+import SSO from 'app/screens/sso';
 import SelectServer from 'app/screens/select_server';
 import SelectTeam from 'app/screens/select_team';
 import Settings from 'app/screens/settings';
@@ -63,10 +63,10 @@ export function registerScreens(store, Provider) {
     Navigation.registerComponent('OptionsModal', () => wrapWithContextProvider(OptionsModal), store, Provider);
     Navigation.registerComponent('Notification', () => Notification, store, Provider);
     Navigation.registerComponent('Root', () => Root, store, Provider);
-    Navigation.registerComponent('SAML', () => wrapWithContextProvider(Saml), store, Provider);
     Navigation.registerComponent('SelectServer', () => wrapWithContextProvider(SelectServer), store, Provider);
     Navigation.registerComponent('SelectTeam', () => wrapWithContextProvider(SelectTeam), store, Provider);
     Navigation.registerComponent('Settings', () => wrapWithContextProvider(Settings), store, Provider);
+    Navigation.registerComponent('SSO', () => wrapWithContextProvider(SSO), store, Provider);
     Navigation.registerComponent('Thread', () => wrapWithContextProvider(Thread), store, Provider);
     Navigation.registerComponent('UserProfile', () => wrapWithContextProvider(UserProfile), store, Provider);
 }
diff --git a/app/screens/login_options/index.js b/app/screens/login_options/index.js
index f18df6ffd..79ea4d866 100644
--- a/app/screens/login_options/index.js
+++ b/app/screens/login_options/index.js
@@ -8,11 +8,12 @@ import {getTheme} from 'app/selectors/preferences';
 import LoginOptions from './login_options';
 
 function mapStateToProps(state, ownProps) {
-    const {config, license} = state.entities.general;
+    const {config, license, serverVersion} = state.entities.general;
     return {
         ...ownProps,
         config,
         license,
+        serverVersion,
         theme: getTheme(state)
     };
 }
diff --git a/app/screens/login_options/login_options.js b/app/screens/login_options/login_options.js
index 768a246cd..6a6f147f9 100644
--- a/app/screens/login_options/login_options.js
+++ b/app/screens/login_options/login_options.js
@@ -10,12 +10,15 @@ import {
     Text,
     View
 } from 'react-native';
-
 import Button from 'react-native-button';
+import semver from 'semver';
+
+import {ViewTypes} from 'app/constants';
 import FormattedText from 'app/components/formatted_text';
 import {GlobalStyles} from 'app/styles';
 import {preventDoubleTap} from 'app/utils/tap';
 
+import gitlab from 'assets/images/gitlab.png';
 import logo from 'assets/images/logo.png';
 
 class LoginOptions extends PureComponent {
@@ -24,6 +27,7 @@ class LoginOptions extends PureComponent {
         navigator: PropTypes.object,
         config: PropTypes.object.isRequired,
         license: PropTypes.object.isRequired,
+        serverVersion: PropTypes.string.isRequired,
         theme: PropTypes.object
     };
 
@@ -43,11 +47,11 @@ class LoginOptions extends PureComponent {
         });
     };
 
-    goToSaml = () => {
+    goToSSO = (ssoType) => {
         const {intl, navigator, theme} = this.props;
         navigator.push({
-            screen: 'SAML',
-            title: intl.formatMessage({id: 'mobile.routes.saml', defaultMessage: 'Single SignOn'}),
+            screen: 'SSO',
+            title: intl.formatMessage({id: 'mobile.routes.sso', defaultMessage: 'Single Sign-On'}),
             animated: true,
             backButtonTitle: '',
             navigatorStyle: {
@@ -55,6 +59,9 @@ class LoginOptions extends PureComponent {
                 navBarBackgroundColor: theme.sidebarHeaderBg,
                 navBarButtonColor: theme.sidebarHeaderTextColor,
                 screenBackgroundColor: theme.centerChannelBg
+            },
+            passProps: {
+                ssoType
             }
         });
     };
@@ -80,13 +87,39 @@ class LoginOptions extends PureComponent {
         return null;
     };
 
+    renderGitlabOption = () => {
+        const {config, serverVersion} = this.props;
+        const version = serverVersion.match(/^[0-9]*.[0-9]*.[0-9]*(-[a-zA-Z0-9.-]*)?/g)[0];
+        if (config.EnableSignUpWithGitLab === 'true' && semver.valid(version) && semver.gte(version, 'v3.10.0')) {
+            return (
+                <Button
+                    key='saml'
+                    onPress={() => preventDoubleTap(this.goToSSO, this, ViewTypes.GITLAB)}
+                    containerStyle={[GlobalStyles.signupButton, {backgroundColor: '#548'}]}
+                >
+                    <Image
+                        source={gitlab}
+                        style={{height: 18, marginRight: 5, width: 18}}
+                    />
+                    <Text
+                        style={[GlobalStyles.signupButtonText, {color: 'white'}]}
+                    >
+                        {'GitLab'}
+                    </Text>
+                </Button>
+            );
+        }
+
+        return null;
+    };
+
     renderSamlOption = () => {
         const {config, license} = this.props;
         if (config.EnableSaml === 'true' && license.IsLicensed === 'true' && license.SAML === 'true') {
             return (
                 <Button
                     key='saml'
-                    onPress={() => preventDoubleTap(this.goToSaml, this)}
+                    onPress={() => preventDoubleTap(this.goToSSO, this, ViewTypes.SAML)}
                     containerStyle={[GlobalStyles.signupButton, {backgroundColor: '#34a28b'}]}
                 >
                     <Text
@@ -122,6 +155,7 @@ class LoginOptions extends PureComponent {
                     defaultMessage='Choose your login method'
                 />
                 {this.renderEmailOption()}
+                {this.renderGitlabOption()}
                 {this.renderSamlOption()}
             </View>
         );
diff --git a/app/screens/select_server/index.js b/app/screens/select_server/index.js
index 098929fa0..89f6c5057 100644
--- a/app/screens/select_server/index.js
+++ b/app/screens/select_server/index.js
@@ -14,7 +14,7 @@ import SelectServer from './select_server';
 
 function mapStateToProps(state) {
     const {config: configRequest, license: licenseRequest, server: pingRequest} = state.requests.general;
-    const {config, license} = state.entities.general;
+    const {config, license, serverVersion} = state.entities.general;
 
     const success = RequestStatus.SUCCESS;
     const transition = (pingRequest.status === success && configRequest.status === success && licenseRequest.status === success);
@@ -26,6 +26,7 @@ function mapStateToProps(state) {
         licenseRequest,
         config,
         license,
+        serverVersion,
         transition,
         theme: getTheme(state)
     };
diff --git a/app/screens/select_server/select_server.js b/app/screens/select_server/select_server.js
index b616a2f0c..c03eccf61 100644
--- a/app/screens/select_server/select_server.js
+++ b/app/screens/select_server/select_server.js
@@ -14,8 +14,8 @@ import {
     TouchableWithoutFeedback,
     View
 } from 'react-native';
-
 import Button from 'react-native-button';
+import semver from 'semver';
 
 import {RequestStatus} from 'mattermost-redux/constants';
 import {Client, Client4} from 'mattermost-redux/client';
@@ -43,6 +43,7 @@ class SelectServer extends PureComponent {
         pingRequest: PropTypes.object.isRequired,
         configRequest: PropTypes.object.isRequired,
         licenseRequest: PropTypes.object.isRequired,
+        serverVersion: PropTypes.string.isRequired,
         actions: PropTypes.shape({
             getPing: PropTypes.func.isRequired,
             resetPing: PropTypes.func.isRequired,
@@ -77,11 +78,13 @@ class SelectServer extends PureComponent {
     }
 
     handleLoginOptions = () => {
-        const {config, intl, license, theme} = this.props;
+        const {config, intl, license, serverVersion, theme} = this.props;
+        const version = serverVersion.match(/^[0-9]*.[0-9]*.[0-9]*(-[a-zA-Z0-9.-]*)?/g)[0];
         const samlEnabled = config.EnableSaml === 'true' && license.IsLicensed === 'true' && license.SAML === 'true';
+        const gitlabEnabled = config.EnableSignUpWithGitLab === 'true' && semver.valid(version) && semver.gte(version, 'v3.10.0');
 
         let options = 0;
-        if (samlEnabled) {
+        if (samlEnabled || gitlabEnabled) {
             options += 1;
         }
 
diff --git a/app/screens/saml/index.js b/app/screens/sso/index.js
similarity index 88%
rename from app/screens/saml/index.js
rename to app/screens/sso/index.js
index 571c7adec..3ffb3dbd4 100644
--- a/app/screens/saml/index.js
+++ b/app/screens/sso/index.js
@@ -9,7 +9,7 @@ import {getTheme} from 'app/selectors/preferences';
 
 import {setStoreFromLocalData} from 'mattermost-redux/actions/general';
 
-import Saml from './saml';
+import SSO from './sso';
 
 function mapStateToProps(state, ownProps) {
     return {
@@ -28,4 +28,4 @@ function mapDispatchToProps(dispatch) {
     };
 }
 
-export default connect(mapStateToProps, mapDispatchToProps)(Saml);
+export default connect(mapStateToProps, mapDispatchToProps)(SSO);
diff --git a/app/screens/saml/saml.js b/app/screens/sso/sso.js
similarity index 69%
rename from app/screens/saml/saml.js
rename to app/screens/sso/sso.js
index 9e0009ed0..6412e36ae 100644
--- a/app/screens/saml/saml.js
+++ b/app/screens/sso/sso.js
@@ -15,18 +15,37 @@ import PushNotification from 'react-native-push-notification';
 
 import {Client4} from 'mattermost-redux/client';
 
-class Saml extends PureComponent {
+import {ViewTypes} from 'app/constants';
+import Loading from 'app/components/loading';
+
+class SSO extends PureComponent {
     static propTypes = {
         intl: intlShape.isRequired,
         navigator: PropTypes.object,
         theme: PropTypes.object,
         serverUrl: PropTypes.string.isRequired,
+        ssoType: PropTypes.string.isRequired,
         actions: PropTypes.shape({
             handleSuccessfulLogin: PropTypes.func.isRequired,
             setStoreFromLocalData: PropTypes.func.isRequired
         }).isRequired
     };
 
+    constructor(props) {
+        super(props);
+
+        switch (props.ssoType) {
+        case ViewTypes.GITLAB:
+            this.loginUrl = `${props.serverUrl}/oauth/gitlab/mobile_login`;
+            this.completedUrl = `${props.serverUrl}/signup/gitlab/complete`;
+            break;
+        case ViewTypes.SAML:
+            this.loginUrl = `${props.serverUrl}/login/sso/saml?action=mobile`;
+            this.completedUrl = '/login/sso/saml';
+            break;
+        }
+    }
+
     componentDidMount() {
         InteractionManager.runAfterInteractions(() => {
             this.setState({renderWebview: true});
@@ -69,22 +88,21 @@ class Saml extends PureComponent {
     onNavigationStateChange = (navState) => {
         const {url} = navState;
 
-        if (url.includes('/login/sso/saml')) {
+        if (url.includes(this.completedUrl)) {
             CookieManager.get(this.props.serverUrl, (err, res) => {
                 const token = res.MMAUTHTOKEN;
 
                 if (token) {
+                    this.setState({renderWebview: false});
                     const {
                         handleSuccessfulLogin,
                         setStoreFromLocalData
                     } = this.props.actions;
 
                     Client4.setToken(token);
-                    handleSuccessfulLogin().
-                    then(async (expiresAt) => {
-                        await setStoreFromLocalData({url: this.props.serverUrl, token});
-                        this.goToLoadTeam(expiresAt);
-                    });
+                    setStoreFromLocalData({url: this.props.serverUrl, token}).
+                    then(handleSuccessfulLogin).
+                    then(this.goToLoadTeam);
                 }
             });
         }
@@ -92,22 +110,30 @@ class Saml extends PureComponent {
 
     render() {
         if (!this.state || !this.state.renderWebview) {
-            return null;
+            return (
+                <View style={{flex: 1}}>
+                    <StatusBar barStyle='light-content'/>
+                    <Loading/>
+                </View>
+            );
         }
 
         return (
             <View style={{flex: 1}}>
                 <StatusBar barStyle='light-content'/>
                 <WebView
-                    source={{uri: `${this.props.serverUrl}/login/sso/saml?action=mobile`}}
+                    source={{uri: this.loginUrl}}
                     javaScriptEnabledAndroid={true}
                     automaticallyAdjustContentInsets={false}
                     scalesPageToFit={true}
+                    startInLoadingState={true}
                     onNavigationStateChange={this.onNavigationStateChange}
+                    onShouldStartLoadWithRequest={() => true}
+                    renderLoading={() => (<Loading/>)}
                 />
             </View>
         );
     }
 }
 
-export default injectIntl(Saml);
+export default injectIntl(SSO);
diff --git a/assets/base/i18n/en.json b/assets/base/i18n/en.json
index 3178df627..6e75579a5 100644
--- a/assets/base/i18n/en.json
+++ b/assets/base/i18n/en.json
@@ -1736,7 +1736,7 @@
   "mobile.routes.loginOptions": "Login Chooser",
   "mobile.routes.mfa": "Multi-factor Authentication",
   "mobile.routes.postsList": "Posts List",
-  "mobile.routes.saml": "Single SignOn",
+  "mobile.routes.sso": "Single Sign-On",
   "mobile.routes.selectTeam": "Select Team",
   "mobile.routes.settings": "Settings",
   "mobile.routes.thread": "{channelName} Thread",
diff --git a/assets/base/images/gitlab.png b/assets/base/images/gitlab.png
new file mode 100644
index 0000000000000000000000000000000000000000..5512e14195131c41a29f483db234c6dac5f4d81b
GIT binary patch
literal 665
zcmeAS@N?(olHy`uVBq!ia0vp^Dj>|k3?#4J%UA`Zo&@-WxcX!k{vYl@UTM-kpnttf
zg8YIRRt5Zc!pg41#3T3Nj`^k8za?ZHSA2~+82_qRu;L%%OI7_Vz7zf&-Wlk&t*L!t
zrtmzS_ok6^PHi<2UC?+k{BE}H$7@$}K3OzBySPPh(z`7T42+VVE{-7*lC1}sn+^vs
zuw3Ze<(YN+*)6kY|GwW`&~fX(oXoG^EP`tJR%QD%6q}Byl!?{!Dyn=t$yyflL_{&z
zs8x6J6Cp+KNor<x9%=%U6n^&f8tN|Rs92cVW9qzcX=4MMZWrTppW7Ua%C}N>yvvZ5
zJN&%N<2I*E)$Bg58m*Eor8g#(cz&4p!t2mC-|(2`cCqEze9>Lm{qAz&F~3`nE@|LQ
zaBUQAkYxSG;JmOQ$zj=q9+TEfKNe2ln(CyL7s9pTxx=<I&8H$GwlMNbWE4#8y0bXq
zP?-5a5C7PTE9)f_!`l1n?x#2uuTx%8?>4_eUeL<6>WfuJipY*ogAMMhr!7<t&Q9E4
sGj&>)9Q#wb6RTxdl3t#cVEV_nN@(A%a|s@az_4fVboFyt=akR{0Ob{zh5!Hn

literal 0
HcmV?d00001