diff options
| -rw-r--r-- | src-migrate/common/stores/useRegisterStore.ts | 45 | ||||
| -rw-r--r-- | src-migrate/modules/register/components/Form.tsx | 10 |
2 files changed, 17 insertions, 38 deletions
diff --git a/src-migrate/common/stores/useRegisterStore.ts b/src-migrate/common/stores/useRegisterStore.ts index d6c7db2a..ab2d7410 100644 --- a/src-migrate/common/stores/useRegisterStore.ts +++ b/src-migrate/common/stores/useRegisterStore.ts @@ -8,7 +8,6 @@ type State = { errors: { [key in keyof RegisterProps]?: string; }; - isValid: boolean; isCheckedTNC: boolean; isOpenTNC: boolean; isValidCaptcha: boolean; @@ -31,53 +30,29 @@ export const useRegisterStore = create<State & Action>((set, get) => ({ password: '', phone: '', }, + updateForm: (name, value) => + set((state) => ({ form: { ...state.form, [name]: value } })), + errors: {}, validate: () => registerSchema .validate(get().form, { abortEarly: false }) - .then(() => { - set({ - errors: {}, - isValid: false, - }); - }) + .then(() => set({ errors: {} })) .catch((err: ValidationError) => { const validationErrors: State['errors'] = {}; err.inner.forEach( (e) => (validationErrors[e.path as keyof RegisterProps] = e.message) ); - set({ - errors: validationErrors, - isValid: false, - }); + set({ errors: validationErrors }); }), - isValid: false, - isCheckedTNC: false, - isOpenTNC: false, - isValidCaptcha: false, - updateForm: (name, value) => - set((state) => { - const updatedForm = { ...state.form, [name]: value }; - - const fieldKeys = Object.keys( - updatedForm - ) as (keyof typeof updatedForm)[]; - - const allFieldsValid = fieldKeys.every((key) => { - const value = updatedForm[key]; - if (key === 'company') return true; - - return value !== ''; - }); - - return { - form: updatedForm, - isValid: allFieldsValid, - }; - }), + isCheckedTNC: false, toggleCheckTNC: () => set((state) => ({ isCheckedTNC: !state.isCheckedTNC })), + + isOpenTNC: false, openTNC: () => set(() => ({ isOpenTNC: true })), closeTNC: () => set(() => ({ isOpenTNC: false })), + + isValidCaptcha: false, updateValidCaptcha: (value) => set(() => ({ isValidCaptcha: value })), })); diff --git a/src-migrate/modules/register/components/Form.tsx b/src-migrate/modules/register/components/Form.tsx index 5b51d6f4..ddc3397f 100644 --- a/src-migrate/modules/register/components/Form.tsx +++ b/src-migrate/modules/register/components/Form.tsx @@ -1,4 +1,4 @@ -import { ChangeEvent, useEffect } from "react"; +import { ChangeEvent, useEffect, useMemo } from "react"; import { useMutation } from "react-query"; import { useRegisterStore } from "~/common/stores/useRegisterStore"; import { RegisterProps } from "~/common/types/auth"; @@ -13,13 +13,17 @@ import { registerSchema } from "~/common/validations/auth"; const Form = () => { const { form, - isValid, isCheckedTNC, isValidCaptcha, errors, updateForm, validate, } = useRegisterStore() + + const isFormValid = useMemo(() => { + return Object.keys(errors).length === 0 + }, [errors]) + const router = useRouter() const toast = useToast() @@ -167,7 +171,7 @@ const Form = () => { <button type="submit" className="btn-yellow w-full mt-2" - disabled={!isValid || !isCheckedTNC || mutation.isLoading || !isValidCaptcha} + disabled={!isFormValid || !isCheckedTNC || mutation.isLoading || !isValidCaptcha} > {mutation.isLoading ? 'Loading...' : 'Daftar'} </button> |
