From 213764b3726e461e7d9be8e40601ca9a639083a8 Mon Sep 17 00:00:00 2001
From: ilya-bkv <i.yablokov@ccmp.me>
Date: Thu, 8 Feb 2024 19:42:52 +0300
Subject: [PATCH] refactoring email check status

---
 public/locales/en/translation.json            |  1 +
 public/locales/ru/translation.json            |  1 +
 .../Nav/AuthModal/AuthModal.module.scss       |  8 +++++++
 src/components/Nav/AuthModal/RegisterForm.tsx | 24 +++++++------------
 4 files changed, 19 insertions(+), 15 deletions(-)

diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json
index d9f59e38..f4427991 100644
--- a/public/locales/en/translation.json
+++ b/public/locales/en/translation.json
@@ -378,6 +378,7 @@
   "This comment has not yet been rated": "This comment has not yet been rated",
   "This email is": "This email is",
   "This email is not verified": "This email is not verified",
+  "This email is verified": "This email is verified",
   "This email is registered": "This email is registered",
   "This functionality is currently not available, we would like to work on this issue. Use the download link.": "This functionality is currently not available, we would like to work on this issue. Use the download link.",
   "This month": "This month",
diff --git a/public/locales/ru/translation.json b/public/locales/ru/translation.json
index 04df15a2..febefff4 100644
--- a/public/locales/ru/translation.json
+++ b/public/locales/ru/translation.json
@@ -400,6 +400,7 @@
   "This comment has not yet been rated": "Этот комментарий еще пока никто не оценил",
   "This email is": "Этот email",
   "This email is not verified": "Этот email не подтвержден",
+  "This email is verified": "Этот email подтвержден",
   "This email is registered": "Этот email уже зарегистрирован",
   "This functionality is currently not available, we would like to work on this issue. Use the download link.": "В данный момент этот функционал не доступен, бы работаем над этой проблемой. Воспользуйтесь загрузкой по ссылке.",
   "This month": "За месяц",
diff --git a/src/components/Nav/AuthModal/AuthModal.module.scss b/src/components/Nav/AuthModal/AuthModal.module.scss
index 3c1c8af8..23bd6aff 100644
--- a/src/components/Nav/AuthModal/AuthModal.module.scss
+++ b/src/components/Nav/AuthModal/AuthModal.module.scss
@@ -198,6 +198,14 @@
       border-color: var(--background-color-invert);
     }
   }
+
+  &.info,
+  &.info a {
+    color: var(--secondary-color);
+    border-color: var(--secondary-color);
+
+  }
+
 }
 
 .title {
diff --git a/src/components/Nav/AuthModal/RegisterForm.tsx b/src/components/Nav/AuthModal/RegisterForm.tsx
index c17901c2..54e2e69e 100644
--- a/src/components/Nav/AuthModal/RegisterForm.tsx
+++ b/src/components/Nav/AuthModal/RegisterForm.tsx
@@ -41,6 +41,7 @@ export const RegisterForm = () => {
   const [isSubmitting, setIsSubmitting] = createSignal(false)
   const [isSuccess, setIsSuccess] = createSignal(false)
   const [validationErrors, setValidationErrors] = createSignal<ValidationErrors>({})
+  const [infoEmailMessage, setInfoEmailMessage] = createSignal<boolean>(false)
   const [passwordError, setPasswordError] = createSignal<string>()
   const [emailStatus, setEmailStatus] = createSignal<string>('')
 
@@ -92,6 +93,7 @@ export const RegisterForm = () => {
       return
     }
     setIsSubmitting(true)
+    setInfoEmailMessage(false)
     try {
       const opts = {
         given_name: cleanName,
@@ -109,13 +111,11 @@ export const RegisterForm = () => {
       setIsSubmitting(false)
     }
   }
-  createEffect(() => {
-    console.debug(emailStatus())
-  })
 
   const handleCheckEmailStatus = (status: EmailStatus | string) => {
     switch (status) {
       case 'not verified':
+        setInfoEmailMessage(true)
         setValidationErrors((prev) => ({
           ...prev,
           email: (
@@ -133,8 +133,8 @@ export const RegisterForm = () => {
         break
 
       case 'verified':
+        setInfoEmailMessage(true)
         setValidationErrors((prev) => ({
-          ...prev,
           email: (
             <>
               {t('This email is verified')},{' '}
@@ -159,14 +159,7 @@ export const RegisterForm = () => {
         }))
         break
       default:
-        setValidationErrors((prev) => ({
-          ...prev,
-          email: (
-            <>
-              {t('This email is')} {status.length ? status : 'странный ¯\\_(ツ)_/¯'}
-            </>
-          ),
-        }))
+        setInfoEmailMessage(false)
         break
     }
   }
@@ -174,7 +167,6 @@ export const RegisterForm = () => {
   const handleEmailBlur = async () => {
     if (validateEmail(email())) {
       const checkResult = await isRegistered(email())
-      console.log('!!! checkResult:', checkResult)
       handleCheckEmailStatus(checkResult)
     }
   }
@@ -210,7 +202,7 @@ export const RegisterForm = () => {
 
             <div
               class={clsx('pretty-form__item', {
-                'pretty-form__item--error': validationErrors().email,
+                'pretty-form__item--error': validationErrors().email && !infoEmailMessage(),
               })}
             >
               <input
@@ -223,7 +215,9 @@ export const RegisterForm = () => {
                 onBlur={handleEmailBlur}
               />
               <label for="email">{t('Email')}</label>
-              <div class={styles.validationError}>{validationErrors().email}</div>
+              <div class={clsx(styles.validationError, styles.info, { [styles.info]: infoEmailMessage() })}>
+                {validationErrors().email}
+              </div>
             </div>
 
             <PasswordField