Merged in refactor (pull request #1)

Refactor

1 files changed, 158 insertions, 0 deletions

diff --git a/src/lib/auth/components/CompanyProfile.jsx b/src/lib/auth/components/CompanyProfile.jsx
new file mode 100644
index 00000000..1b25551e
--- /dev/null
+++ b/src/lib/auth/components/CompanyProfile.jsx
@@ -0,0 +1,158 @@
+import odooApi from '@/core/api/odooApi'
+import HookFormSelect from '@/core/components/elements/Select/HookFormSelect'
+import useAuth from '@/core/hooks/useAuth'
+import addressApi from '@/lib/address/api/addressApi'
+import { ChevronDownIcon, ChevronUpIcon } from '@heroicons/react/24/outline'
+import { useEffect, useState } from 'react'
+import { Controller, useForm } from 'react-hook-form'
+import { toast } from 'react-hot-toast'
+
+const CompanyProfile = () => {
+  const auth = useAuth()
+  const [isOpen, setIsOpen] = useState(false)
+  const toggle = () => setIsOpen(!isOpen)
+  const { register, setValue, control, handleSubmit } = useForm({
+    defaultValues: {
+      industry: '',
+      companyType: '',
+      name: '',
+      taxName: '',
+      npwp: ''
+    }
+  })
+
+  const [industries, setIndustries] = useState([])
+  useEffect(() => {
+    const loadIndustries = async () => {
+      const dataIndustries = await odooApi('GET', '/api/v1/partner/industry')
+      setIndustries(dataIndustries?.map((o) => ({ value: o.id, label: o.name })))
+    }
+    loadIndustries()
+  }, [])
+
+  const [companyTypes, setCompanyTypes] = useState([])
+  useEffect(() => {
+    const loadCompanyTypes = async () => {
+      const dataCompanyTypes = await odooApi('GET', '/api/v1/partner/company_type')
+      setCompanyTypes(dataCompanyTypes?.map((o) => ({ value: o.id, label: o.name })))
+    }
+    loadCompanyTypes()
+  }, [])
+
+  useEffect(() => {
+    const loadProfile = async () => {
+      const dataProfile = await addressApi({ id: auth.parentId })
+      setValue('name', dataProfile.name)
+      setValue('industry', dataProfile.industryId)
+      setValue('companyType', dataProfile.companyTypeId)
+      setValue('taxName', dataProfile.taxName)
+      setValue('npwp', dataProfile.npwp)
+    }
+    if (auth) loadProfile()
+  }, [auth, setValue])
+
+  const onSubmitHandler = async (values) => {
+    const data = {
+      ...values,
+      company_type_id: values.companyType,
+      industry_id: values.industry,
+      tax_name: values.taxName
+    }
+    const isUpdated = await odooApi('PUT', `/api/v1/partner/${auth.parentId}`, data)
+    if (isUpdated?.id) {
+      setIsOpen(false)
+      toast.success('Berhasil mengubah profil', { duration: 1500 })
+      return
+    }
+    toast.error('Terjadi kesalahan internal')
+  }
+
+  return (
+    <>
+      <button
+        type='button'
+        onClick={toggle}
+        className='p-4 flex items-center text-left'
+      >
+        <div>
+          <div className='font-semibold mb-2'>Informasi Usaha</div>
+          <div className='text-gray_r-11'>
+            Dibawah ini adalah data usaha yang anda masukkan, periksa kembali data usaha anda.
+          </div>
+        </div>
+        <div className='p-2 bg-gray_r-3 rounded'>
+          {!isOpen && <ChevronDownIcon className='w-6' />}
+          {isOpen && <ChevronUpIcon className='w-6' />}
+        </div>
+      </button>
+
+      {isOpen && (
+        <form
+          className='p-4 border-t border-gray_r-6 flex flex-col gap-y-4'
+          onSubmit={handleSubmit(onSubmitHandler)}
+        >
+          <div>
+            <label className='block mb-3'>Klasifikasi Jenis Usaha</label>
+            <Controller
+              name='industry'
+              control={control}
+              render={(props) => (
+                <HookFormSelect
+                  {...props}
+                  options={industries}
+                />
+              )}
+            />
+          </div>
+          <div className='flex flex-wrap'>
+            <div className='w-full mb-3'>Nama Usaha</div>
+            <div className='w-3/12 pr-1'>
+              <Controller
+                name='companyType'
+                control={control}
+                render={(props) => (
+                  <HookFormSelect
+                    {...props}
+                    options={companyTypes}
+                  />
+                )}
+              />
+            </div>
+            <div className='w-9/12 pl-1'>
+              <input
+                {...register('name')}
+                type='text'
+                className='form-input'
+                placeholder='Cth: Indoteknik Dotcom Gemilang'
+              />
+            </div>
+          </div>
+          <div>
+            <label>Nama Wajib Pajak</label>
+            <input
+              {...register('taxName')}
+              type='text'
+              className='form-input mt-3'
+            />
+          </div>
+          <div>
+            <label>Nomor NPWP</label>
+            <input
+              {...register('npwp')}
+              type='text'
+              className='form-input mt-3'
+            />
+          </div>
+          <button
+            type='submit'
+            className='btn-yellow w-full mt-2'
+          >
+            Simpan
+          </button>
+        </form>
+      )}
+    </>
+  )
+}
+
+export default CompanyProfile