🐛 fix(auth): Update UserCheckForm to use setInitialValues and modify onSubmit type
This commit is contained in:
parent
f275f01f25
commit
c984c0d9c0
@ -111,7 +111,7 @@ export default function UserAuthForm() {
|
||||
loading={loading}
|
||||
onSubmit={handleFormSubmit}
|
||||
initialValues={initialValues}
|
||||
type={type}
|
||||
setInitialValues={setInitialValues}
|
||||
setType={setType}
|
||||
/>
|
||||
);
|
||||
|
||||
@ -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' />
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user