diff --git a/res/css/views/auth/_ServerConfig.scss b/res/css/views/auth/_ServerConfig.scss index a31feb75d7..a7e0057ab3 100644 --- a/res/css/views/auth/_ServerConfig.scss +++ b/res/css/views/auth/_ServerConfig.scss @@ -1,5 +1,6 @@ /* Copyright 2015, 2016 OpenMarket Ltd +Copyright 2019 The Matrix.org Foundation C.I.C. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -14,23 +15,6 @@ See the License for the specific language governing permissions and limitations under the License. */ -.mx_ServerConfig_fields { - display: flex; - margin: 1em 0; -} - -.mx_ServerConfig_fields .mx_Field { - margin: 0 5px; -} - -.mx_ServerConfig_fields .mx_Field:first-child { - margin-left: 0; -} - -.mx_ServerConfig_fields .mx_Field:last-child { - margin-right: 0; -} - .mx_ServerConfig_help:link { opacity: 0.8; } @@ -39,3 +23,13 @@ limitations under the License. display: block; color: $warning-color; } + +.mx_ServerConfig_identityServer { + transform: scaleY(0); + transform-origin: top; + transition: transform 0.25s; + + &.mx_ServerConfig_identityServer_shown { + transform: scaleY(1); + } +} diff --git a/src/components/structures/auth/ForgotPassword.js b/src/components/structures/auth/ForgotPassword.js index 6d80f66d64..11c0ff8295 100644 --- a/src/components/structures/auth/ForgotPassword.js +++ b/src/components/structures/auth/ForgotPassword.js @@ -1,6 +1,7 @@ /* Copyright 2015, 2016 OpenMarket Ltd Copyright 2017, 2018, 2019 New Vector Ltd +Copyright 2019 The Matrix.org Foundation C.I.C. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -208,6 +209,7 @@ module.exports = React.createClass({ serverConfig={this.props.serverConfig} onServerConfigChange={this.props.onServerConfigChange} delayTimeMs={0} + showIdentityServerIfRequiredByHomeserver={true} onAfterSubmit={this.onServerDetailsNextPhaseClick} submitText={_t("Next")} submitClass="mx_Login_submit" diff --git a/src/components/structures/auth/Registration.js b/src/components/structures/auth/Registration.js index 63c5b267cf..2fd028ea1d 100644 --- a/src/components/structures/auth/Registration.js +++ b/src/components/structures/auth/Registration.js @@ -499,6 +499,7 @@ module.exports = React.createClass({ serverConfig={this.props.serverConfig} onServerConfigChange={this.props.onServerConfigChange} delayTimeMs={250} + showIdentityServerIfRequiredByHomeserver={true} {...serverDetailsProps} />; break; diff --git a/src/components/views/auth/ServerConfig.js b/src/components/views/auth/ServerConfig.js index 8197afd512..81777abb73 100644 --- a/src/components/views/auth/ServerConfig.js +++ b/src/components/views/auth/ServerConfig.js @@ -1,6 +1,7 @@ /* Copyright 2015, 2016 OpenMarket Ltd Copyright 2019 New Vector Ltd +Copyright 2019 The Matrix.org Foundation C.I.C. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -23,6 +24,8 @@ import { _t } from '../../../languageHandler'; import {ValidatedServerConfig} from "../../../utils/AutoDiscoveryUtils"; import AutoDiscoveryUtils from "../../../utils/AutoDiscoveryUtils"; import SdkConfig from "../../../SdkConfig"; +import { createClient } from 'matrix-js-sdk/lib/matrix'; +import classNames from 'classnames'; /* * A pure UI component which displays the HS and IS to use. @@ -46,6 +49,10 @@ export default class ServerConfig extends React.PureComponent { // Optional class for the submit button. Only applies if the submit button // is to be rendered. submitClass: PropTypes.string, + + // Whether the flow this component is embedded in requires an identity + // server when the homeserver says it will need one. Default false. + showIdentityServerIfRequiredByHomeserver: PropTypes.bool, }; static defaultProps = { @@ -61,6 +68,7 @@ export default class ServerConfig extends React.PureComponent { errorText: "", hsUrl: props.serverConfig.hsUrl, isUrl: props.serverConfig.isUrl, + showIdentityServer: false, }; } @@ -75,7 +83,29 @@ export default class ServerConfig extends React.PureComponent { // TODO: Do we want to support .well-known lookups here? // If for some reason someone enters "matrix.org" for a URL, we could do a lookup to // find their homeserver without demanding they use "https://matrix.org" - return this.validateAndApplyServer(this.state.hsUrl, this.state.isUrl); + const result = this.validateAndApplyServer(this.state.hsUrl, this.state.isUrl); + if (!result) { + return result; + } + + // If the UI flow this component is embedded in requires an identity + // server when the homeserver says it will need one, check first and + // reveal this field if not already shown. + // XXX: This a backward compatibility path for homeservers that require + // an identity server to be passed during certain flows. + // See also https://github.com/matrix-org/synapse/pull/5868. + if ( + this.props.showIdentityServerIfRequiredByHomeserver && + !this.state.showIdentityServer && + await this.isIdentityServerRequiredByHomeserver() + ) { + this.setState({ + showIdentityServer: true, + }); + return null; + } + + return result; } async validateAndApplyServer(hsUrl, isUrl) { @@ -131,6 +161,15 @@ export default class ServerConfig extends React.PureComponent { } } + async isIdentityServerRequiredByHomeserver() { + // XXX: We shouldn't have to create a whole new MatrixClient just to + // check if the homeserver requires an identity server... Should it be + // extracted to a static utils function...? + return createClient({ + baseUrl: this.state.hsUrl, + }).doesServerRequireIdServerParam(); + } + onHomeserverBlur = (ev) => { this._hsTimeoutId = this._waitThenInvoke(this._hsTimeoutId, () => { this.validateServer(); @@ -176,8 +215,49 @@ export default class ServerConfig extends React.PureComponent { Modal.createTrackedDialog('Custom Server Dialog', '', CustomServerDialog); }; - render() { + _renderHomeserverSection() { const Field = sdk.getComponent('elements.Field'); + return
+ {_t("Enter your custom homeserver URL What does this mean?", {}, { + a: sub => + {sub} + , + })} + +
; + } + + _renderIdentityServerSection() { + const Field = sdk.getComponent('elements.Field'); + const classes = classNames({ + "mx_ServerConfig_identityServer": true, + "mx_ServerConfig_identityServer_shown": this.state.showIdentityServer, + }); + return
+ {_t("Enter your custom identity server URL What does this mean?", {}, { + a: sub => + {sub} + , + })} + +
; + } + + render() { const AccessibleButton = sdk.getComponent('elements.AccessibleButton'); const errorText = this.state.errorText @@ -196,31 +276,10 @@ export default class ServerConfig extends React.PureComponent { return (

{_t("Other servers")}

- {_t("Enter custom server URLs What does this mean?", {}, { - a: sub => - { sub } - , - })} {errorText} + {this._renderHomeserverSection()} + {this._renderIdentityServerSection()}
-
- - -
{submitButton}
diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index f990d93112..e024f4e2e9 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -1466,10 +1466,11 @@ "Set an email for account recovery. Use email or phone to optionally be discoverable by existing contacts.": "Set an email for account recovery. Use email or phone to optionally be discoverable by existing contacts.", "Set an email for account recovery. Use email to optionally be discoverable by existing contacts.": "Set an email for account recovery. Use email to optionally be discoverable by existing contacts.", "No Identity Server is configured: no email addreses can be added. You will be unable to reset your password.": "No Identity Server is configured: no email addreses can be added. You will be unable to reset your password.", - "Other servers": "Other servers", - "Enter custom server URLs What does this mean?": "Enter custom server URLs What does this mean?", + "Enter your custom homeserver URL What does this mean?": "Enter your custom homeserver URL What does this mean?", "Homeserver URL": "Homeserver URL", + "Enter your custom identity server URL What does this mean?": "Enter your custom identity server URL What does this mean?", "Identity Server URL": "Identity Server URL", + "Other servers": "Other servers", "Free": "Free", "Join millions for free on the largest public server": "Join millions for free on the largest public server", "Premium": "Premium",