fix bug on update qty cart and create quotation page

11 files changed, 77 insertions, 20 deletions

diff --git a/src/lib/auth/components/Menu.jsx b/src/lib/auth/components/Menu.jsx
index 9a73609d..8a8e2e8a 100644
--- a/src/lib/auth/components/Menu.jsx
+++ b/src/lib/auth/components/Menu.jsx
@@ -9,10 +9,13 @@ const Menu = () => {
   return (
     <div className='grid grid-cols-1 bg-white border border-gray_r-6 rounded py-2 px-4'>
       <div className='mt-4 mb-1 font-medium'>Menu</div>
-      <LinkItem href='/my/transactions' active={routeStartWith('/my/transaction')}>
+      <LinkItem href='/my/quotations' active={routeStartWith('/my/quotations')}>
+        Daftar Quotation
+      </LinkItem>
+      <LinkItem href='/my/transactions' active={routeStartWith('/my/transactions')}>
         Daftar Transaksi
       </LinkItem>
-      <LinkItem href='/my/invoices' active={routeStartWith('/my/invoice')}>
+      <LinkItem href='/my/invoices' active={routeStartWith('/my/invoices')}>
         Invoice & Faktur Pajak
       </LinkItem>
       <LinkItem href='/my/wishlist' active={routeStartWith('/my/wishlist')}>
diff --git a/src/lib/cart/components/Cart.jsx b/src/lib/cart/components/Cart.jsx
index d0685fe3..b0de5168 100644
--- a/src/lib/cart/components/Cart.jsx
+++ b/src/lib/cart/components/Cart.jsx
@@ -72,7 +72,7 @@ const Cart = () => {
   }, [products])
 
   useEffect(() => {
-    const LoadProductSImilar = async () => {
+    const LoadProductSimilar = async () => {
       const randProductIndex = Math.floor(Math.random() * products.length)
       const productLoad = await productSearchApi({
         query: `q=${products?.[randProductIndex].parent.name}&limit=10`
@@ -80,8 +80,8 @@ const Cart = () => {
 
       setProductRecomendation(productLoad)
     }
-    if (products?.length > 0) LoadProductSImilar()
-  }, [products])
+    if (products?.length > 0 && !productRecomendation) LoadProductSimilar()
+  }, [products, productRecomendation])
 
   const updateQuantity = (value, productId, operation = '') => {
     let productIndex = products.findIndex((product) => product.id == productId)
diff --git a/src/lib/invoice/components/Invoices.jsx b/src/lib/invoice/components/Invoices.jsx
index 6f7d54a0..8918fae4 100644
--- a/src/lib/invoice/components/Invoices.jsx
+++ b/src/lib/invoice/components/Invoices.jsx
@@ -78,7 +78,7 @@ const Invoices = () => {
           {invoices.data?.invoices?.map((invoice, index) => (
             <div className='p-4 shadow border border-gray_r-3 rounded-md' key={index}>
               <div className='grid grid-cols-2'>
-                <Link href={`/my/invoice/${invoice.id}`}>
+                <Link href={`${router.pathname}/${invoice.id}`}>
                   <span className='text-caption-2 text-gray_r-11'>No. Invoice</span>
                   <h2 className='text-danger-500 mt-1'>{invoice.name}</h2>
                 </Link>
@@ -91,7 +91,7 @@ const Invoices = () => {
                   <EllipsisVerticalIcon className='w-5 h-5' onClick={() => setToOthers(invoice)} />
                 </div>
               </div>
-              <Link href={`/my/invoice/${invoice.id}`}>
+              <Link href={`${router.pathname}/${invoice.id}`}>
                 <div className='grid grid-cols-2 text-caption-2 text-gray_r-11 mt-2 font-normal'>
                   <p>{invoice.invoiceDate}</p>
                   <p className='text-right'>{invoice.paymentTerm}</p>
@@ -214,7 +214,7 @@ const Invoices = () => {
                 {invoices.data?.invoices?.map((invoice) => (
                   <tr key={invoice.id}>
                     <td>
-                      <Link href={`/my/invoice/${invoice.id}`}>{invoice.name}</Link>
+                      <Link href={`${router.pathname}/${invoice.id}`}>{invoice.name}</Link>
                     </td>
                     <td>{invoice.purchaseOrderName || '-'}</td>
                     <td>{invoice.invoiceDate}</td>
diff --git a/src/lib/transaction/components/Transaction.jsx b/src/lib/transaction/components/Transaction.jsx
index 3e3f2cc7..30bb454a 100644
--- a/src/lib/transaction/components/Transaction.jsx
+++ b/src/lib/transaction/components/Transaction.jsx
@@ -2,7 +2,7 @@ import Spinner from '@/core/components/elements/Spinner/Spinner'
 import useTransaction from '../hooks/useTransaction'
 import TransactionStatusBadge from './TransactionStatusBadge'
 import Divider from '@/core/components/elements/Divider/Divider'
-import { useEffect, useMemo, useRef, useState } from 'react'
+import { useMemo, useRef, useState } from 'react'
 import { downloadPurchaseOrder, downloadQuotation } from '../utils/transactions'
 import BottomPopup from '@/core/components/elements/Popup/BottomPopup'
 import uploadPoApi from '../api/uploadPoApi'
diff --git a/src/lib/transaction/components/Transactions.jsx b/src/lib/transaction/components/Transactions.jsx
index 13417707..54316c3d 100644
--- a/src/lib/transaction/components/Transactions.jsx
+++ b/src/lib/transaction/components/Transactions.jsx
@@ -19,7 +19,7 @@ import MobileView from '@/core/components/views/MobileView'
 import DesktopView from '@/core/components/views/DesktopView'
 import Menu from '@/lib/auth/components/Menu'
 
-const Transactions = () => {
+const Transactions = ({ context = '' }) => {
   const router = useRouter()
   const { q = '', page = 1 } = router.query
 
@@ -28,6 +28,7 @@ const Transactions = () => {
   const query = {
     name: q,
     offset: (page - 1) * limit,
+    context,
     limit
   }
   const { transactions } = useTransactions({ query })
@@ -54,7 +55,7 @@ const Transactions = () => {
 
   const handleSubmit = (e) => {
     e.preventDefault()
-    router.push(`/my/transactions?q=${inputQuery}`)
+    router.push(`${router.pathname}?q=${inputQuery}`)
   }
 
   return (
@@ -89,7 +90,7 @@ const Transactions = () => {
           {transactions.data?.saleOrders?.map((saleOrder, index) => (
             <div className='p-4 shadow border border-gray_r-3 rounded-md' key={index}>
               <div className='grid grid-cols-2'>
-                <Link href={`/my/transaction/${saleOrder.id}`}>
+                <Link href={`${router.pathname}/${saleOrder.id}`}>
                   <span className='text-caption-2 text-gray_r-11'>No. Transaksi</span>
                   <h2 className='text-danger-500 mt-1'>{saleOrder.name}</h2>
                 </Link>
@@ -101,7 +102,7 @@ const Transactions = () => {
                   />
                 </div>
               </div>
-              <Link href={`/my/transaction/${saleOrder.id}`}>
+              <Link href={`${router.pathname}/${saleOrder.id}`}>
                 <div className='grid grid-cols-2 mt-3'>
                   <div>
                     <span className='text-caption-2 text-gray_r-11'>No. Purchase Order</span>
@@ -135,7 +136,7 @@ const Transactions = () => {
           <Pagination
             pageCount={pageCount}
             currentPage={parseInt(page)}
-            url={`/my/transactions${pageQuery}`}
+            url={router.pathname + pageQuery}
             className='mt-2 mb-2'
           />
 
@@ -249,7 +250,7 @@ const Transactions = () => {
                 {transactions.data?.saleOrders?.map((saleOrder) => (
                   <tr key={saleOrder.id}>
                     <td>
-                      <Link href={`/my/transaction/${saleOrder.id}`}>{saleOrder.name}</Link>
+                      <Link href={`${router.pathname}/${saleOrder.id}`}>{saleOrder.name}</Link>
                     </td>
                     <td>-</td>
                     <td className='!text-left'>{saleOrder.sales}</td>
@@ -267,7 +268,7 @@ const Transactions = () => {
             <Pagination
               pageCount={pageCount}
               currentPage={parseInt(page)}
-              url={`/my/transactions${pageQuery}`}
+              url={router.pathname + pageQuery}
               className='mt-2 mb-2'
             />
           </div>
diff --git a/src/pages/my/invoice/[id].jsx b/src/pages/my/invoices/[id].jsx
index 740819cc..5972b382 100644
--- a/src/pages/my/invoice/[id].jsx
+++ b/src/pages/my/invoices/[id].jsx
@@ -6,7 +6,7 @@ import IsAuth from '@/lib/auth/components/IsAuth'
 import InvoiceComponent from '@/lib/invoice/components/Invoice'
 import { useRouter } from 'next/router'
 
-export default function Invoice() {
+export default function MyInvoice() {
   const router = useRouter()
 
   return (
diff --git a/src/pages/my/invoices.jsx b/src/pages/my/invoices/index.jsx
index 59059b2e..73c7b9fe 100644
--- a/src/pages/my/invoices.jsx
+++ b/src/pages/my/invoices/index.jsx
@@ -5,7 +5,7 @@ import MobileView from '@/core/components/views/MobileView'
 import IsAuth from '@/lib/auth/components/IsAuth'
 import InvoicesComponent from '@/lib/invoice/components/Invoices'
 
-export default function Invoices() {
+export default function MyInvoices() {
   return (
     <IsAuth>
       <MobileView>
diff --git a/src/pages/my/transaction/[id].jsx b/src/pages/my/quotations/[id].jsx
index c3283783..1fbbf34a 100644
--- a/src/pages/my/transaction/[id].jsx
+++ b/src/pages/my/quotations/[id].jsx
@@ -6,7 +6,7 @@ import IsAuth from '@/lib/auth/components/IsAuth'
 import TransactionComponent from '@/lib/transaction/components/Transaction'
 import { useRouter } from 'next/router'
 
-export default function Transaction() {
+export default function MyQuotation() {
   const router = useRouter()
 
   return (
diff --git a/src/pages/my/quotations/index.jsx b/src/pages/my/quotations/index.jsx
new file mode 100644
index 00000000..bd91d9d0
--- /dev/null
+++ b/src/pages/my/quotations/index.jsx
@@ -0,0 +1,26 @@
+import AppLayout from '@/core/components/layouts/AppLayout'
+import BasicLayout from '@/core/components/layouts/BasicLayout'
+import DesktopView from '@/core/components/views/DesktopView'
+import MobileView from '@/core/components/views/MobileView'
+import IsAuth from '@/lib/auth/components/IsAuth'
+import dynamic from 'next/dynamic'
+
+const TransactionsComponent = dynamic(() => import('@/lib/transaction/components/Transactions'))
+
+export default function MyQuotations() {
+  return (
+    <IsAuth>
+      <MobileView>
+        <AppLayout title='Quotation'>
+          <TransactionsComponent context='quotation' />
+        </AppLayout>
+      </MobileView>
+
+      <DesktopView>
+        <BasicLayout>
+          <TransactionsComponent context='quotation' />
+        </BasicLayout>
+      </DesktopView>
+    </IsAuth>
+  )
+}
diff --git a/src/pages/my/transactions/[id].jsx b/src/pages/my/transactions/[id].jsx
new file mode 100644
index 00000000..e36c1ca4
--- /dev/null
+++ b/src/pages/my/transactions/[id].jsx
@@ -0,0 +1,27 @@
+import AppLayout from '@/core/components/layouts/AppLayout'
+import BasicLayout from '@/core/components/layouts/BasicLayout'
+import DesktopView from '@/core/components/views/DesktopView'
+import MobileView from '@/core/components/views/MobileView'
+import IsAuth from '@/lib/auth/components/IsAuth'
+import TransactionComponent from '@/lib/transaction/components/Transaction'
+import { useRouter } from 'next/router'
+
+export default function MyTransaction() {
+  const router = useRouter()
+
+  return (
+    <IsAuth>
+      <MobileView>
+        <AppLayout title='Transaksi'>
+          <TransactionComponent id={router.query.id} />
+        </AppLayout>
+      </MobileView>
+
+      <DesktopView>
+        <BasicLayout>
+          <TransactionComponent id={router.query.id} />
+        </BasicLayout>
+      </DesktopView>
+    </IsAuth>
+  )
+}
diff --git a/src/pages/my/transactions.jsx b/src/pages/my/transactions/index.jsx
index a8ca78b8..91482a39 100644
--- a/src/pages/my/transactions.jsx
+++ b/src/pages/my/transactions/index.jsx
@@ -7,7 +7,7 @@ import dynamic from 'next/dynamic'
 
 const TransactionsComponent = dynamic(() => import('@/lib/transaction/components/Transactions'))
 
-export default function Transactions() {
+export default function MyTransactions() {
   return (
     <IsAuth>
       <MobileView>