diff options
| author | Rafi Zadanly <zadanlyr@gmail.com> | 2023-02-22 11:03:34 +0700 |
|---|---|---|
| committer | Rafi Zadanly <zadanlyr@gmail.com> | 2023-02-22 11:03:34 +0700 |
| commit | f66b12fd1d0b83af0d7230d7b1565fbe00afbe3c (patch) | |
| tree | 253dcf854a3c92e09ca846e86a09e5b4c5d16be1 /src/lib/address | |
| parent | 3c559031623649a67825ff47f34512f0eb946861 (diff) | |
prettier
Diffstat (limited to 'src/lib/address')
| -rw-r--r-- | src/lib/address/api/addressApi.js | 4 | ||||
| -rw-r--r-- | src/lib/address/api/addressesApi.js | 6 | ||||
| -rw-r--r-- | src/lib/address/api/cityApi.js | 4 | ||||
| -rw-r--r-- | src/lib/address/api/createAddressApi.js | 4 | ||||
| -rw-r--r-- | src/lib/address/api/districtApi.js | 4 | ||||
| -rw-r--r-- | src/lib/address/api/editAddressApi.js | 4 | ||||
| -rw-r--r-- | src/lib/address/api/subDistrictApi.js | 4 | ||||
| -rw-r--r-- | src/lib/address/components/Addresses.jsx | 80 | ||||
| -rw-r--r-- | src/lib/address/components/CreateAddress.jsx | 166 | ||||
| -rw-r--r-- | src/lib/address/components/EditAddress.jsx | 196 | ||||
| -rw-r--r-- | src/lib/address/hooks/useAddresses.js | 8 |
11 files changed, 213 insertions, 267 deletions
diff --git a/src/lib/address/api/addressApi.js b/src/lib/address/api/addressApi.js index f2fc6c9e..f99d81c0 100644 --- a/src/lib/address/api/addressApi.js +++ b/src/lib/address/api/addressApi.js @@ -1,8 +1,8 @@ -import odooApi from "@/core/api/odooApi" +import odooApi from '@/core/api/odooApi' const addressApi = async ({ id }) => { const dataAddress = await odooApi('GET', `/api/v1/partner/${id}/address`) return dataAddress } -export default addressApi
\ No newline at end of file +export default addressApi diff --git a/src/lib/address/api/addressesApi.js b/src/lib/address/api/addressesApi.js index 1edfc077..96f9e9d9 100644 --- a/src/lib/address/api/addressesApi.js +++ b/src/lib/address/api/addressesApi.js @@ -1,5 +1,5 @@ -import odooApi from "@/core/api/odooApi" -import { getAuth } from "@/core/utils/auth" +import odooApi from '@/core/api/odooApi' +import { getAuth } from '@/core/utils/auth' const addressesApi = async () => { const auth = getAuth() @@ -7,4 +7,4 @@ const addressesApi = async () => { return dataAddresses } -export default addressesApi
\ No newline at end of file +export default addressesApi diff --git a/src/lib/address/api/cityApi.js b/src/lib/address/api/cityApi.js index 8cf1bedd..7873435b 100644 --- a/src/lib/address/api/cityApi.js +++ b/src/lib/address/api/cityApi.js @@ -1,8 +1,8 @@ -import odooApi from "@/core/api/odooApi" +import odooApi from '@/core/api/odooApi' const cityApi = async () => { const dataCities = await odooApi('GET', '/api/v1/city') return dataCities } -export default cityApi
\ No newline at end of file +export default cityApi diff --git a/src/lib/address/api/createAddressApi.js b/src/lib/address/api/createAddressApi.js index 29804d1c..b33b7ae1 100644 --- a/src/lib/address/api/createAddressApi.js +++ b/src/lib/address/api/createAddressApi.js @@ -1,8 +1,8 @@ -import odooApi from "@/core/api/odooApi" +import odooApi from '@/core/api/odooApi' const createAddressApi = async ({ data }) => { const dataAddress = await odooApi('POST', '/api/v1/partner/address', data) return dataAddress } -export default createAddressApi
\ No newline at end of file +export default createAddressApi diff --git a/src/lib/address/api/districtApi.js b/src/lib/address/api/districtApi.js index 120757e9..b0bcff16 100644 --- a/src/lib/address/api/districtApi.js +++ b/src/lib/address/api/districtApi.js @@ -1,8 +1,8 @@ -import odooApi from "@/core/api/odooApi" +import odooApi from '@/core/api/odooApi' const districtApi = async ({ cityId }) => { const dataDistricts = await odooApi('GET', `/api/v1/district?city_id=${cityId}`) return dataDistricts } -export default districtApi
\ No newline at end of file +export default districtApi diff --git a/src/lib/address/api/editAddressApi.js b/src/lib/address/api/editAddressApi.js index e01f6015..ba383ef0 100644 --- a/src/lib/address/api/editAddressApi.js +++ b/src/lib/address/api/editAddressApi.js @@ -1,8 +1,8 @@ -import odooApi from "@/core/api/odooApi" +import odooApi from '@/core/api/odooApi' const editAddressApi = async ({ id, data }) => { const dataAddress = await odooApi('PUT', `/api/v1/partner/${id}/address`, data) return dataAddress } -export default editAddressApi
\ No newline at end of file +export default editAddressApi diff --git a/src/lib/address/api/subDistrictApi.js b/src/lib/address/api/subDistrictApi.js index 64230838..3f834420 100644 --- a/src/lib/address/api/subDistrictApi.js +++ b/src/lib/address/api/subDistrictApi.js @@ -1,8 +1,8 @@ -import odooApi from "@/core/api/odooApi" +import odooApi from '@/core/api/odooApi' const subDistrictApi = async ({ districtId }) => { const dataSubDistricts = await odooApi('GET', `/api/v1/sub_district?district_id=${districtId}`) return dataSubDistricts } -export default subDistrictApi
\ No newline at end of file +export default subDistrictApi diff --git a/src/lib/address/components/Addresses.jsx b/src/lib/address/components/Addresses.jsx index 7a82c0da..c4855f8f 100644 --- a/src/lib/address/components/Addresses.jsx +++ b/src/lib/address/components/Addresses.jsx @@ -1,15 +1,13 @@ -import Link from "@/core/components/elements/Link/Link" -import Spinner from "@/core/components/elements/Spinner/Spinner" -import useAuth from "@/core/hooks/useAuth" -import { getItemAddress, updateItemAddress } from "@/core/utils/address" -import { useRouter } from "next/router" -import useAddresses from "../hooks/useAddresses" +import Link from '@/core/components/elements/Link/Link' +import Spinner from '@/core/components/elements/Spinner/Spinner' +import useAuth from '@/core/hooks/useAuth' +import { getItemAddress, updateItemAddress } from '@/core/utils/address' +import { useRouter } from 'next/router' +import useAddresses from '../hooks/useAddresses' const Addresses = () => { const router = useRouter() - const { - select = null - } = router.query + const { select = null } = router.query const auth = useAuth() const { addresses } = useAddresses() const selectedAdress = getItemAddress(select || '') @@ -21,48 +19,60 @@ const Addresses = () => { if (addresses.isLoading) { return ( - <div className="flex justify-center my-6"> - <Spinner className="w-6 text-gray_r-12/50 fill-gray_r-12" /> + <div className='flex justify-center my-6'> + <Spinner className='w-6 text-gray_r-12/50 fill-gray_r-12' /> </div> ) } return ( - <div className="p-4"> - <div className="text-right"> - <Link href="/my/address/create">Tambah Alamat</Link> + <div className='p-4'> + <div className='text-right'> + <Link href='/my/address/create'>Tambah Alamat</Link> </div> - <div className="grid gap-y-4 mt-4"> - { addresses.data?.map((address, index) => { - let type = address.type.charAt(0).toUpperCase() + address.type.slice(1) + ' Address'; + <div className='grid gap-y-4 mt-4'> + {addresses.data?.map((address, index) => { + let type = address.type.charAt(0).toUpperCase() + address.type.slice(1) + ' Address' return ( - <div - key={index} - className={"p-4 rounded-md border " + (selectedAdress && selectedAdress == address.id ? "border-gray_r-7 bg-gray_r-2" : "border-gray_r-7") } + <div + key={index} + className={ + 'p-4 rounded-md border ' + + (selectedAdress && selectedAdress == address.id + ? 'border-gray_r-7 bg-gray_r-2' + : 'border-gray_r-7') + } > <div onClick={() => changeSelectedAddress(address.id)}> - <div className="flex gap-x-2" > - <div className="badge-red">{ type }</div> - { auth?.partnerId == address.id && ( - <div className="badge-green">Utama</div> - ) } + <div className='flex gap-x-2'> + <div className='badge-red'>{type}</div> + {auth?.partnerId == address.id && <div className='badge-green'>Utama</div>} </div> - <p className="font-medium mt-2">{ address.name }</p> - { address.mobile && ( - <p className="mt-2 text-gray_r-11">{ address.mobile }</p> - ) } - <p className={`mt-1 leading-6 ${selectedAdress && selectedAdress == address.id ? "text-gray_r-12" : "text-gray_r-11"}`}> - { address.street } + <p className='font-medium mt-2'>{address.name}</p> + {address.mobile && <p className='mt-2 text-gray_r-11'>{address.mobile}</p>} + <p + className={`mt-1 leading-6 ${ + selectedAdress && selectedAdress == address.id + ? 'text-gray_r-12' + : 'text-gray_r-11' + }`} + > + {address.street} </p> </div> - <Link href={`/my/address/${address.id}/edit`} className="btn-light bg-white mt-3 w-full !text-gray_r-11">Ubah Alamat</Link> + <Link + href={`/my/address/${address.id}/edit`} + className='btn-light bg-white mt-3 w-full !text-gray_r-11' + > + Ubah Alamat + </Link> </div> - ); - }) } + ) + })} </div> </div> ) } -export default Addresses
\ No newline at end of file +export default Addresses diff --git a/src/lib/address/components/CreateAddress.jsx b/src/lib/address/components/CreateAddress.jsx index 4ba99820..62bb0858 100644 --- a/src/lib/address/components/CreateAddress.jsx +++ b/src/lib/address/components/CreateAddress.jsx @@ -1,34 +1,34 @@ -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 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' const CreateAddress = () => { const auth = useAuth() const router = useRouter() - const { - register, - formState: { errors }, + const { + register, + formState: { errors }, handleSubmit, watch, setValue, - control, - } = useForm({ + control + } = useForm({ resolver: yupResolver(validationSchema), defaultValues }) - const [ cities, setCities ] = useState([]) - const [ districts, setDistricts ] = useState([]) - const [ subDistricts, setSubDistricts ] = useState([]) + const [cities, setCities] = useState([]) + const [districts, setDistricts] = useState([]) + const [subDistricts, setSubDistricts] = useState([]) useEffect(() => { const loadCities = async () => { @@ -45,12 +45,15 @@ const CreateAddress = () => { if (watchCity) { const loadDistricts = async () => { let dataDistricts = await districtApi({ cityId: watchCity }) - dataDistricts = dataDistricts.map((district) => ({ value: district.id, label: district.name })) + dataDistricts = dataDistricts.map((district) => ({ + value: district.id, + label: district.name + })) setDistricts(dataDistricts) } loadDistricts() } - }, [ watchCity, setValue ]) + }, [watchCity, setValue]) const watchDistrict = watch('district') useEffect(() => { @@ -58,14 +61,17 @@ const CreateAddress = () => { if (watchDistrict) { const loadSubDistricts = async () => { let dataSubDistricts = await subDistrictApi({ districtId: watchDistrict }) - dataSubDistricts = dataSubDistricts.map((district) => ({ value: district.id, label: district.name })) + dataSubDistricts = dataSubDistricts.map((district) => ({ + value: district.id, + label: district.name + })) setSubDistricts(dataSubDistricts) } loadSubDistricts() } - }, [ watchDistrict, setValue ]) + }, [watchDistrict, setValue]) - const onSubmitHandler = async (values) => { + const onSubmitHandler = async (values) => { const data = { ...values, city_id: values.city, @@ -79,119 +85,93 @@ const CreateAddress = () => { toast.success('Berhasil menambahkan alamat') router.back() } - } + } return ( - <form className="p-4 flex flex-col gap-y-4" onSubmit={handleSubmit(onSubmitHandler)}> + <form className='p-4 flex flex-col gap-y-4' onSubmit={handleSubmit(onSubmitHandler)}> <div> - <label className="form-label mb-2">Label Alamat</label> + <label className='form-label mb-2'>Label Alamat</label> <Controller - name="type" + name='type' control={control} - render={props => <HookFormSelect {...props} isSearchable={false} options={types} />} + render={(props) => <HookFormSelect {...props} isSearchable={false} options={types} />} /> - <div className="text-caption-2 text-red_r-11 mt-1">{ errors.type?.message }</div> + <div className='text-caption-2 text-red_r-11 mt-1'>{errors.type?.message}</div> </div> <div> - <label className="form-label mb-2">Nama</label> - <input - {...register('name')} - placeholder="John Doe" - type="text" - className="form-input" - /> - <div className="text-caption-2 text-red_r-11 mt-1">{ errors.name?.message }</div> + <label className='form-label mb-2'>Nama</label> + <input {...register('name')} placeholder='John Doe' type='text' className='form-input' /> + <div className='text-caption-2 text-red_r-11 mt-1'>{errors.name?.message}</div> </div> <div> - <label className="form-label mb-2">Email</label> + <label className='form-label mb-2'>Email</label> <input {...register('email')} - placeholder="contoh@email.com" - type="email" - className="form-input" + placeholder='contoh@email.com' + type='email' + className='form-input' /> - <div className="text-caption-2 text-red_r-11 mt-1">{ errors.email?.message }</div> + <div className='text-caption-2 text-red_r-11 mt-1'>{errors.email?.message}</div> </div> <div> - <label className="form-label mb-2">Mobile</label> - <input - {...register('mobile')} - placeholder="08xxxxxxxx" - type="tel" - className="form-input" - /> - <div className="text-caption-2 text-red_r-11 mt-1">{ errors.mobile?.message }</div> + <label className='form-label mb-2'>Mobile</label> + <input {...register('mobile')} placeholder='08xxxxxxxx' type='tel' className='form-input' /> + <div className='text-caption-2 text-red_r-11 mt-1'>{errors.mobile?.message}</div> </div> <div> - <label className="form-label mb-2">Alamat</label> + <label className='form-label mb-2'>Alamat</label> <input {...register('street')} - placeholder="Jl. Bandengan Utara 85A" - type="text" - className="form-input" + placeholder='Jl. Bandengan Utara 85A' + type='text' + className='form-input' /> - <div className="text-caption-2 text-red_r-11 mt-1">{ errors.street?.message }</div> + <div className='text-caption-2 text-red_r-11 mt-1'>{errors.street?.message}</div> </div> <div> - <label className="form-label mb-2">Kode Pos</label> - <input - {...register('zip')} - placeholder="10100" - type="number" - className="form-input" - /> - <div className="text-caption-2 text-red_r-11 mt-1">{ errors.zip?.message }</div> + <label className='form-label mb-2'>Kode Pos</label> + <input {...register('zip')} placeholder='10100' type='number' className='form-input' /> + <div className='text-caption-2 text-red_r-11 mt-1'>{errors.zip?.message}</div> </div> <div> - <label className="form-label mb-2">Kota</label> + <label className='form-label mb-2'>Kota</label> <Controller - name="city" + name='city' control={control} - render={props => <HookFormSelect {...props} options={cities} />} + render={(props) => <HookFormSelect {...props} options={cities} />} /> - <div className="text-caption-2 text-red_r-11 mt-1">{ errors.city?.message }</div> + <div className='text-caption-2 text-red_r-11 mt-1'>{errors.city?.message}</div> </div> <div> - <label className="form-label mb-2">Kecamatan</label> + <label className='form-label mb-2'>Kecamatan</label> <Controller - name="district" + name='district' control={control} - render={props => ( - <HookFormSelect - {...props} - options={districts} - disabled={!watchCity} - /> + render={(props) => ( + <HookFormSelect {...props} options={districts} disabled={!watchCity} /> )} /> </div> <div> - <label className="form-label mb-2">Kelurahan</label> + <label className='form-label mb-2'>Kelurahan</label> <Controller - name="subDistrict" + name='subDistrict' control={control} - render={props => ( - <HookFormSelect - {...props} - options={subDistricts} - disabled={!watchDistrict} - /> + render={(props) => ( + <HookFormSelect {...props} options={subDistricts} disabled={!watchDistrict} /> )} /> </div> - <button - type="submit" - className="btn-yellow mt-2 w-full" - > + <button type='submit' className='btn-yellow mt-2 w-full'> Simpan </button> </form> @@ -205,7 +185,7 @@ const validationSchema = Yup.object().shape({ 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'), + city: Yup.string().required('Harus di-pilih') }) const defaultValues = { @@ -217,14 +197,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
\ No newline at end of file +export default CreateAddress diff --git a/src/lib/address/components/EditAddress.jsx b/src/lib/address/components/EditAddress.jsx index b866a1e6..0cfa013a 100644 --- a/src/lib/address/components/EditAddress.jsx +++ b/src/lib/address/components/EditAddress.jsx @@ -1,14 +1,14 @@ -import { yupResolver } from "@hookform/resolvers/yup" -import { useRouter } from "next/router" -import { useEffect, useState } from "react" -import * as Yup from "yup" -import cityApi from "../api/cityApi" -import { Controller, useForm } from "react-hook-form" -import districtApi from "../api/districtApi" -import subDistrictApi from "../api/subDistrictApi" -import editAddressApi from "../api/editAddressApi" -import HookFormSelect from "@/core/components/elements/Select/HookFormSelect" -import { toast } from "react-hot-toast" +import { yupResolver } from '@hookform/resolvers/yup' +import { useRouter } from 'next/router' +import { useEffect, useState } from 'react' +import * as Yup from 'yup' +import cityApi from '../api/cityApi' +import { Controller, useForm } from 'react-hook-form' +import districtApi from '../api/districtApi' +import subDistrictApi from '../api/subDistrictApi' +import editAddressApi from '../api/editAddressApi' +import HookFormSelect from '@/core/components/elements/Select/HookFormSelect' +import { toast } from 'react-hot-toast' const EditAddress = ({ id, defaultValues }) => { const router = useRouter() @@ -19,10 +19,10 @@ const EditAddress = ({ id, defaultValues }) => { watch, setValue, getValues, - control, + control } = useForm({ resolver: yupResolver(validationSchema), - defaultValues, + defaultValues }) const [cities, setCities] = useState([]) @@ -34,52 +34,52 @@ const EditAddress = ({ id, defaultValues }) => { let dataCities = await cityApi() dataCities = dataCities.map((city) => ({ value: city.id, - label: city.name, + label: city.name })) setCities(dataCities) } loadCities() }, []) - const watchCity = watch("city") + const watchCity = watch('city') useEffect(() => { - setValue("district", "") + setValue('district', '') if (watchCity) { const loadDistricts = async () => { let dataDistricts = await districtApi({ cityId: watchCity }) dataDistricts = dataDistricts.map((district) => ({ value: district.id, - label: district.name, + label: district.name })) setDistricts(dataDistricts) - let oldDistrict = getValues("oldDistrict") + let oldDistrict = getValues('oldDistrict') if (oldDistrict) { - setValue("district", oldDistrict) - setValue("oldDistrict", "") + setValue('district', oldDistrict) + setValue('oldDistrict', '') } } loadDistricts() } }, [watchCity, setValue, getValues]) - const watchDistrict = watch("district") + const watchDistrict = watch('district') useEffect(() => { - setValue("subDistrict", "") + setValue('subDistrict', '') if (watchDistrict) { const loadSubDistricts = async () => { let dataSubDistricts = await subDistrictApi({ - districtId: watchDistrict, + districtId: watchDistrict }) dataSubDistricts = dataSubDistricts.map((district) => ({ value: district.id, - label: district.name, + label: district.name })) setSubDistricts(dataSubDistricts) - let oldSubDistrict = getValues("oldSubDistrict") + let oldSubDistrict = getValues('oldSubDistrict') if (oldSubDistrict) { - setValue("subDistrict", oldSubDistrict) - setValue("oldSubDistrict", "") + setValue('subDistrict', oldSubDistrict) + setValue('oldSubDistrict', '') } } loadSubDistricts() @@ -91,143 +91,101 @@ const EditAddress = ({ id, defaultValues }) => { ...values, city_id: values.city, district_id: values.district, - sub_district_id: values.subDistrict, + sub_district_id: values.subDistrict } const address = await editAddressApi({ id, data }) if (address?.id) { - toast.success("Berhasil mengubah alamat") + toast.success('Berhasil mengubah alamat') router.back() } } return ( - <form - className="p-4 flex flex-col gap-y-4" - onSubmit={handleSubmit(onSubmitHandler)} - > + <form className='p-4 flex flex-col gap-y-4' onSubmit={handleSubmit(onSubmitHandler)}> <div> - <label className="form-label mb-2">Label Alamat</label> + <label className='form-label mb-2'>Label Alamat</label> <Controller - name="type" + name='type' control={control} - render={(props) => ( - <HookFormSelect {...props} isSearchable={false} options={types} /> - )} + render={(props) => <HookFormSelect {...props} isSearchable={false} options={types} />} /> - <div className="text-caption-2 text-red_r-11 mt-1"> - {errors.type?.message} - </div> + <div className='text-caption-2 text-red_r-11 mt-1'>{errors.type?.message}</div> </div> <div> - <label className="form-label mb-2">Nama</label> - <input - {...register("name")} - placeholder="John Doe" - type="text" - className="form-input" - /> - <div className="text-caption-2 text-red_r-11 mt-1"> - {errors.name?.message} - </div> + <label className='form-label mb-2'>Nama</label> + <input {...register('name')} placeholder='John Doe' type='text' className='form-input' /> + <div className='text-caption-2 text-red_r-11 mt-1'>{errors.name?.message}</div> </div> <div> - <label className="form-label mb-2">Email</label> + <label className='form-label mb-2'>Email</label> <input - {...register("email")} - placeholder="johndoe@example.com" - type="email" - className="form-input" + {...register('email')} + placeholder='johndoe@example.com' + type='email' + className='form-input' /> - <div className="text-caption-2 text-red_r-11 mt-1"> - {errors.email?.message} - </div> + <div className='text-caption-2 text-red_r-11 mt-1'>{errors.email?.message}</div> </div> <div> - <label className="form-label mb-2">Mobile</label> - <input - {...register("mobile")} - placeholder="08xxxxxxxx" - type="tel" - className="form-input" - /> - <div className="text-caption-2 text-red_r-11 mt-1"> - {errors.mobile?.message} - </div> + <label className='form-label mb-2'>Mobile</label> + <input {...register('mobile')} placeholder='08xxxxxxxx' type='tel' className='form-input' /> + <div className='text-caption-2 text-red_r-11 mt-1'>{errors.mobile?.message}</div> </div> <div> - <label className="form-label mb-2">Alamat</label> + <label className='form-label mb-2'>Alamat</label> <input - {...register("street")} - placeholder="Jl. Bandengan Utara 85A" - type="text" - className="form-input" + {...register('street')} + placeholder='Jl. Bandengan Utara 85A' + type='text' + className='form-input' /> - <div className="text-caption-2 text-red_r-11 mt-1"> - {errors.street?.message} - </div> + <div className='text-caption-2 text-red_r-11 mt-1'>{errors.street?.message}</div> </div> <div> - <label className="form-label mb-2">Kode Pos</label> - <input - {...register("zip")} - placeholder="10100" - type="number" - className="form-input" - /> - <div className="text-caption-2 text-red_r-11 mt-1"> - {errors.zip?.message} - </div> + <label className='form-label mb-2'>Kode Pos</label> + <input {...register('zip')} placeholder='10100' type='number' className='form-input' /> + <div className='text-caption-2 text-red_r-11 mt-1'>{errors.zip?.message}</div> </div> <div> - <label className="form-label mb-2">Kota</label> + <label className='form-label mb-2'>Kota</label> <Controller - name="city" + name='city' control={control} render={(props) => <HookFormSelect {...props} options={cities} />} /> - <div className="text-caption-2 text-red_r-11 mt-1"> - {errors.city?.message} - </div> + <div className='text-caption-2 text-red_r-11 mt-1'>{errors.city?.message}</div> </div> <div> - <label className="form-label mb-2">Kecamatan</label> + <label className='form-label mb-2'>Kecamatan</label> <Controller - name="district" + name='district' control={control} render={(props) => ( - <HookFormSelect - {...props} - options={districts} - disabled={!watchCity} - /> + <HookFormSelect {...props} options={districts} disabled={!watchCity} /> )} /> </div> <div> - <label className="form-label mb-2">Kelurahan</label> + <label className='form-label mb-2'>Kelurahan</label> <Controller - name="subDistrict" + name='subDistrict' control={control} render={(props) => ( - <HookFormSelect - {...props} - options={subDistricts} - disabled={!watchDistrict} - /> + <HookFormSelect {...props} options={subDistricts} disabled={!watchDistrict} /> )} /> </div> - <button type="submit" className="btn-yellow mt-2 w-full"> + <button type='submit' className='btn-yellow mt-2 w-full'> Simpan </button> </form> @@ -235,22 +193,20 @@ const EditAddress = ({ id, defaultValues }) => { } 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 johndoe@example.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"), + 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 johndoe@example.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') }) const types = [ - { value: "contact", label: "Contact Address" }, - { value: "invoice", label: "Invoice Address" }, - { value: "delivery", label: "Delivery Address" }, - { value: "other", label: "Other Address" }, + { value: 'contact', label: 'Contact Address' }, + { value: 'invoice', label: 'Invoice Address' }, + { value: 'delivery', label: 'Delivery Address' }, + { value: 'other', label: 'Other Address' } ] export default EditAddress diff --git a/src/lib/address/hooks/useAddresses.js b/src/lib/address/hooks/useAddresses.js index 9968d790..629e367c 100644 --- a/src/lib/address/hooks/useAddresses.js +++ b/src/lib/address/hooks/useAddresses.js @@ -1,13 +1,13 @@ -import { useQuery } from "react-query" -import addressesApi from "../api/addressesApi" +import { useQuery } from 'react-query' +import addressesApi from '../api/addressesApi' const useAddresses = () => { const fetchAddresses = async () => await addressesApi() const { data, isLoading } = useQuery('addresses', fetchAddresses) - + return { addresses: { data, isLoading } } } -export default useAddresses
\ No newline at end of file +export default useAddresses |
