diff options
author | Joram Wilander <jwawilander@gmail.com> | 2016-07-29 14:58:37 -0400 |
---|---|---|
committer | Christopher Speller <crspeller@gmail.com> | 2016-07-29 14:58:37 -0400 |
commit | 3f8dda6f5ad676c976fd5ae575a6790fdb505449 (patch) | |
tree | 015a739989103ce38481176fd5d55f5f703789cb /webapp/components | |
parent | 748fdef1fbded624a786533e8f065b91a047b91c (diff) | |
download | chat-3f8dda6f5ad676c976fd5ae575a6790fdb505449.tar.gz chat-3f8dda6f5ad676c976fd5ae575a6790fdb505449.tar.bz2 chat-3f8dda6f5ad676c976fd5ae575a6790fdb505449.zip |
PLT-3633 EE: Add Google and Office365 SSO through OAuth2 (#3660)
* EE: Add Google and Office365 SSO through OAuth2
* Add localization strings
* Text tweaks for PLT-3633
* Added sign-up button for Office 365
* Updated some error messages and a bit of licensing
* Updated sign-in method section in user settings to include Google and Office365
* Added more localization strings
Diffstat (limited to 'webapp/components')
-rw-r--r-- | webapp/components/admin_console/admin_sidebar.jsx | 129 | ||||
-rw-r--r-- | webapp/components/admin_console/oauth_settings.jsx | 432 | ||||
-rw-r--r-- | webapp/components/login/login_controller.jsx | 27 | ||||
-rw-r--r-- | webapp/components/signup_user_complete.jsx | 18 | ||||
-rw-r--r-- | webapp/components/user_settings/user_settings_general.jsx | 56 | ||||
-rw-r--r-- | webapp/components/user_settings/user_settings_security.jsx | 192 |
6 files changed, 713 insertions, 141 deletions
diff --git a/webapp/components/admin_console/admin_sidebar.jsx b/webapp/components/admin_console/admin_sidebar.jsx index 5c02f419e..d812b83fd 100644 --- a/webapp/components/admin_console/admin_sidebar.jsx +++ b/webapp/components/admin_console/admin_sidebar.jsx @@ -175,6 +175,7 @@ export default class AdminSidebar extends React.Component { } render() { + let oauthSettings = null; let ldapSettings = null; let samlSettings = null; let complianceSettings = null; @@ -184,69 +185,93 @@ export default class AdminSidebar extends React.Component { let policy = null; if (window.mm_config.BuildEnterpriseReady === 'true') { - if (window.mm_license.IsLicensed === 'true') { - if (global.window.mm_license.LDAP === 'true') { - ldapSettings = ( - <AdminSidebarSection - name='ldap' - title={ - <FormattedMessage - id='admin.sidebar.ldap' - defaultMessage='LDAP' - /> - } + license = ( + <AdminSidebarSection + name='license' + title={ + <FormattedMessage + id='admin.sidebar.license' + defaultMessage='Edition and License' /> - ); - } + } + /> + ); + } - if (global.window.mm_license.SAML === 'true') { - samlSettings = ( - <AdminSidebarSection - name='saml' - title={ - <FormattedMessage - id='admin.sidebar.saml' - defaultMessage='SAML' - /> - } - /> - ); - } + if (window.mm_license.IsLicensed === 'true') { + if (global.window.mm_license.LDAP === 'true') { + ldapSettings = ( + <AdminSidebarSection + name='ldap' + title={ + <FormattedMessage + id='admin.sidebar.ldap' + defaultMessage='LDAP' + /> + } + /> + ); + } - if (global.window.mm_license.Compliance === 'true') { - complianceSettings = ( - <AdminSidebarSection - name='compliance' - title={ - <FormattedMessage - id='admin.sidebar.compliance' - defaultMessage='Compliance' - /> - } - /> - ); - } + if (global.window.mm_license.SAML === 'true') { + samlSettings = ( + <AdminSidebarSection + name='saml' + title={ + <FormattedMessage + id='admin.sidebar.saml' + defaultMessage='SAML' + /> + } + /> + ); + } - policy = ( + if (global.window.mm_license.Compliance === 'true') { + complianceSettings = ( <AdminSidebarSection - name='policy' + name='compliance' title={ <FormattedMessage - id='admin.sidebar.policy' - defaultMessage='Policy' + id='admin.sidebar.compliance' + defaultMessage='Compliance' /> } /> ); } - license = ( + oauthSettings = ( <AdminSidebarSection - name='license' + name='oauth' title={ <FormattedMessage - id='admin.sidebar.license' - defaultMessage='Edition and License' + id='admin.sidebar.oauth' + defaultMessage='OAuth 2.0' + /> + } + /> + ); + + policy = ( + <AdminSidebarSection + name='policy' + title={ + <FormattedMessage + id='admin.sidebar.policy' + defaultMessage='Policy' + /> + } + /> + ); + } else { + oauthSettings = ( + <AdminSidebarSection + name='gitlab' + title={ + <FormattedMessage + id='admin.sidebar.gitlab' + defaultMessage='GitLab' /> } /> @@ -396,15 +421,7 @@ export default class AdminSidebar extends React.Component { /> } /> - <AdminSidebarSection - name='gitlab' - title={ - <FormattedMessage - id='admin.sidebar.gitlab' - defaultMessage='GitLab' - /> - } - /> + {oauthSettings} {ldapSettings} {samlSettings} </AdminSidebarSection> diff --git a/webapp/components/admin_console/oauth_settings.jsx b/webapp/components/admin_console/oauth_settings.jsx new file mode 100644 index 000000000..627a8864b --- /dev/null +++ b/webapp/components/admin_console/oauth_settings.jsx @@ -0,0 +1,432 @@ +// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + +import * as Utils from 'utils/utils.jsx'; +import Constants from 'utils/constants.jsx'; + +import AdminSettings from './admin_settings.jsx'; +import DropdownSetting from './dropdown_setting.jsx'; +import SettingsGroup from './settings_group.jsx'; +import TextSetting from './text_setting.jsx'; + +import React from 'react'; +import {FormattedHTMLMessage, FormattedMessage} from 'react-intl'; + +export default class OAuthSettings extends AdminSettings { + constructor(props) { + super(props); + + this.getConfigFromState = this.getConfigFromState.bind(this); + this.getStateFromConfig = this.getStateFromConfig.bind(this); + this.renderSettings = this.renderSettings.bind(this); + this.renderOffice365 = this.renderOffice365.bind(this); + this.renderGoogle = this.renderGoogle.bind(this); + this.renderGitLab = this.renderGitLab.bind(this); + this.changeType = this.changeType.bind(this); + } + + getConfigFromState(config) { + config.GitLabSettings.Enable = false; + config.GoogleSettings.Enable = false; + config.Office365Settings.Enable = false; + + if (this.state.oauthType === Constants.GITLAB_SERVICE) { + config.GitLabSettings.Enable = true; + config.GitLabSettings.Id = this.state.id; + config.GitLabSettings.Secret = this.state.secret; + config.GitLabSettings.UserApiEndpoint = this.state.userApiEndpoint; + config.GitLabSettings.AuthEndpoint = this.state.authEndpoint; + config.GitLabSettings.TokenEndpoint = this.state.tokenEndpoint; + } + + if (this.state.oauthType === Constants.GOOGLE_SERVICE) { + config.GoogleSettings.Enable = true; + config.GoogleSettings.Id = this.state.id; + config.GoogleSettings.Secret = this.state.secret; + config.GoogleSettings.UserApiEndpoint = this.state.userApiEndpoint; + config.GoogleSettings.AuthEndpoint = this.state.authEndpoint; + config.GoogleSettings.TokenEndpoint = this.state.tokenEndpoint; + config.GoogleSettings.Scope = 'profile email'; + } + + if (this.state.oauthType === Constants.OFFICE365_SERVICE) { + config.Office365Settings.Enable = true; + config.Office365Settings.Id = this.state.id; + config.Office365Settings.Secret = this.state.secret; + config.Office365Settings.UserApiEndpoint = this.state.userApiEndpoint; + config.Office365Settings.AuthEndpoint = this.state.authEndpoint; + config.Office365Settings.TokenEndpoint = this.state.tokenEndpoint; + config.Office365Settings.Scope = 'User.Read'; + } + + return config; + } + + getStateFromConfig(config) { + this.config = config; + + let oauthType = 'off'; + let settings = {}; + if (config.GitLabSettings.Enable) { + oauthType = Constants.GITLAB_SERVICE; + settings = config.GitLabSettings; + } else if (config.GoogleSettings.Enable) { + oauthType = Constants.GOOGLE_SERVICE; + settings = config.GoogleSettings; + } else if (config.Office365Settings.Enable) { + oauthType = Constants.OFFICE365_SERVICE; + settings = config.Office365Settings; + } + + return { + oauthType, + id: settings.Id, + secret: settings.Secret, + userApiEndpoint: settings.UserApiEndpoint, + authEndpoint: settings.AuthEndpoint, + tokenEndpoint: settings.TokenEndpoint + }; + } + + changeType(id, value) { + let settings = {}; + if (value === Constants.GITLAB_SERVICE) { + settings = this.config.GitLabSettings; + } else if (value === Constants.GOOGLE_SERVICE) { + settings = this.config.GoogleSettings; + } else if (value === Constants.OFFICE365_SERVICE) { + settings = this.config.Office365Settings; + } + + this.setState({ + id: settings.Id, + secret: settings.Secret, + userApiEndpoint: settings.UserApiEndpoint, + authEndpoint: settings.AuthEndpoint, + tokenEndpoint: settings.TokenEndpoint + }); + + this.handleChange(id, value); + } + + renderTitle() { + return ( + <h3> + <FormattedMessage + id='admin.authentication.oauth' + defaultMessage='OAuth 2.0' + /> + </h3> + ); + } + + renderGoogle() { + return ( + <div> + <TextSetting + id='id' + label={ + <FormattedMessage + id='admin.google.clientIdTitle' + defaultMessage='Client ID:' + /> + } + placeholder={Utils.localizeMessage('admin.google.clientIdExample', 'Ex "7602141235235-url0fhs1mayfasbmop5qlfns8dh4.apps.googleusercontent.com"')} + helpText={ + <FormattedMessage + id='admin.google.clientIdDescription' + defaultMessage='The Client ID you received when registering your application with Google.' + /> + } + value={this.state.id} + onChange={this.handleChange} + /> + <TextSetting + id='secret' + label={ + <FormattedMessage + id='admin.google.clientSecretTitle' + defaultMessage='Client Secret:' + /> + } + placeholder={Utils.localizeMessage('admin.google.clientSecretExample', 'Ex "H8sz0Az-dDs2p15-7QzD231"')} + helpText={ + <FormattedMessage + id='admin.google.clientSecretDescription' + defaultMessage='The Client Secret you received when registering your application with Google.' + /> + } + value={this.state.secret} + onChange={this.handleChange} + /> + <TextSetting + id='userApiEndpoint' + label={ + <FormattedMessage + id='admin.google.userTitle' + defaultMessage='User API Endpoint:' + /> + } + value='https://www.googleapis.com/plus/v1/people/me' + disabled={true} + /> + <TextSetting + id='authEndpoint' + label={ + <FormattedMessage + id='admin.google.authTitle' + defaultMessage='Auth Endpoint:' + /> + } + value='https://accounts.google.com/o/oauth2/v2/auth' + disabled={true} + /> + <TextSetting + id='tokenEndpoint' + label={ + <FormattedMessage + id='admin.google.tokenTitle' + defaultMessage='Token Endpoint:' + /> + } + value='https://www.googleapis.com/oauth2/v4/token' + disabled={true} + /> + </div> + ); + } + + renderOffice365() { + return ( + <div> + <TextSetting + id='id' + label={ + <FormattedMessage + id='admin.office365.clientIdTitle' + defaultMessage='Application ID:' + /> + } + placeholder={Utils.localizeMessage('admin.office365.clientIdExample', 'Ex "adf3sfa2-ag3f-sn4n-ids0-sh1hdax192qq"')} + helpText={ + <FormattedMessage + id='admin.office365.clientIdDescription' + defaultMessage='The Application/Client ID you received when registering your application with Microsoft.' + /> + } + value={this.state.id} + onChange={this.handleChange} + /> + <TextSetting + id='secret' + label={ + <FormattedMessage + id='admin.office365.clientSecretTitle' + defaultMessage='Application Secret Password:' + /> + } + placeholder={Utils.localizeMessage('admin.office365.clientSecretExample', 'Ex "shAieM47sNBfgl20f8ci294"')} + helpText={ + <FormattedMessage + id='admin.office365.clientSecretDescription' + defaultMessage='The Application Secret Password you generated when registering your application with Microsoft.' + /> + } + value={this.state.secret} + onChange={this.handleChange} + /> + <TextSetting + id='userApiEndpoint' + label={ + <FormattedMessage + id='admin.office365.userTitle' + defaultMessage='User API Endpoint:' + /> + } + value='https://graph.microsoft.com/v1.0/me' + disabled={true} + /> + <TextSetting + id='authEndpoint' + label={ + <FormattedMessage + id='admin.office365.authTitle' + defaultMessage='Auth Endpoint:' + /> + } + value='https://login.microsoftonline.com/common/oauth2/v2.0/authorize' + disabled={true} + /> + <TextSetting + id='tokenEndpoint' + label={ + <FormattedMessage + id='admin.office365.tokenTitle' + defaultMessage='Token Endpoint:' + /> + } + value='https://login.microsoftonline.com/common/oauth2/v2.0/token' + disabled={true} + /> + </div> + ); + } + + renderGitLab() { + return ( + <div> + <TextSetting + id='id' + label={ + <FormattedMessage + id='admin.gitlab.clientIdTitle' + defaultMessage='Application ID:' + /> + } + placeholder={Utils.localizeMessage('admin.gitlab.clientIdExample', 'Ex "jcuS8PuvcpGhpgHhlcpT1Mx42pnqMxQY"')} + helpText={ + <FormattedMessage + id='admin.gitlab.clientIdDescription' + defaultMessage='Obtain this value via the instructions above for logging into GitLab' + /> + } + value={this.state.id} + onChange={this.handleChange} + /> + <TextSetting + id='secret' + label={ + <FormattedMessage + id='admin.gitlab.clientSecretTitle' + defaultMessage='Application Secret Key:' + /> + } + placeholder={Utils.localizeMessage('admin.gitlab.clientSecretExample', 'Ex "jcuS8PuvcpGhpgHhlcpT1Mx42pnqMxQY"')} + helpText={ + <FormattedMessage + id='admin.gitab.clientSecretDescription' + defaultMessage='Obtain this value via the instructions above for logging into GitLab.' + /> + } + value={this.state.secret} + onChange={this.handleChange} + /> + <TextSetting + id='userApiEndpoint' + label={ + <FormattedMessage + id='admin.gitlab.userTitle' + defaultMessage='User API Endpoint:' + /> + } + placeholder={Utils.localizeMessage('admin.gitlab.userExample', 'Ex "https://<your-gitlab-url>/api/v3/user"')} + helpText={ + <FormattedMessage + id='admin.gitlab.userDescription' + defaultMessage='Enter https://<your-gitlab-url>/api/v3/user. Make sure you use HTTP or HTTPS in your URL depending on your server configuration.' + /> + } + value={this.state.userApiEndpoint} + onChange={this.handleChange} + /> + <TextSetting + id='authEndpoint' + label={ + <FormattedMessage + id='admin.gitlab.authTitle' + defaultMessage='Auth Endpoint:' + /> + } + placeholder={Utils.localizeMessage('admin.gitlab.authExample', 'Ex "https://<your-gitlab-url>/oauth/authorize"')} + helpText={ + <FormattedMessage + id='admin.gitlab.authDescription' + defaultMessage='Enter https://<your-gitlab-url>/oauth/authorize (example https://example.com:3000/oauth/authorize). Make sure you use HTTP or HTTPS in your URL depending on your server configuration.' + /> + } + value={this.state.authEndpoint} + onChange={this.handleChange} + /> + <TextSetting + id='tokenEndpoint' + label={ + <FormattedMessage + id='admin.gitlab.tokenTitle' + defaultMessage='Token Endpoint:' + /> + } + placeholder={Utils.localizeMessage('admin.gitlab.tokenExample', 'Ex "https://<your-gitlab-url>/oauth/token"')} + helpText={ + <FormattedMessage + id='admin.gitlab.tokenDescription' + defaultMessage='Enter https://<your-gitlab-url>/oauth/token. Make sure you use HTTP or HTTPS in your URL depending on your server configuration.' + /> + } + value={this.state.tokenEndpoint} + onChange={this.handleChange} + /> + </div> + ); + } + + renderSettings() { + let contents; + let helpText; + if (this.state.oauthType === Constants.GITLAB_SERVICE) { + contents = this.renderGitLab(); + helpText = ( + <FormattedHTMLMessage + id='admin.gitlab.EnableHtmlDesc' + defaultMessage='<ol><li>Log in to your GitLab account and go to Profile Settings -> Applications.</li><li>Enter Redirect URIs "<your-mattermost-url>/login/gitlab/complete" (example: http://localhost:8065/login/gitlab/complete) and "<your-mattermost-url>/signup/gitlab/complete". </li><li>Then use "Application Secret Key" and "Application ID" fields from GitLab to complete the options below.</li><li>Complete the Endpoint URLs below. </li></ol>' + /> + ); + } else if (this.state.oauthType === Constants.GOOGLE_SERVICE) { + contents = this.renderGoogle(); + helpText = ( + <FormattedHTMLMessage + id='admin.google.EnableHtmlDesc' + defaultMessage="<ol><li><a href='https://accounts.google.com/login'>Log in</a> to your Google account.</li><li>Go to <a href='https://console.developers.google.com'>https://console.developers.google.com</a>, click <strong>Credentials</strong> in the left hand sidebar and enter <strong>Mattermost - <your-company-name></strong> as the project name.</li><li>Click the <strong>OAuth consent screen</strong> header and enter <strong>Mattermost</strong> as the <strong>Product name to show users</strong>. Click <strong>Save</strong>.</li><li>Under the <strong>Credentials</strong> header, click <strong>Create credentials</strong>, choose <strong>OAuth client ID</strong> and select <strong>Web Application</strong>.</li><li>Under <strong>Restrictions</strong> and <strong>Authorized redirect URIs</strong> enter <strong><your-mattermost-url>/signup/google/complete</strong> (example: http://localhost:8065/signup/google/complete). Click <strong>Create</strong>.</li><li>Save the <strong>client ID</strong> and <strong>client secret</strong> to later complete the fields below.</li><li>Finally, go to <a href='https://console.developers.google.com/apis/api/plus/overview'>Google+ API</a> and click <strong>Enable</strong>. This might take a few minutes to propagate through Google's systems.</li><li>Complete the <strong>Client ID</strong> and <strong>Client Secret</strong> fields below.</li></ol>" + /> + ); + } else if (this.state.oauthType === Constants.OFFICE365_SERVICE) { + contents = this.renderOffice365(); + helpText = ( + <FormattedHTMLMessage + id='admin.office365.EnableHtmlDesc' + defaultMessage="<ol><li><a href='https://login.microsoftonline.com/'>Log in</a> to your Microsoft or Office 365 account. Make sure it's the account on the same <a href='https://msdn.microsoft.com/en-us/library/azure/jj573650.aspx#Anchor_0'>tenant</a> that you would like users to log in with.</li><li>Go to <a href='https://apps.dev.microsoft.com'>https://apps.dev.microsoft.com</a>, click <strong>Add an app</strong> and use <strong>Mattermost - <your-company-name></strong> as the application name.</li><li>Under <strong>Application Secrets</strong>, click <strong>Generate New Password</strong> and save it to later complete the field below.</li><li>Under <strong>Platforms</strong>, click <strong>Add Platform</strong>, choose <strong>Web</strong> and enter <strong><your-mattermost-url>/signup/office365/complete</strong> (example: http://localhost:8065/signup/office365/complete) under <strong>Redirect URIs</strong>. Also uncheck <strong>Allow Implicit Flow</strong>.</li><li>Finally, click <strong>Save</strong> and complete the <strong>Application ID</strong> and <strong>Application Secret Password</strong> fields below.</li></ol>" + /> + ); + } + + const oauthTypes = []; + oauthTypes.push({value: 'off', text: Utils.localizeMessage('admin.oauth.off', 'Do not allow sign-in via an OAuth 2.0 provider.')}); + oauthTypes.push({value: Constants.GITLAB_SERVICE, text: Utils.localizeMessage('admin.oauth.gitlab', 'GitLab')}); + if (global.window.mm_license.IsLicensed === 'true') { + if (global.window.mm_license.GoogleSSO === 'true') { + oauthTypes.push({value: Constants.GOOGLE_SERVICE, text: Utils.localizeMessage('admin.oauth.google', 'Google Apps')}); + } + if (global.window.mm_license.Office365SSO === 'true') { + oauthTypes.push({value: Constants.OFFICE365_SERVICE, text: Utils.localizeMessage('admin.oauth.office365', 'Office 365')}); + } + } + + return ( + <SettingsGroup> + <DropdownSetting + id='oauthType' + values={oauthTypes} + label={ + <FormattedMessage + id='admin.oauth.select' + defaultMessage='Select OAuth 2.0 Service Provider:' + /> + } + helpText={helpText} + value={this.state.oauthType} + onChange={this.changeType} + /> + {contents} + </SettingsGroup> + ); + } +} diff --git a/webapp/components/login/login_controller.jsx b/webapp/components/login/login_controller.jsx index bcd362f13..4a4c5cb0a 100644 --- a/webapp/components/login/login_controller.jsx +++ b/webapp/components/login/login_controller.jsx @@ -328,6 +328,7 @@ export default class LoginController extends React.Component { const ldapEnabled = this.state.ldapEnabled; const gitlabSigninEnabled = global.window.mm_config.EnableSignUpWithGitLab === 'true'; const googleSigninEnabled = global.window.mm_config.EnableSignUpWithGoogle === 'true'; + const office365SigninEnabled = global.window.mm_config.EnableSignUpWithOffice365 === 'true'; const samlSigninEnabled = this.state.samlEnabled; const usernameSigninEnabled = this.state.usernameSigninEnabled; const emailSigninEnabled = this.state.emailSigninEnabled; @@ -429,7 +430,7 @@ export default class LoginController extends React.Component { ); } - if ((emailSigninEnabled || usernameSigninEnabled || ldapEnabled) && (gitlabSigninEnabled || googleSigninEnabled || samlSigninEnabled)) { + if ((emailSigninEnabled || usernameSigninEnabled || ldapEnabled) && (gitlabSigninEnabled || googleSigninEnabled || samlSigninEnabled || office365SigninEnabled)) { loginControls.push( <div key='divider' @@ -472,10 +473,10 @@ export default class LoginController extends React.Component { if (googleSigninEnabled) { loginControls.push( - <Link + <a className='btn btn-custom-login google' key='google' - to={Client.getOAuthRoute() + '/google/login'} + href={Client.getOAuthRoute() + '/google/login' + this.props.location.search} > <span className='icon'/> <span> @@ -484,7 +485,25 @@ export default class LoginController extends React.Component { defaultMessage='Google Apps' /> </span> - </Link> + </a> + ); + } + + if (office365SigninEnabled) { + loginControls.push( + <a + className='btn btn-custom-login office365' + key='office365' + href={Client.getOAuthRoute() + '/office365/login' + this.props.location.search} + > + <span className='icon'/> + <span> + <FormattedMessage + id='login.office365' + defaultMessage='Office 365' + /> + </span> + </a> ); } diff --git a/webapp/components/signup_user_complete.jsx b/webapp/components/signup_user_complete.jsx index 254478e03..3cd6fb27b 100644 --- a/webapp/components/signup_user_complete.jsx +++ b/webapp/components/signup_user_complete.jsx @@ -594,6 +594,24 @@ export default class SignupUserComplete extends React.Component { ); } + if (global.window.mm_config.EnableSignUpWithOffice365 === 'true') { + signupMessage.push( + <a + className='btn btn-custom-login office365' + key='office365' + href={Client.getOAuthRoute() + '/office365/signup' + window.location.search + '&team=' + encodeURIComponent(this.state.teamName)} + > + <span className='icon'/> + <span> + <FormattedMessage + id='signup_user_completed.office365' + defaultMessage='with Office 365' + /> + </span> + </a> + ); + } + if (global.window.mm_config.EnableSaml === 'true' && global.window.mm_license.IsLicensed === 'true' && global.window.mm_license.SAML === 'true') { signupMessage.push( <a diff --git a/webapp/components/user_settings/user_settings_general.jsx b/webapp/components/user_settings/user_settings_general.jsx index 8dce4deed..d1c195c7e 100644 --- a/webapp/components/user_settings/user_settings_general.jsx +++ b/webapp/components/user_settings/user_settings_general.jsx @@ -419,6 +419,42 @@ class UserSettingsGeneralTab extends React.Component { {helpText} </div> ); + } else if (this.props.user.auth_service === Constants.GOOGLE_SERVICE) { + inputs.push( + <div + key='oauthEmailInfo' + className='form-group' + > + <div className='setting-list__hint'> + <FormattedMessage + id='user.settings.general.emailGoogleCantUpdate' + defaultMessage='Login occurs through Google Apps. Email cannot be updated. Email address used for notifications is {email}.' + values={{ + email: this.state.email + }} + /> + </div> + {helpText} + </div> + ); + } else if (this.props.user.auth_service === Constants.OFFICE365_SERVICE) { + inputs.push( + <div + key='oauthEmailInfo' + className='form-group' + > + <div className='setting-list__hint'> + <FormattedMessage + id='user.settings.general.emailOffice365CantUpdate' + defaultMessage='Login occurs through Office 365. Email cannot be updated. Email address used for notifications is {email}.' + values={{ + email: this.state.email + }} + /> + </div> + {helpText} + </div> + ); } else if (this.props.user.auth_service === Constants.LDAP_SERVICE) { inputs.push( <div @@ -511,6 +547,26 @@ class UserSettingsGeneralTab extends React.Component { }} /> ); + } else if (this.props.user.auth_service === Constants.GOOGLE_SERVICE) { + describe = ( + <FormattedMessage + id='user.settings.general.loginGoogle' + defaultMessage='Login done through Google Apps ({email})' + values={{ + email: this.state.email + }} + /> + ); + } else if (this.props.user.auth_service === Constants.OFFICE365_SERVICE) { + describe = ( + <FormattedMessage + id='user.settings.general.loginOffice365' + defaultMessage='Login done through Office 365 ({email})' + values={{ + email: this.state.email + }} + /> + ); } else if (this.props.user.auth_service === Constants.LDAP_SERVICE) { describe = ( <FormattedMessage diff --git a/webapp/components/user_settings/user_settings_security.jsx b/webapp/components/user_settings/user_settings_security.jsx index a4f02a614..428c88e25 100644 --- a/webapp/components/user_settings/user_settings_security.jsx +++ b/webapp/components/user_settings/user_settings_security.jsx @@ -1,7 +1,6 @@ // Copyright (c) 2015 Mattermost, Inc. All Rights Reserved. // See License.txt for license information. -import $ from 'jquery'; import SettingItemMin from '../setting_item_min.jsx'; import SettingItemMax from '../setting_item_max.jsx'; import AccessHistoryModal from '../access_history_modal.jsx'; @@ -9,13 +8,14 @@ import ActivityLogModal from '../activity_log_modal.jsx'; import ToggleModalButton from '../toggle_modal_button.jsx'; import PreferenceStore from 'stores/preference_store.jsx'; -import TeamStore from 'stores/team_store.jsx'; import Client from 'client/web_client.jsx'; import * as AsyncClient from 'utils/async_client.jsx'; import * as Utils from 'utils/utils.jsx'; import Constants from 'utils/constants.jsx'; +import $ from 'jquery'; +import React from 'react'; import {intlShape, injectIntl, defineMessages, FormattedMessage, FormattedHTMLMessage, FormattedTime, FormattedDate} from 'react-intl'; import {Link} from 'react-router/es6'; @@ -42,8 +42,6 @@ const holders = defineMessages({ } }); -import React from 'react'; - class SecurityTab extends React.Component { constructor(props) { super(props); @@ -543,10 +541,99 @@ class SecurityTab extends React.Component { const user = this.props.user; if (this.props.activeSection === 'signin') { - const teamName = TeamStore.getCurrent().name; - let emailOption; - if (global.window.mm_config.EnableSignUpWithEmail === 'true' && user.auth_service !== '') { + let gitlabOption; + let googleOption; + let office365Option; + let ldapOption; + let samlOption; + + if (user.auth_service === '') { + if (global.window.mm_config.EnableSignUpWithGitLab === 'true') { + gitlabOption = ( + <div className='padding-bottom x2'> + <Link + className='btn btn-primary' + to={'/claim/email_to_oauth?email=' + encodeURIComponent(user.email) + '&old_type=' + user.auth_service + '&new_type=' + Constants.GITLAB_SERVICE} + > + <FormattedMessage + id='user.settings.security.switchGitlab' + defaultMessage='Switch to using GitLab SSO' + /> + </Link> + <br/> + </div> + ); + } + + if (global.window.mm_config.EnableSignUpWithGoogle === 'true') { + googleOption = ( + <div className='padding-bottom x2'> + <Link + className='btn btn-primary' + to={'/claim/email_to_oauth?email=' + encodeURIComponent(user.email) + '&old_type=' + user.auth_service + '&new_type=' + Constants.GOOGLE_SERVICE} + > + <FormattedMessage + id='user.settings.security.switchGoogle' + defaultMessage='Switch to using Google SSO' + /> + </Link> + <br/> + </div> + ); + } + + if (global.window.mm_config.EnableSignUpWithOffice365 === 'true') { + office365Option = ( + <div className='padding-bottom x2'> + <Link + className='btn btn-primary' + to={'/claim/email_to_oauth?email=' + encodeURIComponent(user.email) + '&old_type=' + user.auth_service + '&new_type=' + Constants.OFFICE365_SERVICE} + > + <FormattedMessage + id='user.settings.security.switchOffice365' + defaultMessage='Switch to using Office 365 SSO' + /> + </Link> + <br/> + </div> + ); + } + + if (global.window.mm_config.EnableLdap === 'true') { + ldapOption = ( + <div className='padding-bottom x2'> + <Link + className='btn btn-primary' + to={'/claim/email_to_ldap?email=' + encodeURIComponent(user.email)} + > + <FormattedMessage + id='user.settings.security.switchLdap' + defaultMessage='Switch to using LDAP' + /> + </Link> + <br/> + </div> + ); + } + + if (global.window.mm_config.EnableSaml === 'true') { + samlOption = ( + <div className='padding-bottom x2'> + <Link + className='btn btn-primary' + to={'/claim/email_to_oauth?email=' + encodeURIComponent(user.email) + '&old_type=' + user.auth_service + '&new_type=' + Constants.SAML_SERVICE} + > + <FormattedMessage + id='user.settings.security.switchSaml' + defaultMessage='Switch to using SAML SSO' + /> + </Link> + <br/> + </div> + ); + } + } else if (global.window.mm_config.EnableSignUpWithEmail === 'true') { let link; if (user.auth_service === Constants.LDAP_SERVICE) { link = '/claim/ldap_to_email?email=' + encodeURIComponent(user.email); @@ -570,86 +657,15 @@ class SecurityTab extends React.Component { ); } - let gitlabOption; - if (global.window.mm_config.EnableSignUpWithGitLab === 'true' && user.auth_service === '') { - gitlabOption = ( - <div className='padding-bottom x2'> - <Link - className='btn btn-primary' - to={'/claim/email_to_oauth?email=' + encodeURIComponent(user.email) + '&old_type=' + user.auth_service + '&new_type=' + Constants.GITLAB_SERVICE} - > - <FormattedMessage - id='user.settings.security.switchGitlab' - defaultMessage='Switch to using GitLab SSO' - /> - </Link> - <br/> - </div> - ); - } - - let googleOption; - if (global.window.mm_config.EnableSignUpWithGoogle === 'true' && user.auth_service === '') { - googleOption = ( - <div className='padding-bottom x2'> - <Link - className='btn btn-primary' - to={'/' + teamName + '/claim/email_to_oauth?email=' + encodeURIComponent(user.email) + '&old_type=' + user.auth_service + '&new_type=' + Constants.GOOGLE_SERVICE} - > - <FormattedMessage - id='user.settings.security.switchGoogle' - defaultMessage='Switch to using Google SSO' - /> - </Link> - <br/> - </div> - ); - } - - let ldapOption; - if (global.window.mm_config.EnableLdap === 'true' && user.auth_service === '') { - ldapOption = ( - <div className='padding-bottom x2'> - <Link - className='btn btn-primary' - to={'/claim/email_to_ldap?email=' + encodeURIComponent(user.email)} - > - <FormattedMessage - id='user.settings.security.switchLdap' - defaultMessage='Switch to using LDAP' - /> - </Link> - <br/> - </div> - ); - } - - let samlOption; - if (global.window.mm_config.EnableSaml === 'true' && user.auth_service === '') { - samlOption = ( - <div className='padding-bottom x2'> - <Link - className='btn btn-primary' - to={'/claim/email_to_oauth?email=' + encodeURIComponent(user.email) + '&old_type=' + user.auth_service + '&new_type=' + Constants.SAML_SERVICE} - > - <FormattedMessage - id='user.settings.security.switchSaml' - defaultMessage='Switch to using SAML SSO' - /> - </Link> - <br/> - </div> - ); - } - const inputs = []; inputs.push( <div key='userSignInOption'> {emailOption} {gitlabOption} + {googleOption} + {office365Option} {ldapOption} {samlOption} - {googleOption} </div> ); @@ -693,7 +709,21 @@ class SecurityTab extends React.Component { describe = ( <FormattedMessage id='user.settings.security.gitlab' - defaultMessage='GitLab SSO' + defaultMessage='GitLab' + /> + ); + } else if (this.props.user.auth_service === Constants.GOOGLE_SERVICE) { + describe = ( + <FormattedMessage + id='user.settings.security.google' + defaultMessage='Google' + /> + ); + } else if (this.props.user.auth_service === Constants.OFFICE365_SERVICE) { + describe = ( + <FormattedMessage + id='user.settings.security.office365' + defaultMessage='Office 365' /> ); } else if (this.props.user.auth_service === Constants.LDAP_SERVICE) { |