Fixing

1 files changed, 56 insertions, 52 deletions

diff --git a/src/pages/my/invoices.js b/src/pages/my/invoices.js
index ed9ba660..9b2e77dc 100644
--- a/src/pages/my/invoices.js
+++ b/src/pages/my/invoices.js
@@ -1,71 +1,71 @@
-import WithAuth from "@/components/auth/WithAuth";
-import Alert from "@/components/elements/Alert";
-import Link from "@/components/elements/Link";
-import AppBar from "@/components/layouts/AppBar";
-import Layout from "@/components/layouts/Layout";
-import apiOdoo from "@/core/utils/apiOdoo";
-import { useAuth } from "@/core/utils/auth";
-import currencyFormat from "@/core/utils/currencyFormat";
-import useBottomPopup from "@/lib/elements/hooks/useBottomPopup";
-import { CheckIcon, ClockIcon, EllipsisVerticalIcon, MagnifyingGlassIcon } from "@heroicons/react/24/outline";
-import { useRouter } from "next/router";
-import { useEffect, useRef, useState } from "react";
+import WithAuth from "@/components/auth/WithAuth"
+import Alert from "@/components/elements/Alert"
+import Link from "@/components/elements/Link"
+import Pagination from "@/components/elements/Pagination"
+import AppBar from "@/components/layouts/AppBar"
+import Layout from "@/components/layouts/Layout"
+import apiOdoo from "@/core/utils/apiOdoo"
+import { useAuth } from "@/core/utils/auth"
+import currencyFormat from "@/core/utils/currencyFormat"
+import useBottomPopup from "@/lib/elements/hooks/useBottomPopup"
+import { CheckIcon, ClockIcon, EllipsisVerticalIcon, MagnifyingGlassIcon } from "@heroicons/react/24/outline"
+import { useRouter } from "next/router"
+import { useEffect, useRef, useState } from "react"
 
 export default function Invoices() {
-  const [ auth ] = useAuth();
-  const router = useRouter();
+  const [ auth ] = useAuth()
+  const router = useRouter()
   const { 
     q, 
     page = 1 
-  } = router.query;
+  } = router.query
 
-  const [ invoices, setInvoices ] = useState([]);
-  const [ activePopupId, setActivePopupId ] = useState(null);
+  const [ invoices, setInvoices ] = useState([])
 
-  const [ pageCount, setPageCount ] = useState(0);
-  const [ isLoading, setIsLoading ] = useState(true);
+  const [ pageCount, setPageCount ] = useState(0)
+  const [ isLoading, setIsLoading ] = useState(true)
 
-  const searchQueryRef = useRef();
+  const searchQueryRef = useRef()
 
   useEffect(() => {
     const loadInvoices = async () => {
       if (auth) {
-        const limit = 10;
-        let offset = (page - 1) * 10;
-        let queryParams = [`limit=${limit}`, `offset=${offset}`];
-        if (q) queryParams.push(`name=${q}`);
-        queryParams = queryParams.join('&');
-        queryParams = queryParams ? '?' + queryParams : '';
+        const limit = 10
+        let offset = (page - 1) * 10
+        let queryParams = [`limit=${limit}`, `offset=${offset}`]
+        if (q) queryParams.push(`name=${q}`)
+        queryParams = queryParams.join('&')
+        queryParams = queryParams ? '?' + queryParams : ''
 
-        const dataInvoices = await apiOdoo('GET', `/api/v1/partner/${auth.partner_id}/invoice${queryParams}`);
-        setInvoices(dataInvoices);
-        setPageCount(Math.ceil(dataInvoices.sale_order_total / limit));
-        setIsLoading(false);
-      };
-    };
-    loadInvoices();
-  }, [ auth, q, page ]);
+        const dataInvoices = await apiOdoo('GET', `/api/v1/partner/${auth.partner_id}/invoice${queryParams}`)
+        setInvoices(dataInvoices)
+        setPageCount(Math.ceil(dataInvoices.sale_order_total / limit))
+        setIsLoading(false)
+      }
+    }
+    loadInvoices()
+  }, [ auth, q, page ])
 
   const actionSearch = (e) => {
-    e.preventDefault();
-    let queryParams = [];
-    if (searchQueryRef.current.value) queryParams.push(`q=${searchQueryRef.current.value}`);
-    queryParams = queryParams.join('&');
-    queryParams = queryParams ? `?${queryParams}` : '';
-    router.push(`/my/invoices${queryParams}`);
-  };
+    e.preventDefault()
+    let queryParams = []
+    if (searchQueryRef.current.value) queryParams.push(`q=${searchQueryRef.current.value}`)
+    queryParams = queryParams.join('&')
+    queryParams = queryParams ? `?${queryParams}` : ''
+    router.push(`/my/invoices${queryParams}`)
+  }
 
   const downloadInvoice = (data) => {
-    const url = `${process.env.ODOO_HOST}/api/v1/download/invoice/${data.id}/${data.token}`;
-    window.open(url, 'download');
-    closePopup();
-  };
+    const url = `${process.env.ODOO_HOST}/api/v1/download/invoice/${data.id}/${data.token}`
+    window.open(url, 'download')
+    closePopup()
+  }
   
   const downloadTaxInvoice = (data) => {
-    const url = `${process.env.ODOO_HOST}/api/v1/download/tax-invoice/${data.id}/${data.token}`;
-    window.open(url, 'download');
-    closePopup();
-  };
+    const url = `${process.env.ODOO_HOST}/api/v1/download/tax-invoice/${data.id}/${data.token}`
+    window.open(url, 'download')
+    closePopup()
+  }
 
   const childrenPopup = (data) => (
     <div className="flex flex-col gap-y-6">
@@ -83,7 +83,7 @@ export default function Invoices() {
         Download Faktur Pajak
       </button>
     </div>
-  );
+  )
 
   const {
     closePopup,
@@ -92,7 +92,7 @@ export default function Invoices() {
   } = useBottomPopup({
     title: 'Lainnya',
     children: childrenPopup
-  });
+  })
 
   return (
     <WithAuth>
@@ -169,8 +169,12 @@ export default function Invoices() {
             </div>
           )) }
         </div>
+
+        <div className="pb-6 pt-2">
+          <Pagination currentPage={page} pageCount={pageCount} url={`/my/invoices${q ? `?q=${q}` : ''}`} />
+        </div>
         { BottomPopup }
       </Layout>
     </WithAuth>
-  );
+  )
 }
\ No newline at end of file