From 6c4f37b9dbb8683cc565aac963574d51a9aad506 Mon Sep 17 00:00:00 2001
From: Prince Muel <vansomecsam@gmail.com>
Date: Sat, 6 May 2023 04:40:03 +0100
Subject: [PATCH] chore: refactor register form

Reference: #48, #51, #49

Signed-off-by: Prince Muel <vansomecsam@gmail.com>
---
 src/components/organisms/register.tsx | 22 ++++++++++++----------
 1 file changed, 12 insertions(+), 10 deletions(-)

diff --git a/src/components/organisms/register.tsx b/src/components/organisms/register.tsx
index 421512b..7169294 100644
--- a/src/components/organisms/register.tsx
+++ b/src/components/organisms/register.tsx
@@ -1,13 +1,13 @@
-import { FormProvider } from 'react-hook-form';
-import { Link, useNavigate } from 'react-router-dom';
-// import clsx from 'clsx';
-import { useAuthDispatch } from '@src/context';
+import type { IErrorResponse } from '@src/@types';
 import { RHFSubmitHandler, RegisterFormSchema, useZodForm } from '@src/helpers';
 import { useRegisterMutation } from '@src/hooks';
 import { client } from '@src/lib';
+import { FormProvider } from 'react-hook-form';
+import { Link, useNavigate } from 'react-router-dom';
 import { toast } from 'react-toastify';
 import { Text } from '../atoms';
 import { FormField, FormFieldPassword } from '../molecules';
+import { Loader } from './loader';
 
 type Props = {};
 
@@ -18,16 +18,16 @@ const RegisterForm = (props: Props) => {
   });
 
   const navigate = useNavigate();
-  const dispatch = useAuthDispatch();
 
-  const { mutate: register } = useRegisterMutation(client, {
+  const { mutate: register, isLoading } = useRegisterMutation(client, {
     onSuccess(data) {
-      toast.success('Register User Success');
-      dispatch('auth/logout');
+      toast.success(data.register?.message);
       navigate('/login');
     },
-    onError(e) {
-      console.log(e);
+    onError(e: IErrorResponse) {
+      e.response.errors.forEach(async (error) => {
+        toast.error(error.message);
+      });
     },
   });
 
@@ -50,6 +50,8 @@ const RegisterForm = (props: Props) => {
   const isSubmittable =
     Boolean(methods.formState.isDirty) && Boolean(methods.formState.isValid);
 
+  if (isLoading) return <Loader />;
+
   return (
     <FormProvider {...methods}>
       <form