diff --git a/src/components/structures/auth/Login.js b/src/components/structures/auth/Login.js index 4fe0a37c66..7b8fd0db4f 100644 --- a/src/components/structures/auth/Login.js +++ b/src/components/structures/auth/Login.js @@ -567,6 +567,7 @@ module.exports = React.createClass({ }, _renderSsoStep: function(url) { + const SignInToText = sdk.getComponent('views.auth.SignInToText'); // XXX: This link does *not* have a target="_blank" because single sign-on relies on // redirecting the user back to a URI once they're logged in. On the web, this means // we use the same window and redirect back to riot. On electron, this actually @@ -575,9 +576,12 @@ module.exports = React.createClass({ // If this bug gets fixed, it will break SSO since it will open the SSO page in the // user's browser, let them log into their SSO provider, then redirect their browser // to vector://vector which, of course, will not work. - return ( + return
+ + { _t('Sign in with single sign-on') } - ); +
; }, render: function() { diff --git a/src/components/views/auth/PasswordLogin.js b/src/components/views/auth/PasswordLogin.js index 59acf0a034..63e77a938d 100644 --- a/src/components/views/auth/PasswordLogin.js +++ b/src/components/views/auth/PasswordLogin.js @@ -31,6 +31,7 @@ export default class PasswordLogin extends React.Component { static propTypes = { onSubmit: PropTypes.func.isRequired, // fn(username, password) onError: PropTypes.func, + onEditServerDetailsClick: PropTypes.func, onForgotPasswordClick: PropTypes.func, // fn() initialUsername: PropTypes.string, initialPhoneCountry: PropTypes.string, @@ -257,6 +258,7 @@ export default class PasswordLogin extends React.Component { render() { const Field = sdk.getComponent('elements.Field'); + const SignInToText = sdk.getComponent('views.auth.SignInToText'); let forgotPasswordJsx; @@ -273,33 +275,6 @@ export default class PasswordLogin extends React.Component { ; } - let signInToText = _t('Sign in to your Matrix account on %(serverName)s', { - serverName: this.props.serverConfig.hsName, - }); - if (this.props.serverConfig.hsNameIsDifferent) { - const TextWithTooltip = sdk.getComponent("elements.TextWithTooltip"); - - signInToText = _t('Sign in to your Matrix account on ', {}, { - 'underlinedServerName': () => { - return - {this.props.serverConfig.hsName} - ; - }, - }); - } - - let editLink = null; - if (this.props.onEditServerDetailsClick) { - editLink = - {_t('Change')} - ; - } - const pwFieldClass = classNames({ error: this.props.loginIncorrect && !this.isLoginEmpty(), // only error password if error isn't top field }); @@ -342,10 +317,8 @@ export default class PasswordLogin extends React.Component { return (
-

- {signInToText} - {editLink} -

+
{loginType} {loginField} diff --git a/src/components/views/auth/SignInToText.js b/src/components/views/auth/SignInToText.js new file mode 100644 index 0000000000..edbe2fd661 --- /dev/null +++ b/src/components/views/auth/SignInToText.js @@ -0,0 +1,62 @@ +/* +Copyright 2019 New Vector Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import React from 'react'; +import {_t} from "../../../languageHandler"; +import sdk from "../../../index"; +import PropTypes from "prop-types"; +import {ValidatedServerConfig} from "../../../utils/AutoDiscoveryUtils"; + +export default class SignInToText extends React.PureComponent { + static propTypes = { + serverConfig: PropTypes.instanceOf(ValidatedServerConfig).isRequired, + onEditServerDetailsClick: PropTypes.func, + }; + + render() { + let signInToText = _t('Sign in to your Matrix account on %(serverName)s', { + serverName: this.props.serverConfig.hsName, + }); + if (this.props.serverConfig.hsNameIsDifferent) { + const TextWithTooltip = sdk.getComponent("elements.TextWithTooltip"); + + signInToText = _t('Sign in to your Matrix account on ', {}, { + 'underlinedServerName': () => { + return ; + }, + }); + } + + let editLink = null; + if (this.props.onEditServerDetailsClick) { + editLink = + {_t('Change')} + ; + } + + return

+ {signInToText} + {editLink} +

; + } +}