From c984c0d9c02239d4211eed11ca6b3f56c31cce1f Mon Sep 17 00:00:00 2001
From: "web@ppanel" <web@ppanel.dev>
Date: Fri, 10 Jan 2025 13:04:33 +0700
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix(auth):=20Update=20UserCheckF?=
 =?UTF-8?q?orm=20to=20use=20setInitialValues=20and=20modify=20onSubmit=20t?=
 =?UTF-8?q?ype?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/user/app/auth/user-auth-form.tsx  |  2 +-
 apps/user/app/auth/user-check-form.tsx | 74 ++++++++------------------
 2 files changed, 22 insertions(+), 54 deletions(-)

diff --git a/apps/user/app/auth/user-auth-form.tsx b/apps/user/app/auth/user-auth-form.tsx
index 98876b2..8024805 100644
--- a/apps/user/app/auth/user-auth-form.tsx
+++ b/apps/user/app/auth/user-auth-form.tsx
@@ -111,7 +111,7 @@ export default function UserAuthForm() {
           loading={loading}
           onSubmit={handleFormSubmit}
           initialValues={initialValues}
-          type={type}
+          setInitialValues={setInitialValues}
           setType={setType}
         />
       );
diff --git a/apps/user/app/auth/user-check-form.tsx b/apps/user/app/auth/user-check-form.tsx
index d2361fa..364ff25 100644
--- a/apps/user/app/auth/user-check-form.tsx
+++ b/apps/user/app/auth/user-check-form.tsx
@@ -6,15 +6,15 @@ import { Button } from '@workspace/ui/components/button';
 import { Form, FormControl, FormField, FormItem, FormMessage } from '@workspace/ui/components/form';
 import { Input } from '@workspace/ui/components/input';
 import { useTranslations } from 'next-intl';
-import { useEffect, useRef, useState } from 'react';
+import { Dispatch, SetStateAction, useState } from 'react';
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 
 interface UserCheckFormProps {
   loading?: boolean;
-  onSubmit: (data: any) => void;
+  onSubmit: (data: any) => Promise<void>;
   initialValues: any;
-  type?: 'login' | 'register' | 'reset';
+  setInitialValues: Dispatch<SetStateAction<any>>;
   setType: (type: 'login' | 'register' | 'reset') => void;
 }
 
@@ -22,7 +22,7 @@ export default function UserCheckForm({
   loading,
   onSubmit,
   initialValues,
-  type,
+  setInitialValues,
   setType,
 }: Readonly<UserCheckFormProps>) {
   const t = useTranslations('auth.check');
@@ -34,25 +34,19 @@ export default function UserCheckForm({
       const response = await checkUser({ email });
       const exist = response.data.data?.exist;
 
-      if (exist) {
-        setType('login');
-        return true;
-      }
-
-      if (!register.enable_email_domain_suffix) {
-        setType('register');
-        return true;
-      }
-
+      const newType = exist ? 'login' : 'register';
       const domain = email.split('@')[1];
-      const isValid = register.email_domain_suffix_list.split('\n').includes(domain || '');
+      const isValid =
+        exist ||
+        !register.enable_email_verify ||
+        register.email_domain_suffix_list.split('\n').includes(domain || '');
 
-      if (isValid) {
-        setType('register');
-        return true;
-      }
-
-      return false;
+      setInitialValues({
+        ...initialValues,
+        email,
+      });
+      setType(newType);
+      return !isValid;
     } catch (error) {
       console.log('Error checking user:', error);
       return false;
@@ -74,41 +68,16 @@ export default function UserCheckForm({
   });
 
   const [isSubmitting, setIsSubmitting] = useState(false);
-  const typingTimeoutRef = useRef<NodeJS.Timeout | null>(null);
 
-  const handleEmailChange = async (value: string) => {
-    form.setValue('email', value);
-
-    if (typingTimeoutRef.current) {
-      clearTimeout(typingTimeoutRef.current);
-    }
-
-    typingTimeoutRef.current = setTimeout(async () => {
-      const isValid = await form.trigger('email');
-      if (isValid) {
-        setIsSubmitting(true);
-        form.handleSubmit(onSubmit)();
-      } else {
-        setIsSubmitting(false);
-      }
-    }, 1000);
+  const handleSubmit = async (data: any) => {
+    setIsSubmitting(true);
+    await onSubmit(data);
+    setIsSubmitting(false);
   };
 
-  useEffect(() => {
-    if (initialValues?.email) {
-      handleEmailChange(initialValues.email);
-    }
-    return () => {
-      if (typingTimeoutRef.current) {
-        clearTimeout(typingTimeoutRef.current);
-      }
-    };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
   return (
     <Form {...form}>
-      <form onSubmit={form.handleSubmit(onSubmit)} className='grid gap-6'>
+      <form onSubmit={form.handleSubmit(handleSubmit)} className='grid gap-6'>
         <FormField
           control={form.control}
           name='email'
@@ -120,14 +89,13 @@ export default function UserCheckForm({
                   placeholder='Enter your email...'
                   type='email'
                   {...field}
-                  onChange={(e) => handleEmailChange(e.target.value)}
                 />
               </FormControl>
               <FormMessage />
             </FormItem>
           )}
         />
-        <Button type='submit' disabled={!isSubmitting}>
+        <Button type='submit' disabled={isSubmitting || loading}>
           {isSubmitting ? (
             <>
               <Icon icon='mdi:loading' className='mr-2 size-5 animate-spin' />