112 lines
3.3 KiB
TypeScript
112 lines
3.3 KiB
TypeScript
'use client';
|
|
|
|
import { useCallback, useState } from 'react';
|
|
import { useRegisterZustand } from './registerZustand';
|
|
import { validateRegister, RegisterErrors } from './validateRegister';
|
|
import { useRegisterModal } from '@/shared/zustand/auth';
|
|
import { useMutation } from '@tanstack/react-query';
|
|
import { apiRequest } from '@/shared/request/apiRequest';
|
|
import { links } from '@/shared/request/links';
|
|
import { toast } from 'react-toastify';
|
|
import { useRouter } from '@/shared/config/i18n/navigation';
|
|
import { AuthData } from '../../login/lib/useLoginForm';
|
|
import { useUserPlagiatStore } from '@/shared/zustand/user';
|
|
|
|
interface RegisterData {
|
|
first_name: string;
|
|
last_name: string;
|
|
phone: string;
|
|
password: string;
|
|
}
|
|
|
|
export function useRegisterForm() {
|
|
const { registerData, setItem, setOferta, clearRegisterData } =
|
|
useRegisterZustand();
|
|
const [errors, setErrors] = useState<RegisterErrors>({});
|
|
const [success, setSuccess] = useState(false);
|
|
const setUser = useUserPlagiatStore((state) => state.setUser);
|
|
const route = useRouter();
|
|
const toggleRegisterModal = useRegisterModal(
|
|
(state) => state.toggleRegisterModal,
|
|
);
|
|
|
|
const registerRequest = useMutation({
|
|
mutationKey: ['register'],
|
|
mutationFn: (data: RegisterData) =>
|
|
apiRequest('POST', links.register, data),
|
|
onSuccess: (data) => {
|
|
console.log('Register successful:', data);
|
|
const resData = data?.data as AuthData;
|
|
const user = data
|
|
? {
|
|
id: resData?.user_id,
|
|
name: resData?.first_name,
|
|
surname: resData?.last_name,
|
|
}
|
|
: null;
|
|
if (user) {
|
|
localStorage.setItem('access_token', resData.access);
|
|
localStorage.setItem('refresh_token', resData.refresh);
|
|
localStorage.setItem('user', JSON.stringify(user));
|
|
}
|
|
setUser(user);
|
|
toggleRegisterModal();
|
|
setSuccess(true);
|
|
toast.success("Ro'yxatdan o'tish muvaffaqiyatli!");
|
|
route.push('/plagiat');
|
|
},
|
|
onError: (err) => {
|
|
console.log('Register failed:', err);
|
|
},
|
|
});
|
|
|
|
const handleChange = useCallback(
|
|
(e: React.ChangeEvent<HTMLInputElement>) => {
|
|
const { name, value } = e.target;
|
|
setItem(name as keyof typeof registerData, value);
|
|
// clear the error for this field on change
|
|
setErrors((prev) => ({ ...prev, [name]: undefined }));
|
|
},
|
|
[setItem],
|
|
);
|
|
|
|
const handleOferta = useCallback(
|
|
(e: React.ChangeEvent<HTMLInputElement>) => {
|
|
setOferta(e.target.checked);
|
|
setErrors((prev) => ({ ...prev, oferta: undefined }));
|
|
},
|
|
[setOferta],
|
|
);
|
|
|
|
const handleSubmit = useCallback(
|
|
async (e: React.FormEvent) => {
|
|
e.preventDefault();
|
|
const validationErrors = validateRegister(registerData);
|
|
console.log('register data on submit:', registerData);
|
|
if (Object.keys(validationErrors).length > 0) {
|
|
setErrors(validationErrors);
|
|
return;
|
|
}
|
|
const sendedData = {
|
|
phone: registerData.phone,
|
|
first_name: registerData.name,
|
|
last_name: registerData.surname,
|
|
password: registerData.password,
|
|
};
|
|
registerRequest.mutate(sendedData);
|
|
},
|
|
[registerData, clearRegisterData],
|
|
);
|
|
|
|
return {
|
|
registerData,
|
|
errors,
|
|
loading: registerRequest.isPending,
|
|
success,
|
|
handleChange,
|
|
handleOferta,
|
|
handleSubmit,
|
|
setItem,
|
|
};
|
|
}
|