From 90710579ba1c12060877f6ec2d26103f9c31058d Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Mon, 23 Oct 2023 17:11:33 +0700 Subject: Refactor and migrate register page --- src-migrate/common/stores/useRegisterStore.ts | 52 +++++++++++++++++++++++++++ 1 file changed, 52 insertions(+) create mode 100644 src-migrate/common/stores/useRegisterStore.ts (limited to 'src-migrate/common/stores') diff --git a/src-migrate/common/stores/useRegisterStore.ts b/src-migrate/common/stores/useRegisterStore.ts new file mode 100644 index 00000000..fcd2cd8b --- /dev/null +++ b/src-migrate/common/stores/useRegisterStore.ts @@ -0,0 +1,52 @@ +import { create } from 'zustand'; +import { RegisterProps } from '../types/auth'; + +type State = { + form: RegisterProps; + isValid: boolean; + isCheckedTNC: boolean; + isOpenTNC: boolean; +}; + +type Action = { + updateForm: (name: string, value: string) => void; + toggleCheckTNC: () => void; + openTNC: () => void; + closeTNC: () => void; +}; + +export const useRegisterStore = create((set) => ({ + form: { + company: '', + name: '', + email: '', + password: '', + }, + isValid: false, + isCheckedTNC: false, + isOpenTNC: 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, + }; + }), + toggleCheckTNC: () => set((state) => ({ isCheckedTNC: !state.isCheckedTNC })), + openTNC: () => set(() => ({ isOpenTNC: true })), + closeTNC: () => set(() => ({ isOpenTNC: false })), +})); -- cgit v1.2.3 From cf6da809621b4ebe8c9acedb035b689e7e1b60b1 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Wed, 25 Oct 2023 17:27:32 +0700 Subject: Update register page --- src-migrate/common/stores/useRegisterStore.ts | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'src-migrate/common/stores') diff --git a/src-migrate/common/stores/useRegisterStore.ts b/src-migrate/common/stores/useRegisterStore.ts index fcd2cd8b..725bbfda 100644 --- a/src-migrate/common/stores/useRegisterStore.ts +++ b/src-migrate/common/stores/useRegisterStore.ts @@ -6,10 +6,12 @@ type State = { isValid: boolean; isCheckedTNC: boolean; isOpenTNC: boolean; + isValidCaptcha: boolean; }; type Action = { updateForm: (name: string, value: string) => void; + updateValidCaptcha: (value: boolean) => void; toggleCheckTNC: () => void; openTNC: () => void; closeTNC: () => void; @@ -21,10 +23,12 @@ export const useRegisterStore = create((set) => ({ name: '', email: '', password: '', + phone: '', }, isValid: false, isCheckedTNC: false, isOpenTNC: false, + isValidCaptcha: false, updateForm: (name, value) => set((state) => { const updatedForm = { ...state.form, [name]: value }; @@ -49,4 +53,5 @@ export const useRegisterStore = create((set) => ({ toggleCheckTNC: () => set((state) => ({ isCheckedTNC: !state.isCheckedTNC })), openTNC: () => set(() => ({ isOpenTNC: true })), closeTNC: () => set(() => ({ isOpenTNC: false })), + updateValidCaptcha: (value) => set(() => ({ isValidCaptcha: value })), })); -- cgit v1.2.3 From 6b221cccd58710682c99db7afbc29322da042880 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Tue, 31 Oct 2023 10:44:25 +0700 Subject: - Add redirect after activation - Add register form validation --- src-migrate/common/stores/useRegisterStore.ts | 28 ++++++++++++++++++++++++++- 1 file changed, 27 insertions(+), 1 deletion(-) (limited to 'src-migrate/common/stores') diff --git a/src-migrate/common/stores/useRegisterStore.ts b/src-migrate/common/stores/useRegisterStore.ts index 725bbfda..d6c7db2a 100644 --- a/src-migrate/common/stores/useRegisterStore.ts +++ b/src-migrate/common/stores/useRegisterStore.ts @@ -1,8 +1,13 @@ import { create } from 'zustand'; import { RegisterProps } from '../types/auth'; +import { registerSchema } from '../validations/auth'; +import { ValidationError } from 'yup'; type State = { form: RegisterProps; + errors: { + [key in keyof RegisterProps]?: string; + }; isValid: boolean; isCheckedTNC: boolean; isOpenTNC: boolean; @@ -15,9 +20,10 @@ type Action = { toggleCheckTNC: () => void; openTNC: () => void; closeTNC: () => void; + validate: () => void; }; -export const useRegisterStore = create((set) => ({ +export const useRegisterStore = create((set, get) => ({ form: { company: '', name: '', @@ -25,6 +31,26 @@ export const useRegisterStore = create((set) => ({ password: '', phone: '', }, + errors: {}, + validate: () => + registerSchema + .validate(get().form, { abortEarly: false }) + .then(() => { + set({ + errors: {}, + isValid: false, + }); + }) + .catch((err: ValidationError) => { + const validationErrors: State['errors'] = {}; + err.inner.forEach( + (e) => (validationErrors[e.path as keyof RegisterProps] = e.message) + ); + set({ + errors: validationErrors, + isValid: false, + }); + }), isValid: false, isCheckedTNC: false, isOpenTNC: false, -- cgit v1.2.3 From 4bed066c03dc55a8f811ff2e23e019d8adc64495 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Fri, 10 Nov 2023 14:47:52 +0700 Subject: Refactor register form --- src-migrate/common/stores/useRegisterStore.ts | 45 ++++++--------------------- 1 file changed, 10 insertions(+), 35 deletions(-) (limited to 'src-migrate/common/stores') 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((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 })), })); -- cgit v1.2.3 From 5a9210e560ca47d8f4d8c43b06fc93d1d064a6f6 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Fri, 10 Nov 2023 16:23:33 +0700 Subject: Add close on modal otp activation, change validation register schema, fix term and condition checkbox --- src-migrate/common/stores/useRegisterStore.ts | 26 ++++++++++++++------------ 1 file changed, 14 insertions(+), 12 deletions(-) (limited to 'src-migrate/common/stores') diff --git a/src-migrate/common/stores/useRegisterStore.ts b/src-migrate/common/stores/useRegisterStore.ts index ab2d7410..90ce8a2b 100644 --- a/src-migrate/common/stores/useRegisterStore.ts +++ b/src-migrate/common/stores/useRegisterStore.ts @@ -1,7 +1,7 @@ import { create } from 'zustand'; import { RegisterProps } from '../types/auth'; import { registerSchema } from '../validations/auth'; -import { ValidationError } from 'yup'; +import { ZodError } from 'zod'; type State = { form: RegisterProps; @@ -34,18 +34,20 @@ export const useRegisterStore = create((set, get) => ({ set((state) => ({ form: { ...state.form, [name]: value } })), errors: {}, - validate: () => - registerSchema - .validate(get().form, { abortEarly: false }) - .then(() => set({ errors: {} })) - .catch((err: ValidationError) => { - const validationErrors: State['errors'] = {}; - err.inner.forEach( - (e) => (validationErrors[e.path as keyof RegisterProps] = e.message) + validate: () => { + try { + registerSchema.parse(get().form); + set({ errors: {} }); + } catch (error) { + if (error instanceof ZodError) { + const errors: State['errors'] = {}; + error.errors.forEach( + (e) => (errors[e.path[0] as keyof RegisterProps] = e.message) ); - set({ errors: validationErrors }); - }), - + set({ errors }); + } + } + }, isCheckedTNC: false, toggleCheckTNC: () => set((state) => ({ isCheckedTNC: !state.isCheckedTNC })), -- cgit v1.2.3