Migrate more strings to translation keys (#11642)

src/components/views/auth/EmailField.tsx

@@ -40,9 +40,9 @@ interface IProps extends Omit<IInputProps, "onValidate" | "element"> {
 
 class EmailField extends PureComponent<IProps> {
     public static defaultProps = {
-        label: _td("Email"),
-        labelRequired: _td("Enter email address"),
-        labelInvalid: _td("Doesn't look like a valid email address"),
+        label: _td("auth|email_field_label"),
+        labelRequired: _td("auth|email_field_label_required"),
+        labelInvalid: _td("auth|email_field_label_invalid"),
     };
 
     public readonly validate = withValidation({

src/components/views/auth/InteractiveAuthEntryComponents.tsx

@@ -169,7 +169,7 @@ export class PasswordAuthEntry extends React.Component<IAuthEntryProps, IPasswor
 
         return (
             <div>
-                <p>{_t("Confirm your identity by entering your account password below.")}</p>
+                <p>{_t("auth|uia|password_prompt")}</p>
                 <form onSubmit={this.onSubmit} className="mx_InteractiveAuthEntryComponents_passwordSection">
                     <Field
                         className={passwordBoxClass}
@@ -219,9 +219,7 @@ export class RecaptchaAuthEntry extends React.Component<IRecaptchaAuthEntryProps
 
         let sitePublicKey: string | undefined;
         if (!this.props.stageParams || !this.props.stageParams.public_key) {
-            errorText = _t(
-                "Missing captcha public key in homeserver configuration. Please report this to your homeserver administrator.",
-            );
+            errorText = _t("auth|uia|recaptcha_missing_params");
         } else {
             sitePublicKey = this.props.stageParams.public_key;
         }
@@ -352,7 +350,7 @@ export class TermsAuthEntry extends React.Component<ITermsAuthEntryProps, ITerms
         if (allChecked) {
             this.props.submitAuthDict({ type: AuthType.Terms });
         } else {
-            this.setState({ errorText: _t("Please review and accept all of the homeserver's policies") });
+            this.setState({ errorText: _t("auth|uia|terms_invalid") });
         }
     };
 
@@ -403,7 +401,7 @@ export class TermsAuthEntry extends React.Component<ITermsAuthEntryProps, ITerms
 
         return (
             <div className="mx_InteractiveAuthEntryComponents">
-                <p>{_t("Please review and accept the policies of this homeserver:")}</p>
+                <p>{_t("auth|uia|terms")}</p>
                 {checkboxes}
                 {errorSection}
                 {submitButton}
@@ -474,19 +472,19 @@ export class EmailIdentityAuthEntry extends React.Component<
             return (
                 <div className="mx_InteractiveAuthEntryComponents_emailWrapper">
                     <AuthHeaderModifier
-                        title={_t("Check your email to continue")}
-                        icon={<img src={EmailPromptIcon} alt={_t("Unread email icon")} width={16} />}
+                        title={_t("auth|uia|email_auth_header")}
+                        icon={<img src={EmailPromptIcon} role="presentation" alt="" width={16} />}
                         hideServerPicker={true}
                     />
                     <p>
-                        {_t("To create your account, open the link in the email we just sent to %(emailAddress)s.", {
+                        {_t("auth|uia|email", {
                             emailAddress: <b>{this.props.inputs.emailAddress}</b>,
                         })}
                     </p>
                     {this.state.requesting ? (
                         <p className="secondary">
                             {_t(
-                                "Did not receive it? <a>Resend it</a>",
+                                "auth|uia|email_resend_prompt",
                                 {},
                                 {
                                     a: (text: string) => (
@@ -502,13 +500,15 @@ export class EmailIdentityAuthEntry extends React.Component<
                     ) : (
                         <p className="secondary">
                             {_t(
-                                "Did not receive it? <a>Resend it</a>",
+                                "auth|uia|email_resend_prompt",
                                 {},
                                 {
                                     a: (text: string) => (
                                         <AccessibleTooltipButton
                                             kind="link_inline"
-                                            title={this.state.requested ? _t("Resent!") : _t("action|resend")}
+                                            title={
+                                                this.state.requested ? _t("auth|uia|email_resent") : _t("action|resend")
+                                            }
                                             alignment={Alignment.Right}
                                             onHideTooltip={
                                                 this.state.requested
@@ -642,7 +642,7 @@ export class MsisdnAuthEntry extends React.Component<IMsisdnAuthEntryProps, IMsi
                 });
             } else {
                 this.setState({
-                    errorText: _t("Token incorrect"),
+                    errorText: _t("auth|uia|msisdn_token_incorrect"),
                 });
             }
         } catch (e) {
@@ -670,8 +670,8 @@ export class MsisdnAuthEntry extends React.Component<IMsisdnAuthEntryProps, IMsi
             }
             return (
                 <div>
-                    <p>{_t("A text message has been sent to %(msisdn)s", { msisdn: <i>{this.msisdn}</i> })}</p>
-                    <p>{_t("Please enter the code it contains:")}</p>
+                    <p>{_t("auth|uia|msisdn", { msisdn: <i>{this.msisdn}</i> })}</p>
+                    <p>{_t("auth|uia|msisdn_token_prompt")}</p>
                     <div className="mx_InteractiveAuthEntryComponents_msisdnWrapper">
                         <form onSubmit={this.onFormSubmit}>
                             <input
@@ -761,13 +761,13 @@ export class RegistrationTokenAuthEntry extends React.Component<IAuthEntryProps,
 
         return (
             <div>
-                <p>{_t("Enter a registration token provided by the homeserver administrator.")}</p>
+                <p>{_t("auth|uia|registration_token_prompt")}</p>
                 <form onSubmit={this.onSubmit} className="mx_InteractiveAuthEntryComponents_registrationTokenSection">
                     <Field
                         className={registrationTokenBoxClass}
                         type="text"
                         name="registrationTokenField"
-                        label={_t("Registration token")}
+                        label={_t("auth|uia|registration_token_label")}
                         autoFocus={true}
                         value={this.state.registrationToken}
                         onChange={this.onRegistrationTokenFieldChange}
@@ -895,7 +895,7 @@ export class SSOAuthEntry extends React.Component<ISSOAuthEntryProps, ISSOAuthEn
         } else if (this.state.attemptFailed) {
             errorSection = (
                 <div className="error" role="alert">
-                    {_t("Something went wrong in confirming your identity. Cancel and try again.")}
+                    {_t("auth|uia|sso_failed")}
                 </div>
             );
         }
@@ -972,7 +972,7 @@ export class FallbackAuthEntry extends React.Component<IAuthEntryProps> {
         return (
             <div>
                 <AccessibleButton kind="link" inputRef={this.fallbackButton} onClick={this.onShowFallbackClick}>
-                    {_t("Start authentication")}
+                    {_t("auth|uia|fallback_button")}
                 </AccessibleButton>
                 {errorSection}
             </div>

src/components/views/auth/PassphraseConfirmField.tsx

@@ -37,9 +37,9 @@ interface IProps extends Omit<IInputProps, "onValidate" | "label" | "element"> {
 
 class PassphraseConfirmField extends PureComponent<IProps> {
     public static defaultProps = {
-        label: _td("Confirm password"),
-        labelRequired: _td("Confirm password"),
-        labelInvalid: _td("Passwords don't match"),
+        label: _td("auth|change_password_confirm_label"),
+        labelRequired: _td("auth|change_password_confirm_label"),
+        labelInvalid: _td("auth|change_password_confirm_invalid"),
     };
 
     private validate = withValidation({

src/components/views/auth/PassphraseField.tsx

@@ -46,9 +46,9 @@ interface IProps extends Omit<IInputProps, "onValidate" | "element"> {
 class PassphraseField extends PureComponent<IProps> {
     public static defaultProps = {
         label: _td("common|password"),
-        labelEnterPassword: _td("Enter password"),
-        labelStrongPassword: _td("Nice, strong password!"),
-        labelAllowedButUnsafe: _td("Password is allowed, but unsafe"),
+        labelEnterPassword: _td("auth|password_field_label"),
+        labelStrongPassword: _td("auth|password_field_strong_label"),
+        labelAllowedButUnsafe: _td("auth|password_field_weak_label"),
     };
 
     public readonly validate = withValidation<this, ZxcvbnResult | null>({
@@ -91,7 +91,7 @@ class PassphraseField extends PureComponent<IProps> {
                         return null;
                     }
                     const { feedback } = complexity;
-                    return feedback.warning || feedback.suggestions[0] || _t("Keep going…");
+                    return feedback.warning || feedback.suggestions[0] || _t("auth|password_field_keep_going_prompt");
                 },
             },
         ],

src/components/views/auth/PasswordLogin.tsx

@@ -214,7 +214,7 @@ export default class PasswordLogin extends React.PureComponent<IProps, IState> {
                 test({ value, allowEmpty }) {
                     return allowEmpty || !!value;
                 },
-                invalid: () => _t("Enter username"),
+                invalid: () => _t("auth|username_field_required_invalid"),
             },
         ],
     });
@@ -236,12 +236,12 @@ export default class PasswordLogin extends React.PureComponent<IProps, IState> {
                 test({ value, allowEmpty }): boolean {
                     return allowEmpty || !!value;
                 },
-                invalid: (): string => _t("Enter phone number"),
+                invalid: (): string => _t("auth|msisdn_field_required_invalid"),
             },
             {
                 key: "number",
                 test: ({ value }): boolean => !value || PHONE_NUMBER_REGEX.test(value),
-                invalid: (): string => _t("That phone number doesn't look quite right, please check and try again"),
+                invalid: (): string => _t("auth|msisdn_field_number_invalid"),
             },
         ],
     });
@@ -259,7 +259,7 @@ export default class PasswordLogin extends React.PureComponent<IProps, IState> {
                 test({ value, allowEmpty }): boolean {
                     return allowEmpty || !!value;
                 },
-                invalid: (): string => _t("Enter password"),
+                invalid: (): string => _t("auth|password_field_label"),
             },
         ],
     });
@@ -341,7 +341,7 @@ export default class PasswordLogin extends React.PureComponent<IProps, IState> {
                         autoComplete="tel-national"
                         key="phone_input"
                         type="text"
-                        label={_t("Phone")}
+                        label={_t("auth|msisdn_field_label")}
                         value={this.props.phoneNumber}
                         prefixComponent={phoneCountry}
                         onChange={this.onPhoneNumberChanged}
@@ -378,7 +378,7 @@ export default class PasswordLogin extends React.PureComponent<IProps, IState> {
                     kind="link"
                     onClick={this.onForgotPasswordClick}
                 >
-                    {_t("Forgot password?")}
+                    {_t("auth|reset_password_button")}
                 </AccessibleButton>
             );
         }
@@ -396,7 +396,7 @@ export default class PasswordLogin extends React.PureComponent<IProps, IState> {
         if (!SdkConfig.get().disable_3pid_login) {
             loginType = (
                 <div className="mx_Login_type_container">
-                    <label className="mx_Login_type_label">{_t("Sign in with")}</label>
+                    <label className="mx_Login_type_label">{_t("auth|identifier_label")}</label>
                     <Field
                         element="select"
                         value={this.state.loginType}
@@ -410,7 +410,7 @@ export default class PasswordLogin extends React.PureComponent<IProps, IState> {
                             {_t("Email address")}
                         </option>
                         <option key={LoginField.Password} value={LoginField.Password}>
-                            {_t("Phone")}
+                            {_t("auth|msisdn_field_label")}
                         </option>
                     </Field>
                 </div>

src/components/views/auth/RegistrationForm.tsx

@@ -267,7 +267,7 @@ export default class RegistrationForm extends React.PureComponent<IProps, IState
     };
 
     private validateEmailRules = withValidation({
-        description: () => _t("Use an email address to recover your account"),
+        description: () => _t("auth|reset_password_email_field_description"),
         hideDescriptionIfValid: true,
         rules: [
             {
@@ -275,12 +275,12 @@ export default class RegistrationForm extends React.PureComponent<IProps, IState
                 test(this: RegistrationForm, { value, allowEmpty }) {
                     return allowEmpty || !this.authStepIsRequired("m.login.email.identity") || !!value;
                 },
-                invalid: () => _t("Enter email address (required on this homeserver)"),
+                invalid: () => _t("auth|reset_password_email_field_required_invalid"),
             },
             {
                 key: "email",
                 test: ({ value }) => !value || Email.looksValid(value),
-                invalid: () => _t("Doesn't look like a valid email address"),
+                invalid: () => _t("auth|email_field_label_invalid"),
             },
         ],
     });
@@ -324,7 +324,7 @@ export default class RegistrationForm extends React.PureComponent<IProps, IState
     };
 
     private validatePhoneNumberRules = withValidation({
-        description: () => _t("Other users can invite you to rooms using your contact details"),
+        description: () => _t("auth|msisdn_field_description"),
         hideDescriptionIfValid: true,
         rules: [
             {
@@ -332,12 +332,12 @@ export default class RegistrationForm extends React.PureComponent<IProps, IState
                 test(this: RegistrationForm, { value, allowEmpty }) {
                     return allowEmpty || !this.authStepIsRequired("m.login.msisdn") || !!value;
                 },
-                invalid: () => _t("Enter phone number (required on this homeserver)"),
+                invalid: () => _t("auth|registration_msisdn_field_required_invalid"),
             },
             {
                 key: "email",
                 test: ({ value }) => !value || phoneNumberLooksValid(value),
-                invalid: () => _t("That phone number doesn't look quite right, please check and try again"),
+                invalid: () => _t("auth|msisdn_field_number_invalid"),
             },
         ],
     });
@@ -380,7 +380,7 @@ export default class RegistrationForm extends React.PureComponent<IProps, IState
             {
                 key: "required",
                 test: ({ value, allowEmpty }) => allowEmpty || !!value,
-                invalid: () => _t("Enter username"),
+                invalid: () => _t("auth|username_field_required_invalid"),
             },
             {
                 key: "safeLocalpart",
@@ -451,7 +451,9 @@ export default class RegistrationForm extends React.PureComponent<IProps, IState
         if (!this.showEmail()) {
             return null;
         }
-        const emailLabel = this.authStepIsRequired("m.login.email.identity") ? _td("Email") : _td("Email (optional)");
+        const emailLabel = this.authStepIsRequired("m.login.email.identity")
+            ? _td("auth|email_field_label")
+            : _td("Email (optional)");
         return (
             <EmailField
                 fieldRef={(field) => (this[RegistrationField.Email] = field)}