no message

7 files changed, 34 insertions, 81 deletions

diff --git a/src/pages/index.js b/src/pages/index.js
index 49300883..fcf47b34 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -16,6 +16,8 @@ import Layout from "@/components/layouts/Layout";
 import ManufactureCard from "@/components/manufactures/ManufactureCard";
 import Footer from "@/components/layouts/Footer";
 import Image from "@/components/elements/Image";
+import ProductCategories from "@/components/products/ProductCategories";
+import { LazyLoadComponent } from "react-lazy-load-image-component";
 
 export async function getServerSideProps() {
   const heroBanners = await apiOdoo('GET', `/api/v1/banner?type=index-a-1`);
@@ -26,8 +28,6 @@ export async function getServerSideProps() {
 export default function Home({ heroBanners }) {
   const [manufactures, setManufactures] = useState(null);
   const [popularProducts, setPopularProducts] = useState(null);
-  const [categoryProductIds, setCategoryProductIds] = useState(null);
-  const [categoryProducts, setCategoryProducts] = useState([]);
 
   useEffect(() => {
     const getManufactures = async () => {
@@ -43,33 +43,6 @@ export default function Home({ heroBanners }) {
     getPopularProducts();
   }, []);
 
-  useEffect(() => {
-    const getCategoryProductIds = async () => {
-      if (!categoryProductIds) {
-        const dataCategoryProductIds = await apiOdoo('GET', '/api/v1/categories_homepage/ids');
-        setCategoryProductIds(dataCategoryProductIds)
-      }
-    }
-    getCategoryProductIds();
-  }, [ categoryProductIds ]);
-
-  useEffect(() => {
-    const getCategoryProducts = async () => {
-      const currentCategoryId = categoryProductIds ? categoryProductIds[categoryProducts.length] : false;
-      if (currentCategoryId) {
-        const isAdded = categoryProducts.findIndex((categoryProduct) => categoryProduct.id == currentCategoryId);
-        if (isAdded < 0) {
-          const dataCategoryProducts = await apiOdoo('GET', `/api/v1/categories_homepage?id=${currentCategoryId}`);
-          setCategoryProducts((categoryProducts) => ([
-            ...categoryProducts,
-            ...dataCategoryProducts
-          ]));
-        }
-      }
-    }
-    getCategoryProducts();
-  }, [ categoryProducts, categoryProductIds ]);
-
   return (
     <>
       <Header title='Home - Indoteknik' />
@@ -104,22 +77,9 @@ export default function Home({ heroBanners }) {
           <ProductSlider products={popularProducts} simpleProductTitleLine />
         </div>
 
-        { categoryProducts?.map((categoryProduct, index) => (
-          <div className="my-6 px-4 pt-4 relative" key={index}>
-            <ProductSlider 
-              products={categoryProduct ? {
-                products: categoryProduct.products,
-                banner: {
-                  image: categoryProduct.image,
-                  name: categoryProduct.name,
-                  url: `/shop/search?category=${categoryProduct.name}`
-                }
-              } : null} 
-              simpleProductTitleLine
-              bannerMode
-            />
-          </div>
-        )) }
+        <LazyLoadComponent>
+          <ProductCategories />
+        </LazyLoadComponent>
 
         <div className="px-4">
           <h5 className="h2 mb-2">Platform Belanja B2B Alat Teknik & Industri di Indonesia</h5>
diff --git a/src/pages/my/invoice/[id].js b/src/pages/my/invoice/[id].js
index 05247210..10f625a9 100644
--- a/src/pages/my/invoice/[id].js
+++ b/src/pages/my/invoice/[id].js
@@ -93,7 +93,7 @@ export default function DetailInvoice() {
                 <p className="text-gray_r-11 leading-none">Faktur Pembelian</p>
                 <button 
                   type="button"
-                  className="btn-solid-red py-1 px-2 ml-auto"
+                  className="btn-light py-1.5 px-3 ml-auto"
                   onClick={downloadInvoice}
                 >
                   Download
@@ -103,7 +103,7 @@ export default function DetailInvoice() {
                 <p className="text-gray_r-11 leading-none">Faktur Pajak</p>
                 <button 
                   type="button"
-                  className="btn-solid-red py-1 px-2 ml-auto"
+                  className="btn-light py-1.5 px-3 ml-auto"
                   onClick={downloadTaxInvoice}
                   disabled={invoice.efaktur ? false : true}
                 >
@@ -131,6 +131,7 @@ export default function DetailInvoice() {
                 <VariantCard
                   key={index}
                   data={product}
+                  buyMore
                 />
               )) }
               <div className="flex justify-between mt-3 font-medium">
diff --git a/src/pages/my/invoices.js b/src/pages/my/invoices.js
index d54f9487..a86ddffc 100644
--- a/src/pages/my/invoices.js
+++ b/src/pages/my/invoices.js
@@ -115,7 +115,7 @@ export default function Invoices() {
                   </div>
                 </div>
               </Link>
-              { invoice.efaktur_token ? (
+              { invoice.efaktur ? (
                 <div className="badge-green h-fit mt-3 ml-auto flex items-center gap-x-0.5">
                   <CheckIcon className="w-4 stroke-2" />
                   Faktur Pajak
diff --git a/src/pages/my/transaction/[id].js b/src/pages/my/transaction/[id].js
index a508ef77..428d71fb 100644
--- a/src/pages/my/transaction/[id].js
+++ b/src/pages/my/transaction/[id].js
@@ -72,6 +72,7 @@ export default function DetailTransaction() {
                 <VariantCard
                   key={index}
                   data={product}
+                  buyMore
                 />
               )) }
               <div className="flex justify-between mt-3 font-medium">
diff --git a/src/pages/shop/checkout.js b/src/pages/shop/checkout.js
index 875cf0f1..8a540bcd 100644
--- a/src/pages/shop/checkout.js
+++ b/src/pages/shop/checkout.js
@@ -195,6 +195,7 @@ export default function Checkout() {
 
                   { selectedAddress.shipping && (
                     <div className="mt-4 text-caption-1">
+                      <div className="badge-red mb-2">{ selectedAddress.invoicing.type.charAt(0).toUpperCase() + selectedAddress.invoicing.type.slice(1) + ' Address' }</div>
                       <p className="font-medium">{ selectedAddress.shipping.name }</p>
                       <p className="mt-2 text-gray_r-11">{ selectedAddress.shipping.mobile }</p>
                       <p className="mt-1 text-gray_r-11">{ selectedAddress.shipping.street }, { selectedAddress.shipping?.city?.name }</p>
@@ -261,6 +262,7 @@ export default function Checkout() {
 
                   { selectedAddress.invoicing && (
                     <div className="mt-4 text-caption-1">
+                      <div className="badge-red mb-2">{ selectedAddress.invoicing.type.charAt(0).toUpperCase() + selectedAddress.invoicing.type.slice(1) + ' Address' }</div>
                       <p className="font-medium">{ selectedAddress.invoicing.name }</p>
                       <p className="mt-2 text-gray_r-11">{ selectedAddress.invoicing.mobile }</p>
                       <p className="mt-1 text-gray_r-11">{ selectedAddress.invoicing.street } { selectedAddress.invoicing.street2 }</p>
diff --git a/src/pages/shop/product/[slug].js b/src/pages/shop/product/[slug].js
index 03fac0be..c3d34806 100644
--- a/src/pages/shop/product/[slug].js
+++ b/src/pages/shop/product/[slug].js
@@ -15,6 +15,8 @@ import LineDivider from "@/components/elements/LineDivider";
 import { HeartIcon as HeartIconSolid } from "@heroicons/react/24/solid";
 import { useAuth } from "@/core/utils/auth";
 import { HeartIcon } from "@heroicons/react/24/outline";
+import { LazyLoadComponent } from "react-lazy-load-image-component";
+import ProductSimilar from "@/components/products/ProductSimilar";
 
 export async function getServerSideProps( context ) {
   const { slug } = context.query;
@@ -37,7 +39,6 @@ export default function ProductDetail({ product }) {
   const { slug } = router.query;
   const [selectedVariant, setSelectedVariant] = useState("");
   const [quantity, setQuantity] = useState("1");
-  const [similarProducts, setSimilarProducts] = useState(null);
   const [activeVariant, setActiveVariant] = useState({
     id: product.id,
     code: product.code,
@@ -83,15 +84,6 @@ export default function ProductDetail({ product }) {
   }, [ product ]);
 
   useEffect(() => {
-    setSimilarProducts(null);
-    const getSimilarProducts = async () => {
-      const dataSimilarProducts = await apiOdoo('GET', `/api/v1/product/${getIdFromSlug(slug)}/similar?limit=20`);
-      setSimilarProducts(dataSimilarProducts);
-    }
-    if (slug) getSimilarProducts();
-  }, [slug]);
-
-  useEffect(() => {
     if (selectedVariant != '') {
       let newActiveVariant = product.variants.filter((variant) => {
         return variant.id == selectedVariant;
@@ -281,11 +273,10 @@ export default function ProductDetail({ product }) {
         </div>
 
         <LineDivider />
-
-        <div className="p-4">
-          <h2 className="font-bold mb-4">Kamu Mungkin Juga Suka</h2>
-          <ProductSlider products={similarProducts}/>
-        </div>
+        
+        <LazyLoadComponent>
+          <ProductSimilar productId={getIdFromSlug(slug || '')} />
+        </LazyLoadComponent>
         
         <Footer />
       </Layout>
diff --git a/src/pages/shop/quotation/index.js b/src/pages/shop/quotation/index.js
index cf2b956d..e1c196db 100644
--- a/src/pages/shop/quotation/index.js
+++ b/src/pages/shop/quotation/index.js
@@ -16,8 +16,7 @@ export default function Quotation() {
   const router = useRouter();
   const [ auth ] = useAuth();
   const [ products, setProducts ] = useState([]);
-  const [ totalPriceBeforeTax, setTotalPriceBeforeTax ] = useState(0);
-  const [ totalTaxAmount, setTotalTaxAmount ] = useState(0);
+  const [ totalAmount, setTotalAmount ] = useState(0);
   const [ totalDiscountAmount, setTotalDiscountAmount ] = useState(0);
 
   useEffect(() => {
@@ -43,18 +42,13 @@ export default function Quotation() {
 
   useEffect(() => {
     if (products) {
-      const productsSelected = products.filter((product) => product.selected == true);
-      let calculateTotalPriceBeforeTax = 0;
-      let calculateTotalTaxAmount = 0;
+      let calculateTotalAmount = 0;
       let calculateTotalDiscountAmount = 0;
-      productsSelected.forEach(product => {
-        let priceBeforeTax = product.price.price / 1.11; 
-        calculateTotalPriceBeforeTax += priceBeforeTax * product.quantity;
-        calculateTotalTaxAmount += (product.price.price - priceBeforeTax) * product.quantity;
+      products.forEach(product => {
+        calculateTotalAmount += product.price.price * product.quantity;
         calculateTotalDiscountAmount += (product.price.price - product.price.price_discount) * product.quantity;
       });
-      setTotalPriceBeforeTax(calculateTotalPriceBeforeTax);
-      setTotalTaxAmount(calculateTotalTaxAmount);
+      setTotalAmount(calculateTotalAmount);
       setTotalDiscountAmount(calculateTotalDiscountAmount);
     }
   }, [products]);
@@ -102,22 +96,26 @@ export default function Quotation() {
           <hr className="my-4 border-gray_r-6"/>
           <div className="flex flex-col gap-y-4">
             <div className="flex gap-x-2 justify-between">
-              <p>Subtotal</p>
-              <p className="font-medium">{currencyFormat(totalPriceBeforeTax)}</p>
+              <p>Total Belanja</p>
+              <p className="font-medium">{currencyFormat(totalAmount)}</p>
             </div>
             <div className="flex gap-x-2 justify-between">
-              <p>PPN 11%</p>
-              <p className="font-medium">{currencyFormat(totalTaxAmount)}</p>
+              <p>Total Diskon</p>
+              <p className="font-medium text-red_r-11">{'- ' + currencyFormat(totalDiscountAmount)}</p>
             </div>
             <div className="flex gap-x-2 justify-between">
-              <p>Total Diskon</p>
-              <p className="font-medium text-red_r-11">- {currencyFormat(totalDiscountAmount)}</p>
+              <p>Subtotal</p>
+              <p className="font-medium">{currencyFormat(totalAmount - totalDiscountAmount)}</p>
+            </div>
+            <div className="flex gap-x-2 justify-between">
+              <p>PPN 11% (Incl.)</p>
+              <p className="font-medium">{currencyFormat((totalAmount - totalDiscountAmount) * 0.11)}</p>
             </div>
           </div>
           <hr className="my-4 border-gray_r-6"/>
           <div className="flex gap-x-2 justify-between mb-4">
             <p>Grand Total</p>
-            <p className="font-medium text-yellow_r-11">{currencyFormat(totalPriceBeforeTax + totalTaxAmount - totalDiscountAmount)}</p>
+            <p className="font-medium text-yellow_r-11">{currencyFormat(totalAmount - totalDiscountAmount)}</p>
           </div>
           <p className="text-caption-2 text-gray_r-10 mb-2">*) Belum termasuk biaya pengiriman</p>
           <p className="text-caption-2 text-gray_r-10 leading-5">