Merge branch 'master' into development_tri/feedback_UAT

6 files changed, 314 insertions, 309 deletions

diff --git a/src/lib/form/api/createLeadApi.js b/src/lib/form/api/createLeadApi.js
new file mode 100644
index 00000000..6fbd0df3
--- /dev/null
+++ b/src/lib/form/api/createLeadApi.js
@@ -0,0 +1,8 @@
+import odooApi from '@/core/api/odooApi'
+
+const createLeadApi = async ({ data }) => {
+  const lead = await odooApi('POST', '/api/v1/lead', data)
+  return lead
+}
+
+export default createLeadApi
diff --git a/src/lib/form/api/createLeadsApi.js b/src/lib/form/api/createLeadsApi.js
deleted file mode 100644
index 5665de2c..00000000
--- a/src/lib/form/api/createLeadsApi.js
+++ /dev/null
@@ -1,8 +0,0 @@
-import odooApi from '@/core/api/odooApi'
-
-const createLeadsApi = async ({ data }) => {
-  const leads = await odooApi('POST', '/api/v1/lead', data)
-  return leads
-}
-
-export default createLeadsApi
diff --git a/src/lib/form/components/CreatePembayaranTempo.jsx b/src/lib/form/components/CreatePembayaranTempo.jsx
deleted file mode 100644
index 63a013aa..00000000
--- a/src/lib/form/components/CreatePembayaranTempo.jsx
+++ /dev/null
@@ -1,131 +0,0 @@
-import HookFormSelect from '@/core/components/elements/Select/HookFormSelect'
-import getFileBase64 from '@/core/utils/getFileBase64'
-import { yupResolver } from '@hookform/resolvers/yup'
-import React, { useRef } from 'react'
-import ReCAPTCHA from 'react-google-recaptcha'
-import { Controller, useForm } from 'react-hook-form'
-import { toast } from 'react-hot-toast'
-import * as Yup from 'yup'
-
-const CreatePembayaranTempo = () => {
-  const {
-    register,
-    handleSubmit,
-    formState: { errors }
-  } = useForm({
-    resolver: yupResolver(validationSchema),
-    defaultValues
-  })
-
-  const recaptchaRef = useRef(null)
-  const npwp = useRef(null)
-
-  const onSubmitHandler = async (values) => {
-    const recaptchaValue = recaptchaRef.current.getValue()
-    if (!recaptchaValue) {
-      toast.error('Catcha harus diisi')
-      return
-    }
-    const data = {
-      ...values,
-      name : 'Pengajuan Pembayaran Tempo - ' + values.name,
-      file_npwp : values.npwp.length > 0 ?  await getFileBase64(values.npwp) : ''
-    }
-
-    console.log('ini adalah data', data)
-
-    // const address = await createLeadsApi({ data })
-    // if (address?.id) {
-    //   toast.success('Berhasil menambahkan alamat')
-    //   router.back()
-    // }
-  }
-  return (
-    <div className='container mx-auto p-4 md:p-0 my-0 md:my-10'>
-      <h1 className='text-h-sm md:text-title-sm font-semibold mb-6'>Pembayaran Tempo</h1>
-      <div className='w-full  p-4 bg-white border border-gray_r-6 rounded'>
-        <form onSubmit={handleSubmit(onSubmitHandler)}>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4'>
-            <div>
-              <label className='form-label mb-2'>Alamat Email *</label>
-              <input
-                {...register('email')}
-                placeholder='contoh@email.com'
-                type='email'
-                className='form-input'
-              />
-              <div className='text-caption-2 text-danger-500 mt-1'>{errors.email?.message}</div>
-            </div>
-          </div>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <label className='form-label mb-2'>Nama Lengkap *</label>
-              <input
-                {...register('name')}
-                placeholder='Jhon Doe'
-                type='text'
-                className='form-input'
-              />
-              <div className='text-caption-2 text-danger-500 mt-1'>{errors.name?.message}</div>
-            </div>
-          </div>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <label className='form-label mb-2'>Nomor Pokok Wajib Pajak (NPWP) *</label>
-              <input {...register('npwp')} type='file' className='form-input'/>
-              <div className='text-caption-2 text-danger-500 mt-1'>{errors.npwp?.message}</div>
-            </div>
-          </div>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <label className='form-label mb-2'>Nomor Induk Berusaha (NIB) atau</label>
-              <input {...register('nib')} type='file' className='form-input' />
-            </div>
-          </div>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <label className='form-label mb-2'>Tanda Daftar Perusahaan (TDP) atau</label>
-              <input {...register('tdp')} type='file' className='form-input' />
-              {/* <div className='text-caption-2 text-danger-500 mt-1'>{errors.name?.message}</div> */}
-            </div>
-          </div>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <label className='form-label mb-2'>Surat Izin Usaha Perdagangan (SIUP) atau</label>
-              <input {...register('siup')} type='file' className='form-input' />
-              {/* <div className='text-caption-2 text-danger-500 mt-1'>{errors.name?.message}</div> */}
-            </div>
-          </div>
-
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <ReCAPTCHA ref={recaptchaRef} sitekey={process.env.NEXT_PUBLIC_RECAPTCHA_GOOGLE} />
-            </div>
-          </div>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <button type='submit' className='btn-yellow w-full md:w-fit mt-6 ml-0 md:ml-auto'>
-                Simpan
-              </button>
-            </div>
-          </div>
-        </form>
-      </div>
-    </div>
-  )
-}
-const validationSchema = Yup.object().shape({
-  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'),
-  npwp: Yup.string().required('Harus di-isi')
-})
-const defaultValues = {
-  name: '',
-  email: '',
-  npwp: '',
-  siup: '',
-  tdp: '',
-  nib: ''
-}
-
-export default CreatePembayaranTempo
diff --git a/src/lib/form/components/KunjunganSales.jsx b/src/lib/form/components/KunjunganSales.jsx
index b96fddb5..38a07345 100644
--- a/src/lib/form/components/KunjunganSales.jsx
+++ b/src/lib/form/components/KunjunganSales.jsx
@@ -1,3 +1,4 @@
+import odooApi from '@/core/api/odooApi'
 import HookFormSelect from '@/core/components/elements/Select/HookFormSelect'
 import cityApi from '@/lib/address/api/cityApi'
 import { yupResolver } from '@hookform/resolvers/yup'
@@ -6,183 +7,196 @@ import ReCAPTCHA from 'react-google-recaptcha'
 import { Controller, useForm } from 'react-hook-form'
 import { toast } from 'react-hot-toast'
 import * as Yup from 'yup'
+import createLeadApi from '../api/createLeadApi'
 
-const CreateKunjunganSales = () => {
+const KunjunganSales = () => {
   const {
     register,
     handleSubmit,
     formState: { errors },
-    control
+    control,
+    reset
   } = useForm({
     resolver: yupResolver(validationSchema),
     defaultValues
   })
   const [cities, setCities] = useState([])
-  const [company_unit, setCompany_unit] = useState([])
+  const [companyTypes, setCompanyTypes] = useState([])
 
   const recaptchaRef = useRef(null)
 
   useEffect(() => {
     const loadCities = async () => {
       let dataCities = await cityApi()
-      dataCities = dataCities.map((city) => ({ value: city.id, label: city.name }))
+      dataCities = dataCities.map((obj) => ({ value: obj.name, label: obj.name }))
       setCities(dataCities)
     }
+    const loadCompanyTypes = async () => {
+      const dataCompanyTypes = await odooApi('GET', '/api/v1/partner/company_type')
+      setCompanyTypes(dataCompanyTypes?.map((obj) => ({ value: obj.name, label: obj.name })))
+    }
+
+    loadCompanyTypes()
     loadCities()
   }, [])
 
   const onSubmitHandler = async (values) => {
     const recaptchaValue = recaptchaRef.current.getValue()
     if (!recaptchaValue) {
-      toast.error('Catcha harus diisi')
+      toast.error('Recaptcha harus diisi')
       return
     }
+
     const data = {
-      ...values
+      name: `Pengajuan Kunjungan Sales - ${values.company}`,
+      email_from: values.email,
+      phone: values.phone,
+      description: [
+        `Nama Perusahaan: ${values.company}`,
+        `No. Telepon: ${values.phone}`,
+        `Alamat Lengkap: ${values.address}`,
+        `Kota: ${values.city}`,
+        `Unit Perusahaan: ${values.companyType}`,
+        `No. Handphone: ${values.mobile}`,
+        `Alamat Email: ${values.email}`,
+        `Keterangan: ${values.description}`
+      ].join('\n')
     }
 
-    const address = await createAddressApi({ data })
-    if (address?.id) {
-      toast.success('Berhasil menambahkan alamat')
-      router.back()
+    const createLead = await createLeadApi({ data })
+    if (createLead) {
+      toast.success('Berhasil mengirimkan formulir kunjungan sales')
+      reset()
+      recaptchaRef.current.reset()
     }
   }
   return (
     <div className='container mx-auto p-4 md:p-0 my-0 md:my-10'>
       <h1 className='text-h-sm md:text-title-sm font-semibold mb-6'>Kunjungan Sales</h1>
-      <div className='w-full  p-4 bg-white border border-gray_r-6 rounded'>
-        <div
-          class='flex items-center bg-blue-100 border border-blue-400 text-blue-500 font-bold px-4 py-3 mb-4'
-          role='alert'
-        >
-          <p>
+
+      <div className='w-full grid grid-cols-1 md:grid-cols-2'>
+        <form onSubmit={handleSubmit(onSubmitHandler)} className='grid grid-cols-1 gap-y-6'>
+          <div
+            class='flex items-center bg-blue-100 border border-blue-300 text-blue-500 font-medium px-4 py-3 rounded leading-6'
+            role='alert'
+          >
             Hubungi kami untuk mendapatkan kunjungan sales kami dan dapatkan berbagai kelebihannya
             dengan menjadi pelanggan korporat kami.
-          </p>
-        </div>
-        <form onSubmit={handleSubmit(onSubmitHandler)}>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <label className='form-label mb-2'>Nama Perusahan *</label>
-              <input
-                {...register('company')}
-                placeholder='PT.Indoteknik'
-                type='text'
-                className='form-input'
-              />
-              <div className='text-caption-2 text-danger-500 mt-1'>{errors.company?.message}</div>
-            </div>
           </div>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <label className='form-label mb-2'>No. Telp *</label>
-              <input
-                {...register('phone')}
-                placeholder='021-XXXX'
-                type='text'
-                className='form-input'
-              />
-              <div className='text-caption-2 text-danger-500 mt-1'>{errors.phone?.message}</div>
-            </div>
+          <div>
+            <label className='form-label mb-2'>Nama Perusahan*</label>
+            <input
+              {...register('company')}
+              placeholder='PT. Indoteknik Dotcom Gemilang'
+              type='text'
+              className='form-input'
+              aria-invalid={errors.company?.message}
+            />
+            <div className='text-caption-2 text-danger-500 mt-1'>{errors.company?.message}</div>
           </div>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <label className='form-label mb-2'>Alamat*</label>
-              <input
-                {...register('address')}
-                placeholder='jl. Bandengan no.31 '
-                type='text'
-                className='form-input'
-              />
-              <div className='text-caption-2 text-danger-500 mt-1'>{errors.address?.message}</div>
-            </div>
-          </div>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <label className='form-label mb-2'>Kota*</label>
-                <Controller
-                  name='city'
-                  control={control}
-                  render={(props) => <HookFormSelect {...props} options={cities} />}
-                />
-                <div className='text-caption-2 text-danger-500 mt-1'>{errors.city?.message}</div>
-            </div>
+
+          <div>
+            <label className='form-label mb-2'>No. Telepon*</label>
+            <input
+              {...register('phone')}
+              placeholder='021XXXXXXX'
+              type='text'
+              className='form-input'
+              aria-invalid={errors.phone?.message}
+            />
+            <div className='text-caption-2 text-danger-500 mt-1'>{errors.phone?.message}</div>
           </div>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <label className='form-label mb-2'>Unit Perusahaan</label>
-                <Controller
-                  name='company_unit'
-                  control={control}
-                  render={(props) => <HookFormSelect {...props} options={company_unit} />}
-                />
-                <div className='text-caption-2 text-danger-500 mt-1'>{errors.company_unit?.message}</div>
-            </div>
+
+          <div>
+            <label className='form-label mb-2'>Alamat Lengkap*</label>
+            <input
+              {...register('address')}
+              placeholder='Jl. Bandengan Utara 85A No. 8-9 RT.3/RW.16, Penjaringan, Kec. Penjaringan, Jakarta Utara'
+              type='text'
+              className='form-input'
+              aria-invalid={errors.address?.message}
+            />
+            <div className='text-caption-2 text-danger-500 mt-1'>{errors.address?.message}</div>
           </div>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <label className='form-label mb-2'>No HP *</label>
-              <input
-                {...register('email')}
-                placeholder='628XXXXXXX'
-                type='text'
-                className='form-input'
-              />
-              <div className='text-caption-2 text-danger-500 mt-1'>{errors.email?.message}</div>
-            </div>
+
+          <div>
+            <label className='form-label mb-2'>Kota*</label>
+            <Controller
+              name='city'
+              control={control}
+              render={(props) => <HookFormSelect {...props} options={cities} />}
+            />
+            <div className='text-caption-2 text-danger-500 mt-1'>{errors.city?.message}</div>
           </div>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <label className='form-label mb-2'>Alamat Email *</label>
-              <input
-                {...register('email')}
-                placeholder='contoh@email.com'
-                type='email'
-                className='form-input'
-              />
-              <div className='text-caption-2 text-danger-500 mt-1'>{errors.email?.message}</div>
-            </div>
+
+          <div>
+            <label className='form-label mb-2'>Unit Perusahaan</label>
+            <Controller
+              name='companyType'
+              control={control}
+              render={(props) => <HookFormSelect {...props} options={companyTypes} />}
+            />
+            <div className='text-caption-2 text-danger-500 mt-1'>{errors.companyType?.message}</div>
           </div>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <label className='form-label mb-2'>Keterangan</label>
-              <textarea
-                {...register('description')}
-                type='text'
-                className='form-input'
-              />
-              <div className='text-caption-2 text-danger-500 mt-1'>{errors.description?.message}</div>
-            </div>
+
+          <div>
+            <label className='form-label mb-2'>No. Handphone*</label>
+            <input
+              {...register('mobile')}
+              placeholder='628XXXXXXX'
+              type='text'
+              className='form-input'
+              aria-invalid={errors.mobile?.message}
+            />
+            <div className='text-caption-2 text-danger-500 mt-1'>{errors.mobile?.message}</div>
           </div>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <ReCAPTCHA ref={recaptchaRef} sitekey={process.env.NEXT_PUBLIC_RECAPTCHA_GOOGLE} />
-            </div>
+
+          <div>
+            <label className='form-label mb-2'>Alamat Email*</label>
+            <input
+              {...register('email')}
+              placeholder='contoh@email.com'
+              type='email'
+              className='form-input'
+              aria-invalid={errors.email?.message}
+            />
+            <div className='text-caption-2 text-danger-500 mt-1'>{errors.email?.message}</div>
           </div>
-          <div className='grid grid-cols-1 md:grid-cols-2 gap-4 mt-4'>
-            <div>
-              <button type='submit' className='btn-yellow w-full md:w-fit mt-6 ml-0 md:ml-auto'>
-                Simpan
-              </button>
-            </div>
+
+          <div>
+            <label className='form-label mb-2'>Keterangan</label>
+            <textarea {...register('description')} type='text' className='form-input' />
           </div>
+
+          <ReCAPTCHA ref={recaptchaRef} sitekey={process.env.NEXT_PUBLIC_RECAPTCHA_GOOGLE} />
+
+          <button type='submit' className='btn-yellow w-full md:w-fit ml-0 md:ml-auto'>
+            Simpan
+          </button>
         </form>
       </div>
     </div>
   )
 }
+
 const validationSchema = Yup.object().shape({
-  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'),
-  npwp: Yup.string().required('Harus di-isi')
+  company: Yup.string().required('Harus di-isi'),
+  phone: Yup.string().required('Harus di-isi'),
+  mobile: Yup.string().required('Harus di-isi'),
+  address: Yup.string().required('Harus di-isi'),
+  city: Yup.string().required('Harus dipilih')
 })
+
 const defaultValues = {
-  name: '',
   email: '',
-  npwp: '',
-  siup: '',
-  tdp: '',
-  nib: ''
+  company: '',
+  phone: '',
+  mobile: '',
+  address: '',
+  city: '',
+  companyType: '',
+  description: ''
 }
 
-export default CreateKunjunganSales
+export default KunjunganSales
diff --git a/src/lib/form/components/PembayaranTempo.jsx b/src/lib/form/components/PembayaranTempo.jsx
new file mode 100644
index 00000000..5f32753e
--- /dev/null
+++ b/src/lib/form/components/PembayaranTempo.jsx
@@ -0,0 +1,155 @@
+import getFileBase64 from '@/core/utils/getFileBase64'
+import { yupResolver } from '@hookform/resolvers/yup'
+import React, { useRef } from 'react'
+import ReCAPTCHA from 'react-google-recaptcha'
+import { useForm } from 'react-hook-form'
+import { toast } from 'react-hot-toast'
+import * as Yup from 'yup'
+import createLeadApi from '../api/createLeadApi'
+
+const PembayaranTempo = () => {
+  const {
+    register,
+    handleSubmit,
+    reset,
+    formState: { errors }
+  } = useForm({
+    resolver: yupResolver(validationSchema),
+    defaultValues
+  })
+
+  const recaptchaRef = useRef(null)
+
+  const onSubmitHandler = async (values) => {
+    const recaptchaValue = recaptchaRef.current.getValue()
+    if (!recaptchaValue) {
+      toast.error('Recaptcha harus diisi')
+      return
+    }
+
+    const npwp = document.getElementById('npwp').files[0]
+    const nib = document.getElementById('nib').files[0]
+    const tdp = document.getElementById('tdp').files[0]
+    const siup = document.getElementById('siup').files[0]
+
+    const data = {
+      name: 'Pengajuan Pembayaran Tempo - ' + values.name,
+      contact_name: values.name,
+      email_from: values.email,
+      file_npwp: npwp ? await getFileBase64(npwp) : '',
+      file_nib: nib ? await getFileBase64(nib) : '',
+      file_tdp: tdp ? await getFileBase64(tdp) : '',
+      file_siup: siup ? await getFileBase64(siup) : ''
+    }
+
+    const createLead = await createLeadApi({ data })
+    if (createLead) {
+      toast.success('Berhasil melakukan pengajuan pembayaran tempo')
+      reset()
+      recaptchaRef.current.reset()
+    }
+  }
+  return (
+    <div className='container mx-auto p-4 md:p-0 my-0 md:my-10'>
+      <h1 className='text-h-sm md:text-title-sm font-semibold mb-6'>Pembayaran Tempo</h1>
+      
+      <div className='w-full grid grid-cols-1 md:grid-cols-2'>
+        <form onSubmit={handleSubmit(onSubmitHandler)} className='grid grid-cols-1 gap-y-6'>
+          <div>
+            <label className='form-label mb-2'>Alamat Email*</label>
+            <input
+              {...register('email')}
+              placeholder='contoh@email.com'
+              type='email'
+              className='form-input'
+              aria-invalid={errors.email?.message}
+            />
+            <div className='text-caption-2 text-danger-500 mt-1'>{errors.email?.message}</div>
+          </div>
+
+          <div>
+            <label className='form-label mb-2'>Nama Lengkap*</label>
+            <input
+              {...register('name')}
+              placeholder='Jhon Doe'
+              type='text'
+              className='form-input'
+              aria-invalid={errors.name?.message}
+            />
+            <div className='text-caption-2 text-danger-500 mt-1'>{errors.name?.message}</div>
+          </div>
+
+          <div>
+            <label className='form-label mb-2'>Nomor Pokok Wajib Pajak (NPWP)*</label>
+            <input
+              {...register('npwp')}
+              type='file'
+              className='form-input'
+              accept='application/pdf'
+              id='npwp'
+              aria-invalid={errors.npwp?.message}
+            />
+            <div className='text-caption-2 text-danger-500 mt-1'>{errors.npwp?.message}</div>
+          </div>
+
+          <div>
+            <label className='form-label mb-2'>Nomor Induk Berusaha (NIB) atau</label>
+            <input
+              {...register('nib')}
+              type='file'
+              className='form-input'
+              accept='application/pdf'
+              id='nib'
+              placeholder='Hello'
+            />
+          </div>
+
+          <div>
+            <label className='form-label mb-2'>Tanda Daftar Perusahaan (TDP) atau</label>
+            <input
+              {...register('tdp')}
+              type='file'
+              className='form-input'
+              accept='application/pdf'
+              id='tdp'
+            />
+          </div>
+
+          <div>
+            <label className='form-label mb-2'>Surat Izin Usaha Perdagangan (SIUP)</label>
+            <input
+              {...register('siup')}
+              type='file'
+              className='form-input'
+              accept='application/pdf'
+              id='siup'
+            />
+          </div>
+
+          <ReCAPTCHA ref={recaptchaRef} sitekey={process.env.NEXT_PUBLIC_RECAPTCHA_GOOGLE} />
+
+          <button type='submit' className='btn-yellow w-full md:w-fit ml-0 md:ml-auto'>
+            Simpan
+          </button>
+
+          <div></div>
+        </form>
+      </div>
+    </div>
+  )
+}
+const validationSchema = Yup.object().shape({
+  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'),
+  npwp: Yup.string().required('Harus di-isi')
+})
+const defaultValues = {
+  name: '',
+  email: '',
+  npwp: '',
+  siup: '',
+  tdp: '',
+  nib: ''
+}
+
+export default PembayaranTempo
diff --git a/src/lib/transaction/components/Transaction.jsx b/src/lib/transaction/components/Transaction.jsx
index b4e050c6..3e3f2cc7 100644
--- a/src/lib/transaction/components/Transaction.jsx
+++ b/src/lib/transaction/components/Transaction.jsx
@@ -25,25 +25,8 @@ import toTitleCase from '@/core/utils/toTitleCase'
 const Transaction = ({ id }) => {
   const { transaction } = useTransaction({ id })
 
-  const [totalAmount, setTotalAmount] = useState(0)
-  const [totalDiscountAmount, setTotalDiscountAmount] = useState(0)
-
-  useEffect(() => {
-    if (transaction?.data?.products) {
-      let calculateTotalAmount = 0
-      let calculateTotalDiscountAmount = 0
-      transaction.data.products.forEach((product) => {
-        calculateTotalAmount += product.price.price * product.quantity
-        calculateTotalDiscountAmount +=
-          (product.price.price - product.price.priceDiscount) * product.quantity
-      })
-      setTotalAmount(calculateTotalAmount)
-      setTotalDiscountAmount(calculateTotalDiscountAmount)
-    }
-  }, [transaction])
-
-  const poNumber = useRef('')
-  const poFile = useRef('')
+  const poNumber = useRef(null)
+  const poFile = useRef(null)
   const [uploadPo, setUploadPo] = useState(false)
   const openUploadPo = () => setUploadPo(true)
   const closeUploadPo = () => setUploadPo(false)
@@ -97,11 +80,7 @@ const Transaction = ({ id }) => {
         <VariantGroupCard variants={transaction.data?.products} buyMore />
         <div className='flex justify-between mt-1'>
           <p className='text-gray_r-12/70'>Subtotal</p>
-          <p>{currencyFormat(totalAmount)}</p>
-        </div>
-        <div className='flex justify-between mt-1'>
-          <p className='text-gray_r-12/70'>Total Diskon</p>
-          <p>{currencyFormat(-totalDiscountAmount)}</p>
+          <p>{currencyFormat(transaction.data?.amountUntaxed)}</p>
         </div>
         <div className='flex justify-between mt-1'>
           <p className='text-gray_r-12/70'>PPN 11%</p>
@@ -113,7 +92,7 @@ const Transaction = ({ id }) => {
         </div>
       </div>
     ),
-    [transaction.data, totalAmount, totalDiscountAmount]
+    [transaction.data]
   )
 
   if (transaction.isLoading) {
@@ -295,7 +274,6 @@ const Transaction = ({ id }) => {
               <button
                 type='button'
                 className='btn-solid-red px-3 py-2'
-                // disabled={transaction.data?.status != 'draft'}
                 onClick={() => downloadQuotation(transaction.data)}
               >
                 Download
@@ -337,14 +315,6 @@ const Transaction = ({ id }) => {
                   <div className='font-medium mb-4'>Detail Pelanggan</div>
                   <SectionContent address={transaction?.data?.address?.customer} />
                 </div>
-                {/* <div className='border border-gray_r-6 rounded p-3'>
-                  <div className='font-medium mb-4'>Detail Pengiriman</div>
-                  <SectionContent address={transaction?.data?.address?.shipping} />
-                </div>
-                <div className='border border-gray_r-6 rounded p-3'>
-                  <div className='font-medium mb-4'>Detail Penagihan</div>
-                  <SectionContent address={transaction?.data?.address?.invoice} />
-                </div> */}
               </div>
 
               <div className='text-h-sm font-semibold mt-6 mb-4'>Rincian Pembelian</div>
@@ -352,9 +322,9 @@ const Transaction = ({ id }) => {
                 <thead>
                   <tr>
                     <th>Nama Produk</th>
+                    <th>Diskon</th>
                     <th>Jumlah</th>
                     <th>Harga</th>
-                    <th>Diskon</th>
                     <th>Subtotal</th>
                   </tr>
                 </thead>
@@ -368,12 +338,12 @@ const Transaction = ({ id }) => {
                             product?.parent.name,
                             product?.parent.id
                           )}
-                          className='w-[25%] flex-shrink-0'
+                          className='w-[20%] flex-shrink-0'
                         >
                           <Image
                             src={product?.parent?.image}
                             alt={product?.name}
-                            className='object-contain object-center border border-gray_r-6 h-40 w-full rounded-md'
+                            className='object-contain object-center border border-gray_r-6 h-32 w-full rounded-md'
                           />
                         </Link>
                         <div className='px-2 text-left'>
@@ -395,6 +365,11 @@ const Transaction = ({ id }) => {
                           </div>
                         </div>
                       </td>
+                      <td>
+                        {product.price.discountPercentage > 0
+                          ? `${product.price.discountPercentage}%`
+                          : ''}
+                      </td>
                       <td>{product.quantity}</td>
                       <td>
                         {product.price.discountPercentage > 0 && (
@@ -404,11 +379,6 @@ const Transaction = ({ id }) => {
                         )}
                         <div>{currencyFormat(product.price.priceDiscount)}</div>
                       </td>
-                      <td>
-                        {product.price.discountPercentage > 0
-                          ? `${product.price.discountPercentage}%`
-                          : ''}
-                      </td>
                       <td>{currencyFormat(product.price.subtotal)}</td>
                     </tr>
                   ))}
@@ -418,11 +388,8 @@ const Transaction = ({ id }) => {
               <div className='flex justify-end mt-4'>
                 <div className='w-1/4 grid grid-cols-2 gap-y-3 text-gray_r-12/80'>
                   <div className='text-right'>Subtotal</div>
-                  <div className='text-right font-medium'>{currencyFormat(totalAmount)}</div>
-
-                  <div className='text-right'>Total Diskon</div>
-                  <div className='text-right font-medium text-danger-500'>
-                    {currencyFormat(-totalDiscountAmount)}
+                  <div className='text-right font-medium'>
+                    {currencyFormat(transaction.data?.amountUntaxed)}
                   </div>
 
                   <div className='text-right'>PPN 11%</div>