fix(#2199): fix popup recovery

4 years ago · cec5ecbc47
parent 6ccdae4f5f
commit cec5ecbc47
2 changed files with 25 additions and 14 deletions
--- a/src/features/AuthServiceApp/components/RecoveryPopup/hooks.tsx
+++ b/src/features/AuthServiceApp/components/RecoveryPopup/hooks.tsx
@ -1,4 +1,8 @@
-import { ChangeEvent, useState } from 'react'
+import {
+  ChangeEvent,
+  useEffect,
+  useState,
+} from 'react'

 import { isValidEmail } from 'features/AuthServiceApp/helpers/isValidEmail'
 import { loginCheckChangePass } from 'features/AuthServiceApp/requests/loginCheck'
@ -11,6 +15,7 @@ export const useRecovery = (setIsModalOpen: (value: boolean) => void) => {
  const [email, setEmail] = useState('')
  const [isFetching, setIsFetching] = useState(false)
  const [isSendMessage, setIsSendMessage] = useState(false)
+  const [isSuccess, setIsSuccess] = useState(false)

  const onEmailChange = ({
    target: { value },
@ -26,6 +31,7 @@ export const useRecovery = (setIsModalOpen: (value: boolean) => void) => {

  const closePopup = () => {
    setIsSendMessage(false)
+    setIsSuccess(false)
    setIsFetching(false)
    setError('')
    setEmail('')
@ -38,17 +44,22 @@ export const useRecovery = (setIsModalOpen: (value: boolean) => void) => {
    setIsFetching(false)
  }

-  const handleSubmit = async () => {
-    try {
-      setIsFetching(true)
-      await loginCheckChangePass(email, lang)
-      setIsFetching(false)
-      setIsSendMessage(true)
-    } catch (err) {
-      handleError(String(err))
-    }
+  const handleSubmit = () => {
+    setIsFetching(true)
+    loginCheckChangePass(email, lang)
+      .then(() => setIsFetching(false))
+      .then(() => setIsSendMessage(true))
+      .catch(handleError)
  }

+  useEffect(() => {
+    if (!isFetching && isSendMessage) {
+      setIsSuccess(true)
+    } else {
+      setIsSuccess(false)
+    }
+  }, [isSendMessage, isFetching])
+
  return {
    closePopup,
    email,
@ -56,7 +67,7 @@ export const useRecovery = (setIsModalOpen: (value: boolean) => void) => {
    handleSubmit,
    isFetching,
    isSendBtnDisabled,
-    isSendMessage,
+    isSuccess,
    onEmailChange,
  }
 }
--- a/src/features/AuthServiceApp/components/RecoveryPopup/index.tsx
+++ b/src/features/AuthServiceApp/components/RecoveryPopup/index.tsx
@ -33,7 +33,7 @@ export const RecoveryPopup = (props: Props) => {
    handleSubmit,
    isFetching,
    isSendBtnDisabled,
-    isSendMessage,
+    isSuccess,
    onEmailChange,
  } = useRecovery(setIsModalOpen)

@ -50,7 +50,7 @@ export const RecoveryPopup = (props: Props) => {
          </HeaderTitle>
        </Header>
        <Body>
-          {isSendMessage ? (
+          {isSuccess ? (
            <Text>
              <T9n t='send_new_email_for_change_pass' />
            </Text>
@ -72,7 +72,7 @@ export const RecoveryPopup = (props: Props) => {
            </Fragment>
          )}
          <Footer>
-            {!isSendMessage ? (
+            {!isSuccess ? (
              <ApplyButton onClick={handleSubmit} disabled={isSendBtnDisabled}>
                {isFetching ? <ArrowLoader /> : <T9n t='send' />}
              </ApplyButton>