Improve usability of the Server Picker Dialog

src/components/views/dialogs/ServerPickerDialog.tsx

@@ -14,7 +14,8 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import React, {createRef} from 'react';
+import React, {createRef} from "react";
+import {AutoDiscovery} from "matrix-js-sdk/src/autodiscovery";
 
 import AutoDiscoveryUtils, {ValidatedServerConfig} from "../../../utils/AutoDiscoveryUtils";
 import BaseDialog from './BaseDialog';
@@ -47,9 +48,10 @@ export default class ServerPickerDialog extends React.PureComponent<IProps, ISta
 
         const config = SdkConfig.get();
         this.defaultServer = config["validated_server_config"] as ValidatedServerConfig;
+        const { serverConfig } = this.props;
         this.state = {
-            defaultChosen: this.props.serverConfig.isDefault,
+            defaultChosen: serverConfig.isDefault,
-            otherHomeserver: this.props.serverConfig.isDefault ? "" : this.props.serverConfig.hsUrl,
+            otherHomeserver: serverConfig.isDefault ? "" : (serverConfig.hsName || serverConfig.hsUrl),
         };
     }
 
@@ -69,10 +71,25 @@ export default class ServerPickerDialog extends React.PureComponent<IProps, ISta
     // 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"
     private validate = withValidation<this, { error?: string }>({
-        deriveData: async ({ value: hsUrl }) => {
+        deriveData: async ({ value }) => {
-            // Always try and use the defaults first
+            let hsUrl = value.trim(); // trim to account for random whitespace
-            const defaultConfig: ValidatedServerConfig = SdkConfig.get()["validated_server_config"];
+
-            if (defaultConfig.hsUrl === hsUrl) return {};
+            // if the URL has no protocol, try validate it as a serverName via well-known
+            if (!hsUrl.includes("://")) {
+                try {
+                    const discoveryResult = await AutoDiscovery.findClientConfig(hsUrl);
+                    this.validatedConf = AutoDiscoveryUtils.buildValidatedConfigFromDiscovery(hsUrl, discoveryResult);
+                    return {}; // we have a validated config, we don't need to try the other paths
+                } catch (e) {
+                    console.error(`Attempted ${hsUrl} as a server_name but it failed`, e);
+                }
+            }
+
+            // if we got to this stage then either the well-known failed or the URL had a protocol specified,
+            // so validate statically only. If the URL has no protocol, default to https.
+            if (!hsUrl.includes("://")) {
+                hsUrl = "https://" + hsUrl;
+            }
 
             try {
                 this.validatedConf = await AutoDiscoveryUtils.validateServerConfigWithStaticUrls(hsUrl);
@@ -81,17 +98,22 @@ export default class ServerPickerDialog extends React.PureComponent<IProps, ISta
                 console.error(e);
 
                 const stateForError = AutoDiscoveryUtils.authComponentStateForError(e);
-                if (!stateForError.isFatalError) {
+                if (stateForError.isFatalError) {
-                    // carry on anyway
+                    let error = _t("Unable to validate homeserver");
-                    this.validatedConf = await AutoDiscoveryUtils.validateServerConfigWithStaticUrls(hsUrl, null, true);
-                    return {};
-                } else {
-                    let error = _t("Unable to validate homeserver/identity server");
                     if (e.translatedMessage) {
                         error = e.translatedMessage;
                     }
                     return { error };
                 }
+
+                // try to carry on anyway
+                try {
+                    this.validatedConf = await AutoDiscoveryUtils.validateServerConfigWithStaticUrls(hsUrl, null, true);
+                    return {};
+                } catch (e) {
+                    console.error(e);
+                    return { error: _t("Invalid URL") };
+                }
             }
         },
         rules: [

src/i18n/strings/en_EN.json

@@ -2155,7 +2155,8 @@
     "A connection error occurred while trying to contact the server.": "A connection error occurred while trying to contact the server.",
     "The server is not configured to indicate what the problem is (CORS).": "The server is not configured to indicate what the problem is (CORS).",
     "Recent changes that have not yet been received": "Recent changes that have not yet been received",
-    "Unable to validate homeserver/identity server": "Unable to validate homeserver/identity server",
+    "Unable to validate homeserver": "Unable to validate homeserver",
+    "Invalid URL": "Invalid URL",
     "Specify a homeserver": "Specify a homeserver",
     "Matrix.org is the biggest public homeserver in the world, so it’s a good place for many.": "Matrix.org is the biggest public homeserver in the world, so it’s a good place for many.",
     "Sign into your homeserver": "Sign into your homeserver",