Подтянут внешний вид формы отправки кода о восстановлении пароля от аккаунта

src/components/auth/forgotPassword/ForgotPassword.intl.json

@@ -1,7 +1,7 @@
 {
     "title": "Forgot password",
     "sendMail": "Send mail",
-    "specifyEmail": "Specify the registration E-mail address for your account and we will send an email with instructions for further password recovery.",
+    "specifyEmail": "Specify the registration E-mail address or last used username for your account and we will send an email with instructions for further password recovery.",
     "pleasePressButton": "Please press the button bellow to get an email with password recovery code.",
     "alreadyHaveCode": "Already have a code"
 }

src/components/auth/forgotPassword/ForgotPasswordBody.jsx

@@ -3,6 +3,7 @@ import React from 'react';
 import { FormattedMessage as Message } from 'react-intl';
 
 import { Input } from 'components/ui/form';
+import icons from 'components/ui/icons.scss';
 import BaseAuthBody from 'components/auth/BaseAuthBody';
 
 import styles from './forgotPassword.scss';
@@ -14,28 +15,42 @@ export default class ForgotPasswordBody extends BaseAuthBody {
     static hasGoBack = true;
 
     render() {
-        const {user} = this.context;
+        const { user } = this.context;
-        const hasIdentity = user.email || user.username;
+        const login = user.email || user.username;
-        const message = hasIdentity ? messages.pleasePressButton : messages.specifyEmail;
+
+        // TODO: нужно парсить инфу о том, какой кд у отправки кода и во сколько точно можно будет повторить
 
         return (
             <div>
                 {this.renderErrors()}
 
-                <p className={styles.descriptionText}>
+                <div className={styles.bigIcon}>
-                    <Message {...message} />
+                    <span className={icons.lock} />
-                </p>
+                </div>
 
-                {hasIdentity ? null : (
+                {login ? (
-                    <Input {...this.bindField('email')}
+                    <div>
-                        icon="envelope"
+                        <div className={styles.login}>
-                        color="lightViolet"
+                            {login}
-                        required
+                        </div>
-                        placeholder={messages.accountEmail}
+                        <p className={styles.descriptionText}>
-                        defaultValue={user.email || user.username}
+                            <Message {...messages.pleasePressButton} />
-                    />
+                        </p>
+                    </div>
+                ) : (
+                    <div>
+                        <p className={styles.descriptionText}>
+                            <Message {...messages.specifyEmail} />
+                        </p>
+                        <Input {...this.bindField('email')}
+                            icon="envelope"
+                            color="lightViolet"
+                            required
+                            placeholder={messages.accountEmail}
+                            defaultValue={login}
+                        />
+                    </div>
                 )}
-
             </div>
         );
     }

src/components/auth/forgotPassword/forgotPassword.scss

@@ -6,3 +6,15 @@
     padding-bottom: 8px;
     color: #aaa;
 }
+
+// TODO: вынести иконки такого типа в какую-то внешнюю структуру?
+.bigIcon {
+    color: #ccc;
+    font-size: 100px;
+    line-height: 1;
+    margin-bottom: 15px;
+}
+
+.login {
+    composes: email from 'components/auth/password/password.scss';
+}

src/i18n/en.json

@@ -29,7 +29,7 @@
     "components.auth.forgotPassword.alreadyHaveCode": "Already have a code",
     "components.auth.forgotPassword.pleasePressButton": "Please press the button bellow to get an email with password recovery code.",
     "components.auth.forgotPassword.sendMail": "Send mail",
-    "components.auth.forgotPassword.specifyEmail": "Specify the registration E-mail address for your account and we will send an email with instructions for further password recovery.",
+    "components.auth.forgotPassword.specifyEmail": "Specify the registration E-mail address or last used username for your account and we will send an email with instructions for further password recovery.",
     "components.auth.forgotPassword.title": "Forgot password",
     "components.auth.login.emailOrUsername": "E-mail or username",
     "components.auth.login.loginTitle": "Sign in",
@@ -94,7 +94,7 @@
     "register": "Join",
     "sendEmailButton": "Send E-mail",
     "services.accountNotActivated": "The account is not activated",
-    "services.emailFrequency": "Please cool down, you are requesting emails too often",
+    "services.emailFrequency": "Please cool down, you are requesting emails too often. New key can be retrieved after 30 minutes from the previous request.",
     "services.emailInvalid": "Email is invalid",
     "services.emailIsTempmail": "Tempmail E-mail addresses is not allowed",
     "services.emailNotAvailable": "This email is already registered.",

src/i18n/ru.json

@@ -29,7 +29,7 @@
     "components.auth.forgotPassword.alreadyHaveCode": "Already have a code",
     "components.auth.forgotPassword.pleasePressButton": "Please press the button bellow to get an email with password recovery code.",
     "components.auth.forgotPassword.sendMail": "Send mail",
-    "components.auth.forgotPassword.specifyEmail": "Specify the registration E-mail address for your account and we will send an email with instructions for further password recovery.",
+    "components.auth.forgotPassword.specifyEmail": "Specify the registration E-mail address or last used username for your account and we will send an email with instructions for further password recovery.",
     "components.auth.forgotPassword.title": "Forgot password",
     "components.auth.login.emailOrUsername": "E-mail or username",
     "components.auth.login.loginTitle": "Sign in",
@@ -94,7 +94,7 @@
     "register": "Join",
     "sendEmailButton": "Send E-mail",
     "services.accountNotActivated": "The account is not activated",
-    "services.emailFrequency": "Please cool down, you are requesting emails too often",
+    "services.emailFrequency": "Please cool down, you are requesting emails too often. New key can be retrieved after 30 minutes from the previous request.",
     "services.emailInvalid": "Email is invalid",
     "services.emailIsTempmail": "Tempmail E-mail addresses is not allowed",
     "services.emailNotAvailable": "This email is already registered.",

src/services/errorsDict.intl.json

@@ -23,6 +23,6 @@
     "rulesAgreementRequired": "You must accept rules in order to create an account",
     "keyRequired": "Please, enter an activation key",
     "keyNotExists": "The key is incorrect",
-    "emailFrequency": "Please cool down, you are requesting emails too often",
+    "emailFrequency": "Please cool down, you are requesting emails too often. New key can be retrieved after 30 minutes from the previous request.",
     "accountNotActivated": "The account is not activated"
 }