Merge pull request #3549 from matrix-org/jryans/disconnect-dead-is

Show warning dialog when changing unreachable IS

src/components/views/settings/SetIdServer.js

@@ -28,6 +28,9 @@ import {SERVICE_TYPES} from "matrix-js-sdk";
 import {abbreviateUrl, unabbreviateUrl} from "../../../utils/UrlUtils";
 import { getDefaultIdentityServerUrl } from '../../../utils/IdentityServerUtils';
 
+// We'll wait up to this long when checking for 3PID bindings on the IS.
+const REACHABILITY_TIMEOUT = 10000; // ms
+
 /**
  * Check an IS URL is valid, including liveness check
  *
@@ -249,20 +252,61 @@ export default class SetIdServer extends React.Component {
     };
 
     async _showServerChangeWarning({ title, unboundMessage, button }) {
-        const threepids = await getThreepidsWithBindStatus(MatrixClientPeg.get());
+        const { currentClientIdServer } = this.state;
 
+        let threepids = [];
+        let currentServerReachable = true;
+        try {
+            threepids = await Promise.race([
+                getThreepidsWithBindStatus(MatrixClientPeg.get()),
+                new Promise((resolve, reject) => {
+                    setTimeout(() => {
+                        reject(new Error("Timeout attempting to reach identity server"));
+                    }, REACHABILITY_TIMEOUT);
+                }),
+            ]);
+        } catch (e) {
+            currentServerReachable = false;
+            console.warn(
+                `Unable to reach identity server at ${currentClientIdServer} to check ` +
+                `for 3PIDs during IS change flow`,
+            );
+            console.warn(e);
+        }
         const boundThreepids = threepids.filter(tp => tp.bound);
         let message;
         let danger = false;
-        if (boundThreepids.length) {
+        const messageElements = {
+            idserver: sub => <b>{abbreviateUrl(currentClientIdServer)}</b>,
+            b: sub => <b>{sub}</b>,
+        };
+        if (!currentServerReachable) {
+            message = <div>
+                <p>{_t(
+                    "You should <b>remove your personal data</b> from identity server " +
+                    "<idserver /> before disconnecting. Unfortunately, identity server " +
+                    "<idserver /> is currently offline or cannot be reached.",
+                    {}, messageElements,
+                )}</p>
+                <p>{_t("You should:")}</p>
+                <ul>
+                    <li>{_t(
+                        "check your browser plugins for anything that might block " +
+                        "the identity server (such as Privacy Badger)",
+                    )}</li>
+                    <li>{_t("contact the administrators of identity server <idserver />", {}, {
+                        idserver: messageElements.idserver,
+                    })}</li>
+                    <li>{_t("wait and try again later")}</li>
+                </ul>
+            </div>;
+            danger = true;
+            button = _t("Disconnect anyway");
+        } else if (boundThreepids.length) {
             message = <div>
                 <p>{_t(
                     "You are still <b>sharing your personal data</b> on the identity " +
-                    "server <idserver />.", {},
-                    {
-                        idserver: sub => <b>{abbreviateUrl(this.state.currentClientIdServer)}</b>,
-                        b: sub => <b>{sub}</b>,
-                    },
+                    "server <idserver />.", {}, messageElements,
                 )}</p>
                 <p>{_t(
                     "We recommend that you remove your email addresses and phone numbers " +

src/components/views/settings/tabs/user/GeneralUserSettingsTab.js

@@ -102,7 +102,17 @@ export default class GeneralUserSettingsTab extends React.Component {
 
         // Need to get 3PIDs generally for Account section and possibly also for
         // Discovery (assuming we have an IS and terms are agreed).
-        const threepids = await getThreepidsWithBindStatus(cli);
+        let threepids = [];
+        try {
+            threepids = await getThreepidsWithBindStatus(cli);
+        } catch (e) {
+            const idServerUrl = MatrixClientPeg.get().getIdentityServerUrl();
+            console.warn(
+                `Unable to reach identity server at ${idServerUrl} to check ` +
+                `for 3PIDs bindings in Settings`,
+            );
+            console.warn(e);
+        }
         this.setState({ emails: threepids.filter((a) => a.medium === 'email') });
         this.setState({ msisdns: threepids.filter((a) => a.medium === 'msisdn') });
     }
@@ -115,32 +125,40 @@ export default class GeneralUserSettingsTab extends React.Component {
 
         // By starting the terms flow we get the logic for checking which terms the user has signed
         // for free. So we might as well use that for our own purposes.
+        const idServerUrl = MatrixClientPeg.get().getIdentityServerUrl();
         const authClient = new IdentityAuthClient();
         const idAccessToken = await authClient.getAccessToken({ check: false });
-        startTermsFlow([new Service(
-            SERVICE_TYPES.IS,
-            MatrixClientPeg.get().getIdentityServerUrl(),
-            idAccessToken,
-        )], (policiesAndServices, agreedUrls, extraClassNames) => {
-            return new Promise((resolve, reject) => {
-               this.setState({
-                   idServerName: abbreviateUrl(MatrixClientPeg.get().getIdentityServerUrl()),
-                   requiredPolicyInfo: {
-                       hasTerms: true,
-                       policiesAndServices,
-                       agreedUrls,
-                       resolve,
-                   },
-               });
+        try {
+            await startTermsFlow([new Service(
+                SERVICE_TYPES.IS,
+                idServerUrl,
+                idAccessToken,
+            )], (policiesAndServices, agreedUrls, extraClassNames) => {
+                return new Promise((resolve, reject) => {
+                    this.setState({
+                        idServerName: abbreviateUrl(idServerUrl),
+                        requiredPolicyInfo: {
+                            hasTerms: true,
+                            policiesAndServices,
+                            agreedUrls,
+                            resolve,
+                        },
+                    });
+                });
             });
-        }).then(() => {
             // User accepted all terms
             this.setState({
                 requiredPolicyInfo: {
                     hasTerms: false,
                 },
             });
-        });
+        } catch (e) {
+            console.warn(
+                `Unable to reach identity server at ${idServerUrl} to check ` +
+                `for terms in Settings`,
+            );
+            console.warn(e);
+        }
     }
 
     _onLanguageChange = (newLanguage) => {