Properly translate errors in AddThreepid.ts so they show up translated to the user but not in our logs

src/AddThreepid.ts

@@ -20,7 +20,7 @@ import { IAuthData, IRequestMsisdnTokenResponse, IRequestTokenResponse } from "m
 
 import { MatrixClientPeg } from "./MatrixClientPeg";
 import Modal from "./Modal";
-import { _t } from "./languageHandler";
+import { _t, newTranslatableError } from "./languageHandler";
 import IdentityAuthClient from "./IdentityAuthClient";
 import { SSOAuthEntry } from "./components/views/auth/InteractiveAuthEntryComponents";
 import InteractiveAuthDialog from "./components/views/dialogs/InteractiveAuthDialog";
@@ -67,23 +67,23 @@ export default class AddThreepid {
      * @param {string} emailAddress The email address to add
      * @return {Promise} Resolves when the email has been sent. Then call checkEmailLinkClicked().
      */
-    public addEmailAddress(emailAddress: string): Promise<IRequestTokenResponse> {
-        return MatrixClientPeg.get()
-            .requestAdd3pidEmailToken(emailAddress, this.clientSecret, 1)
-            .then(
-                (res) => {
-                    this.sessionId = res.sid;
-                    return res;
-                },
-                function (err) {
-                    if (err.errcode === "M_THREEPID_IN_USE") {
-                        err.message = _t("This email address is already in use");
-                    } else if (err.httpStatus) {
-                        err.message = err.message + ` (Status ${err.httpStatus})`;
-                    }
-                    throw err;
-                },
-            );
+    public async addEmailAddress(emailAddress: string): Promise<IRequestTokenResponse> {
+        try {
+            const res = await MatrixClientPeg.get().requestAdd3pidEmailToken(emailAddress, this.clientSecret, 1);
+            this.sessionId = res.sid;
+            return res;
+        } catch (err) {
+            if (err.errcode === "M_THREEPID_IN_USE") {
+                throw newTranslatableError("This email address is already in use");
+            } else if (err.httpStatus) {
+                throw newTranslatableError("%(errorMessage)s (Status %(httpStatus)s)", {
+                    errorMessage: err.message,
+                    httpStatus: err.httpStatus,
+                });
+            }
+            // Otherwise, just blurt out the same error
+            throw err;
+        }
     }
 
     /**
@@ -98,22 +98,28 @@ export default class AddThreepid {
             // For separate bind, request a token directly from the IS.
             const authClient = new IdentityAuthClient();
             const identityAccessToken = (await authClient.getAccessToken()) ?? undefined;
-            return MatrixClientPeg.get()
-                .requestEmailToken(emailAddress, this.clientSecret, 1, undefined, identityAccessToken)
-                .then(
-                    (res) => {
-                        this.sessionId = res.sid;
-                        return res;
-                    },
-                    function (err) {
-                        if (err.errcode === "M_THREEPID_IN_USE") {
-                            err.message = _t("This email address is already in use");
-                        } else if (err.httpStatus) {
-                            err.message = err.message + ` (Status ${err.httpStatus})`;
-                        }
-                        throw err;
-                    },
+            try {
+                const res = await MatrixClientPeg.get().requestEmailToken(
+                    emailAddress,
+                    this.clientSecret,
+                    1,
+                    undefined,
+                    identityAccessToken,
                 );
+                this.sessionId = res.sid;
+                return res;
+            } catch (err) {
+                if (err.errcode === "M_THREEPID_IN_USE") {
+                    throw newTranslatableError("This email address is already in use");
+                } else if (err.httpStatus) {
+                    throw newTranslatableError("%(errorMessage)s (Status %(httpStatus)s)", {
+                        errorMessage: err.message,
+                        httpStatus: err.httpStatus,
+                    });
+                }
+                // Otherwise, just blurt out the same error
+                throw err;
+            }
         } else {
             // For tangled bind, request a token via the HS.
             return this.addEmailAddress(emailAddress);
@@ -127,24 +133,29 @@ export default class AddThreepid {
      * @param {string} phoneNumber The national or international formatted phone number to add
      * @return {Promise} Resolves when the text message has been sent. Then call haveMsisdnToken().
      */
-    public addMsisdn(phoneCountry: string, phoneNumber: string): Promise<IRequestMsisdnTokenResponse> {
-        return MatrixClientPeg.get()
-            .requestAdd3pidMsisdnToken(phoneCountry, phoneNumber, this.clientSecret, 1)
-            .then(
-                (res) => {
-                    this.sessionId = res.sid;
-                    this.submitUrl = res.submit_url;
-                    return res;
-                },
-                function (err) {
-                    if (err.errcode === "M_THREEPID_IN_USE") {
-                        err.message = _t("This phone number is already in use");
-                    } else if (err.httpStatus) {
-                        err.message = err.message + ` (Status ${err.httpStatus})`;
-                    }
-                    throw err;
-                },
+    public async addMsisdn(phoneCountry: string, phoneNumber: string): Promise<IRequestMsisdnTokenResponse> {
+        try {
+            const res = await MatrixClientPeg.get().requestAdd3pidMsisdnToken(
+                phoneCountry,
+                phoneNumber,
+                this.clientSecret,
+                1,
             );
+            this.sessionId = res.sid;
+            this.submitUrl = res.submit_url;
+            return res;
+        } catch (err) {
+            if (err.errcode === "M_THREEPID_IN_USE") {
+                throw newTranslatableError("This phone number is already in use");
+            } else if (err.httpStatus) {
+                throw newTranslatableError("%(errorMessage)s (Status %(httpStatus)s)", {
+                    errorMessage: err.message,
+                    httpStatus: err.httpStatus,
+                });
+            }
+            // Otherwise, just blurt out the same error
+            throw err;
+        }
     }
 
     /**
@@ -160,22 +171,29 @@ export default class AddThreepid {
             // For separate bind, request a token directly from the IS.
             const authClient = new IdentityAuthClient();
             const identityAccessToken = (await authClient.getAccessToken()) ?? undefined;
-            return MatrixClientPeg.get()
-                .requestMsisdnToken(phoneCountry, phoneNumber, this.clientSecret, 1, undefined, identityAccessToken)
-                .then(
-                    (res) => {
-                        this.sessionId = res.sid;
-                        return res;
-                    },
-                    function (err) {
-                        if (err.errcode === "M_THREEPID_IN_USE") {
-                            err.message = _t("This phone number is already in use");
-                        } else if (err.httpStatus) {
-                            err.message = err.message + ` (Status ${err.httpStatus})`;
-                        }
-                        throw err;
-                    },
+            try {
+                const res = await MatrixClientPeg.get().requestMsisdnToken(
+                    phoneCountry,
+                    phoneNumber,
+                    this.clientSecret,
+                    1,
+                    undefined,
+                    identityAccessToken,
                 );
+                this.sessionId = res.sid;
+                return res;
+            } catch (err) {
+                if (err.errcode === "M_THREEPID_IN_USE") {
+                    throw newTranslatableError("This phone number is already in use");
+                } else if (err.httpStatus) {
+                    throw newTranslatableError("%(errorMessage)s (Status %(httpStatus)s)", {
+                        errorMessage: err.message,
+                        httpStatus: err.httpStatus,
+                    });
+                }
+                // Otherwise, just blurt out the same error
+                throw err;
+            }
         } else {
             // For tangled bind, request a token via the HS.
             return this.addMsisdn(phoneCountry, phoneNumber);
@@ -257,10 +275,16 @@ export default class AddThreepid {
             }
         } catch (err) {
             if (err.httpStatus === 401) {
-                err.message = _t("Failed to verify email address: make sure you clicked the link in the email");
+                throw newTranslatableError(
+                    "Failed to verify email address: make sure you clicked the link in the email",
+                );
             } else if (err.httpStatus) {
-                err.message += ` (Status ${err.httpStatus})`;
+                throw newTranslatableError("%(errorMessage)s (Status %(httpStatus)s)", {
+                    errorMessage: err.message,
+                    httpStatus: err.httpStatus,
+                });
             }
+            // Otherwise, just blurt out the same error
             throw err;
         }
         return [];

src/components/views/dialogs/SetEmailDialog.tsx

@@ -88,7 +88,7 @@ export default class SetEmailDialog extends React.Component<IProps, IState> {
                 logger.error("Unable to add email address " + emailAddress + " " + err);
                 Modal.createDialog(ErrorDialog, {
                     title: _t("Unable to add email address"),
-                    description: err && err.message ? err.message : _t("Operation failed"),
+                    description: err?.translatedMessage || err?.message || _t("Operation failed"),
                 });
             },
         );
@@ -131,7 +131,7 @@ export default class SetEmailDialog extends React.Component<IProps, IState> {
                     logger.error("Unable to verify email address: " + err);
                     Modal.createDialog(ErrorDialog, {
                         title: _t("Unable to verify email address."),
-                        description: err && err.message ? err.message : _t("Operation failed"),
+                        description: err?.translatedMessage || err?.message || _t("Operation failed"),
                     });
                 }
             },

src/components/views/settings/account/EmailAddresses.tsx

@@ -190,7 +190,7 @@ export default class EmailAddresses extends React.Component<IProps, IState> {
                 this.setState({ verifying: false, continueDisabled: false, addTask: null });
                 Modal.createDialog(ErrorDialog, {
                     title: _t("Unable to add email address"),
-                    description: err && err.message ? err.message : _t("Operation failed"),
+                    description: err?.translatedMessage || err?.message || _t("Operation failed"),
                 });
             });
     };
@@ -230,7 +230,7 @@ export default class EmailAddresses extends React.Component<IProps, IState> {
                     logger.error("Unable to verify email address: ", err);
                     Modal.createDialog(ErrorDialog, {
                         title: _t("Unable to verify email address."),
-                        description: err && err.message ? err.message : _t("Operation failed"),
+                        description: err?.translatedMessage || err?.message || _t("Operation failed"),
                     });
                 }
             });

src/components/views/settings/account/PhoneNumbers.tsx

@@ -192,7 +192,7 @@ export default class PhoneNumbers extends React.Component<IProps, IState> {
                 this.setState({ verifying: false, continueDisabled: false, addTask: null });
                 Modal.createDialog(ErrorDialog, {
                     title: _t("Error"),
-                    description: err && err.message ? err.message : _t("Operation failed"),
+                    description: err?.translatedMessage || err?.message || _t("Operation failed"),
                 });
             });
     };

src/components/views/settings/discovery/EmailAddresses.tsx

@@ -106,7 +106,7 @@ export class EmailAddress extends React.Component<IEmailAddressProps, IEmailAddr
             });
             Modal.createDialog(ErrorDialog, {
                 title: errorTitle,
-                description: err && err.message ? err.message : _t("Operation failed"),
+                description: err?.translatedMessage || err?.message || _t("Operation failed"),
             });
         }
     }
@@ -141,7 +141,7 @@ export class EmailAddress extends React.Component<IEmailAddressProps, IEmailAddr
             });
             Modal.createDialog(ErrorDialog, {
                 title: errorTitle,
-                description: err && err.message ? err.message : _t("Operation failed"),
+                description: err?.translatedMessage || err?.message || _t("Operation failed"),
             });
         }
     }
@@ -191,7 +191,7 @@ export class EmailAddress extends React.Component<IEmailAddressProps, IEmailAddr
                 logger.error("Unable to verify email address: " + err);
                 Modal.createDialog(ErrorDialog, {
                     title: _t("Unable to verify email address."),
-                    description: err && err.message ? err.message : _t("Operation failed"),
+                    description: err?.translatedMessage || err?.message || _t("Operation failed"),
                 });
             }
         }

src/components/views/settings/discovery/PhoneNumbers.tsx

@@ -107,7 +107,7 @@ export class PhoneNumber extends React.Component<IPhoneNumberProps, IPhoneNumber
             });
             Modal.createDialog(ErrorDialog, {
                 title: errorTitle,
-                description: err && err.message ? err.message : _t("Operation failed"),
+                description: err?.translatedMessage || err?.message || _t("Operation failed"),
             });
         }
     }
@@ -148,7 +148,7 @@ export class PhoneNumber extends React.Component<IPhoneNumberProps, IPhoneNumber
             });
             Modal.createDialog(ErrorDialog, {
                 title: errorTitle,
-                description: err && err.message ? err.message : _t("Operation failed"),
+                description: err?.translatedMessage || err?.message || _t("Operation failed"),
             });
         }
     }