From f4b718008765a0a0a72ca60f15fcc79f2227319b Mon Sep 17 00:00:00 2001
From: "J. Ryan Stinnett" <jryans@gmail.com>
Date: Wed, 20 Feb 2019 13:40:30 +0000
Subject: [PATCH] Display default server name in login

If a default server name is set and the current HS URL is the default HS URL,
we'll display that name in the "sign in to" text on the login form.

This can be a bit more user friendly, especially when the HS is delegated to
somewhere such as Modular, since you'll then see "example.com" instead of
"example.modular.im", which you have no direct relationship with as a user.

This is the key bit of https://github.com/vector-im/riot-web/issues/8763 for
login.
---
 src/components/structures/MatrixChat.js    |  1 +
 src/components/structures/auth/Login.js    | 23 ++++++++++++++++++----
 src/components/views/auth/PasswordLogin.js | 22 ++++++++++++++++-----
 3 files changed, 37 insertions(+), 9 deletions(-)

diff --git a/src/components/structures/MatrixChat.js b/src/components/structures/MatrixChat.js
index b8d78fc447..7de4141192 100644
--- a/src/components/structures/MatrixChat.js
+++ b/src/components/structures/MatrixChat.js
@@ -1924,6 +1924,7 @@ export default React.createClass({
                 <Login
                     onLoggedIn={Lifecycle.setLoggedIn}
                     onRegisterClick={this.onRegisterClick}
+                    defaultServerName={this.getDefaultServerName()}
                     defaultServerDiscoveryError={this.state.defaultServerDiscoveryError}
                     defaultHsUrl={this.getDefaultHsUrl()}
                     defaultIsUrl={this.getDefaultIsUrl()}
diff --git a/src/components/structures/auth/Login.js b/src/components/structures/auth/Login.js
index 025f68bb8f..4e3048483b 100644
--- a/src/components/structures/auth/Login.js
+++ b/src/components/structures/auth/Login.js
@@ -56,6 +56,15 @@ module.exports = React.createClass({
 
         enableGuest: PropTypes.bool,
 
+        // The default server name to use when the user hasn't specified
+        // one. If set, `defaultHsUrl` and `defaultHsUrl` were derived for this
+        // via `.well-known` discovery. The server name is used instead of the
+        // HS URL when talking about where to "sign in to".
+        defaultServerName: PropTypes.string,
+        // An error passed along from higher up explaining that something
+        // went wrong when finding the defaultHsUrl.
+        defaultServerDiscoveryError: PropTypes.string,
+
         customHsUrl: PropTypes.string,
         customIsUrl: PropTypes.string,
         defaultHsUrl: PropTypes.string,
@@ -65,10 +74,6 @@ module.exports = React.createClass({
         // different homeserver without confusing users.
         fallbackHsUrl: PropTypes.string,
 
-        // An error passed along from higher up explaining that something
-        // went wrong when finding the defaultHsUrl.
-        defaultServerDiscoveryError: PropTypes.string,
-
         defaultDeviceDisplayName: PropTypes.string,
 
         // login shouldn't know or care how registration is done.
@@ -563,11 +568,20 @@ module.exports = React.createClass({
 
     _renderPasswordStep: function() {
         const PasswordLogin = sdk.getComponent('auth.PasswordLogin');
+
         let onEditServerDetailsClick = null;
         // If custom URLs are allowed, wire up the server details edit link.
         if (PHASES_ENABLED && !SdkConfig.get()['disable_custom_urls']) {
             onEditServerDetailsClick = this.onEditServerDetailsClick;
         }
+
+        // If the current HS URL is the default HS URL, then we can label it
+        // with the default HS name (if it exists).
+        let hsName;
+        if (this.state.enteredHsUrl === this.props.defaultHsUrl) {
+            hsName = this.props.defaultServerName;
+        }
+
         return (
             <PasswordLogin
                onSubmit={this.onPasswordLogin}
@@ -583,6 +597,7 @@ module.exports = React.createClass({
                onPhoneNumberBlur={this.onPhoneNumberBlur}
                onForgotPasswordClick={this.props.onForgotPasswordClick}
                loginIncorrect={this.state.loginIncorrect}
+               hsName={hsName}
                hsUrl={this.state.enteredHsUrl}
                disableSubmit={this.state.findingHomeserver}
                />
diff --git a/src/components/views/auth/PasswordLogin.js b/src/components/views/auth/PasswordLogin.js
index 8db30c6d43..87fbc9c9fb 100644
--- a/src/components/views/auth/PasswordLogin.js
+++ b/src/components/views/auth/PasswordLogin.js
@@ -40,6 +40,10 @@ class PasswordLogin extends React.Component {
         initialPhoneNumber: "",
         initialPassword: "",
         loginIncorrect: false,
+        // This is optional and only set if we used a server name to determine
+        // the HS URL via `.well-known` discovery. The server name is used
+        // instead of the HS URL when talking about where to "sign in to".
+        hsName: null,
         hsUrl: "",
         disableSubmit: false,
     }
@@ -250,13 +254,19 @@ class PasswordLogin extends React.Component {
         }
 
         let signInToText = _t('Sign in');
-        try {
-            const parsedHsUrl = new URL(this.props.hsUrl);
+        if (this.props.hsName) {
             signInToText = _t('Sign in to %(serverName)s', {
-                serverName: parsedHsUrl.hostname,
+                serverName: this.props.hsName,
             });
-        } catch (e) {
-            // ignore
+        } else {
+            try {
+                const parsedHsUrl = new URL(this.props.hsUrl);
+                signInToText = _t('Sign in to %(serverName)s', {
+                    serverName: parsedHsUrl.hostname,
+                });
+            } catch (e) {
+                // ignore
+            }
         }
 
         let editLink = null;
@@ -338,6 +348,8 @@ PasswordLogin.propTypes = {
     onPhoneNumberChanged: PropTypes.func,
     onPasswordChanged: PropTypes.func,
     loginIncorrect: PropTypes.bool,
+    hsName: PropTypes.string,
+    hsUrl: PropTypes.string,
     disableSubmit: PropTypes.bool,
 };