From 81f06d02bef8701be568e7418828d925925c5b12 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Fri, 20 Sep 2024 10:58:20 +0700 Subject: update new register disebled email --- src/lib/address/components/CreateAddress.jsx | 205 +++++++++++++++++---------- src/lib/address/components/EditAddress.jsx | 2 +- 2 files changed, 132 insertions(+), 75 deletions(-) (limited to 'src') diff --git a/src/lib/address/components/CreateAddress.jsx b/src/lib/address/components/CreateAddress.jsx index 86519147..e315affe 100644 --- a/src/lib/address/components/CreateAddress.jsx +++ b/src/lib/address/components/CreateAddress.jsx @@ -1,76 +1,101 @@ -import HookFormSelect from '@/core/components/elements/Select/HookFormSelect' -import useAuth from '@/core/hooks/useAuth' -import { useRouter } from 'next/router' -import { Controller, useForm } from 'react-hook-form' -import * as Yup from 'yup' -import cityApi from '../api/cityApi' -import districtApi from '../api/districtApi' -import subDistrictApi from '../api/subDistrictApi' -import { useEffect, useState } from 'react' -import createAddressApi from '../api/createAddressApi' -import { toast } from 'react-hot-toast' -import { yupResolver } from '@hookform/resolvers/yup' -import Menu from '@/lib/auth/components/Menu' +import HookFormSelect from '@/core/components/elements/Select/HookFormSelect'; +import useAuth from '@/core/hooks/useAuth'; +import { useRouter } from 'next/router'; +import { Controller, useForm } from 'react-hook-form'; +import * as Yup from 'yup'; +import cityApi from '../api/cityApi'; +import districtApi from '../api/districtApi'; +import subDistrictApi from '../api/subDistrictApi'; +import { useEffect, useState } from 'react'; +import createAddressApi from '../api/createAddressApi'; +import { toast } from 'react-hot-toast'; +import { yupResolver } from '@hookform/resolvers/yup'; +import Menu from '@/lib/auth/components/Menu'; +import useAddresses from '../hooks/useAddresses'; const CreateAddress = () => { - const auth = useAuth() - const router = useRouter() + const auth = useAuth(); + const router = useRouter(); const { register, formState: { errors }, handleSubmit, watch, setValue, - control + control, } = useForm({ resolver: yupResolver(validationSchema), - defaultValues - }) - - const [cities, setCities] = useState([]) - const [districts, setDistricts] = useState([]) - const [subDistricts, setSubDistricts] = useState([]) + defaultValues, + }); + const { addresses = [] } = useAddresses(); // Ensure addresses is an array + const [cities, setCities] = useState([]); + const [districts, setDistricts] = useState([]); + const [subDistricts, setSubDistricts] = useState([]); + const [filteredTypes, setFilteredTypes] = useState(types); // State to manage filtered types useEffect(() => { const loadCities = async () => { - let dataCities = await cityApi() - dataCities = dataCities.map((city) => ({ value: city.id, label: city.name })) - setCities(dataCities) + let dataCities = await cityApi(); + dataCities = dataCities.map((city) => ({ + value: city.id, + label: city.name, + })); + setCities(dataCities); + }; + loadCities(); + }, []); + + useEffect(() => { + if (addresses) { + let hasContactAddress = false; + + for (let i = 0; i < addresses?.data?.length; i++) { + if (addresses.data[i].type === 'contact') { + hasContactAddress = true; + break; + } + } + if (hasContactAddress) { + setFilteredTypes(types.filter((type) => type.value !== 'contact')); + } else { + setFilteredTypes(types); + } } - loadCities() - }, []) + }, [auth]); - const watchCity = watch('city') + const watchCity = watch('city'); useEffect(() => { - setValue('district', '') + setValue('district', ''); if (watchCity) { const loadDistricts = async () => { - let dataDistricts = await districtApi({ cityId: watchCity }) + let dataDistricts = await districtApi({ cityId: watchCity }); dataDistricts = dataDistricts.map((district) => ({ value: district.id, - label: district.name - })) - setDistricts(dataDistricts) - } - loadDistricts() + label: district.name, + })); + setDistricts(dataDistricts); + }; + loadDistricts(); } - }, [watchCity, setValue]) + }, [watchCity, setValue]); - const watchDistrict = watch('district') + const watchDistrict = watch('district'); useEffect(() => { - setValue('subDistrict', '') + setValue('subDistrict', ''); if (watchDistrict) { const loadSubDistricts = async () => { - let dataSubDistricts = await subDistrictApi({ districtId: watchDistrict }) + let dataSubDistricts = await subDistrictApi({ + districtId: watchDistrict, + }); dataSubDistricts = dataSubDistricts.map((district) => ({ value: district.id, - label: district.name - })) - setSubDistricts(dataSubDistricts) - } - loadSubDistricts() + label: district.name, + })); + setSubDistricts(dataSubDistricts); + }; + loadSubDistricts(); } - }, [watchDistrict, setValue]) + }, [watchDistrict, setValue]); const onSubmitHandler = async (values) => { const data = { @@ -78,15 +103,15 @@ const CreateAddress = () => { city_id: values.city, district_id: values.district, sub_district_id: values.subDistrict, - parent_id: auth.partnerId - } + parent_id: auth.partnerId, + }; - const address = await createAddressApi({ data }) + const address = await createAddressApi({ data }); if (address?.id) { - toast.success('Berhasil menambahkan alamat') - router.back() + toast.success('Berhasil menambahkan alamat'); + router.back(); } - } + }; return (
@@ -102,10 +127,16 @@ const CreateAddress = () => { name='type' control={control} render={(props) => ( - + )} /> -
{errors.type?.message}
+
+ {errors.type?.message} +
@@ -116,7 +147,9 @@ const CreateAddress = () => { type='text' className='form-input' /> -
{errors.name?.message}
+
+ {errors.name?.message} +
@@ -127,7 +160,9 @@ const CreateAddress = () => { type='email' className='form-input' /> -
{errors.email?.message}
+
+ {errors.email?.message} +
@@ -138,7 +173,9 @@ const CreateAddress = () => { type='tel' className='form-input' /> -
{errors.mobile?.message}
+
+ {errors.mobile?.message} +
@@ -149,7 +186,9 @@ const CreateAddress = () => { type='text' className='form-input' /> -
{errors.street?.message}
+
+ {errors.street?.message} +
@@ -160,7 +199,9 @@ const CreateAddress = () => { type='number' className='form-input' /> -
{errors.zip?.message}
+
+ {errors.zip?.message} +
@@ -168,9 +209,13 @@ const CreateAddress = () => { } + render={(props) => ( + + )} /> -
{errors.city?.message}
+
+ {errors.city?.message} +
@@ -179,10 +224,16 @@ const CreateAddress = () => { name='district' control={control} render={(props) => ( - + )} /> -
{errors.district?.message}
+
+ {errors.district?.message} +
@@ -191,31 +242,37 @@ const CreateAddress = () => { name='subDistrict' control={control} render={(props) => ( - + )} />
- - ) -} + ); +}; const validationSchema = Yup.object().shape({ type: Yup.string().required('Harus di-pilih'), name: Yup.string().min(3, 'Minimal 3 karakter').required('Harus di-isi'), - // email: Yup.string().email('Format harus seperti contoh@email.com').required('Harus di-isi'), mobile: Yup.string().required('Harus di-isi'), street: Yup.string().required('Harus di-isi'), zip: Yup.string().required('Harus di-isi'), city: Yup.string().required('Harus di-pilih'), - district: Yup.string().required('Harus di-pilih') -}) + district: Yup.string().required('Harus di-pilih'), +}); const defaultValues = { type: '', @@ -226,14 +283,14 @@ const defaultValues = { city: '', district: '', subDistrict: '', - zip: '' -} + zip: '', +}; const types = [ { value: 'contact', label: 'Contact Address' }, { value: 'invoice', label: 'Invoice Address' }, { value: 'delivery', label: 'Delivery Address' }, - { value: 'other', label: 'Other Address' } -] + { value: 'other', label: 'Other Address' }, +]; -export default CreateAddress +export default CreateAddress; diff --git a/src/lib/address/components/EditAddress.jsx b/src/lib/address/components/EditAddress.jsx index 580aaeb8..590a0bc0 100644 --- a/src/lib/address/components/EditAddress.jsx +++ b/src/lib/address/components/EditAddress.jsx @@ -29,7 +29,6 @@ const EditAddress = ({ id, defaultValues }) => { resolver: yupResolver(validationSchema), defaultValues, }); - const [cities, setCities] = useState([]); const [districts, setDistricts] = useState([]); const [subDistricts, setSubDistricts] = useState([]); @@ -195,6 +194,7 @@ const EditAddress = ({ id, defaultValues }) => { placeholder='johndoe@example.com' type='email' className='form-input' + disabled={auth?.partnerId == id && true} />
{errors.email?.message} -- cgit v1.2.3