no message

3 files changed, 41 insertions, 10 deletions

diff --git a/src/pages/shop/brands/[slug].js b/src/pages/shop/brands/[slug].js
index 928da0d0..64ff7706 100644
--- a/src/pages/shop/brands/[slug].js
+++ b/src/pages/shop/brands/[slug].js
@@ -6,8 +6,15 @@ import Header from "@/components/layouts/Header";
 import Layout from "@/components/layouts/Layout";
 import Pagination from "@/components/elements/Pagination";
 import ProductCard from "@/components/products/ProductCard";
-import { getNameFromSlug } from "@/core/utils/slug";
+import { getIdFromSlug, getNameFromSlug } from "@/core/utils/slug";
 import FilterIcon from "@/icons/filter.svg";
+import apiOdoo from "@/core/utils/apiOdoo";
+import { Swiper, SwiperSlide } from "swiper/react";
+import "swiper/css";
+import "swiper/css/pagination";
+import "swiper/css/autoplay";
+import { Pagination as SwiperPagination } from "swiper";
+import Image from "@/components/elements/Image";
 
 export async function getServerSideProps(context) {
   const { 
@@ -30,6 +37,8 @@ export async function getServerSideProps(context) {
   ].join('&');
   let searchResults = await axios(`${process.env.SELF_HOST}/api/shop/search?${urlParameter}`);
   searchResults = searchResults.data;
+
+  const manufacture = await apiOdoo('GET', `/api/v1/manufacture/${getIdFromSlug(slug)}`);
   
   return {
     props: { 
@@ -39,7 +48,8 @@ export async function getServerSideProps(context) {
       category, 
       price_from,
       price_to,
-      order_by
+      order_by,
+      manufacture
     }
   };
 }
@@ -51,7 +61,8 @@ export default function BrandDetail({
   category, 
   price_from,
   price_to,
-  order_by
+  order_by,
+  manufacture
 }) {
   const pageCount = Math.ceil(searchResults.response.numFound / searchResults.responseHeader.params.rows);
   const productStart = searchResults.responseHeader.params.start;
@@ -94,8 +105,28 @@ export default function BrandDetail({
         disableFilter={['brand']}
       />
       <Layout>
+        <Swiper slidesPerView={1} pagination={{dynamicBullets: true}} modules={[SwiperPagination]}>
+          {
+            manufacture.banners?.map((banner, index) => (
+              <SwiperSlide key={index}>
+                <Image
+                  src={banner} 
+                  alt={`Banner ${manufacture.name}`} 
+                  className="w-full h-auto"
+                />
+              </SwiperSlide>
+            ))
+          }
+        </Swiper>
         <div className="p-4">
-          <h1 className="mb-2">Produk</h1>
+          <div className="flex">
+            { manufacture.logo ? (
+              <Image src={manufacture?.logo} alt={manufacture.name} className="w-4/12 border border-gray_r-6 rounded p-3" />
+            ) : (
+              <p className="badge-red text-caption-1">Brand { manufacture.name }</p>
+            ) }
+          </div>
+          <h1 className="mb-2 mt-4">Produk</h1>
           <div className="text-caption-1 mb-4">
             {productFound > 0 ? (
               <>
diff --git a/src/pages/shop/brands/index.js b/src/pages/shop/brands/index.js
index fec2405a..bfdcd403 100644
--- a/src/pages/shop/brands/index.js
+++ b/src/pages/shop/brands/index.js
@@ -1,7 +1,7 @@
 import Header from "@/components/layouts/Header";
 import apiOdoo from "@/core/utils/apiOdoo";
 import InfiniteScroll from "react-infinite-scroll-component";
-import { useEffect, useState } from "react";
+import { useCallback, useEffect, useState } from "react";
 import Spinner from "@/components/elements/Spinner";
 import Layout from "@/components/layouts/Layout";
 import ManufactureCard from "@/components/manufactures/ManufactureCard";
@@ -20,12 +20,12 @@ export default function Brands({ initialManufactures }) {
   const alpha = Array.from(Array(26)).map((e, i) => i + 65);
   const alphabets = alpha.map((x) => String.fromCharCode(x));
 
-  const getMoreManufactures = async () => {
+  const getMoreManufactures = useCallback(async () => {
     const name = manufactureStartwith != '' ? `${manufactureStartwith}%` : '';
     const result = await apiOdoo('GET', `/api/v1/manufacture?limit=30&offset=${manufactures.length}&name=${name}`);
     setHasMoreManufacture(manufactures.length + 30 < result.manufacture_total)
     setManufactures((manufactures) => [...manufactures, ...result.manufactures]);
-  };
+  }, [ manufactureStartwith ]);
 
   const filterManufactureStartWith = (character) => {
     setManufactures([]);
@@ -38,7 +38,7 @@ export default function Brands({ initialManufactures }) {
 
   useEffect(() => {
     getMoreManufactures();
-  }, [manufactureStartwith]);
+  }, [ getMoreManufactures ]);
 
   return (
     <>
@@ -48,7 +48,7 @@ export default function Brands({ initialManufactures }) {
           <h1>Semua Brand di Indoteknik</h1>
           <div className="flex overflow-x-auto gap-x-2 py-2">
             {alphabets.map((alphabet, index) => (
-              <button key={index} className={"p-2 py-1 border bg-white border-gray_r-6 rounded w-10 flex-shrink-0" + (manufactureStartwith == alphabet ? ' bg-yellow_r-9 border-yellow_r-9 ' : '')} onClick={() => filterManufactureStartWith(alphabet)}>
+              <button key={index} className={"p-2 py-1 border bg-white border-gray_r-6 rounded w-10 flex-shrink-0" + (manufactureStartwith == alphabet ? ' !bg-yellow_r-9 border-yellow_r-9 ' : '')} onClick={() => filterManufactureStartWith(alphabet)}>
                 {alphabet}
               </button>
             ))}
diff --git a/src/pages/shop/cart.js b/src/pages/shop/cart.js
index d8327a10..ef62bb23 100644
--- a/src/pages/shop/cart.js
+++ b/src/pages/shop/cart.js
@@ -134,7 +134,7 @@ export default function Cart() {
     ConfirmAlert
   } = useConfirmAlert({
     title: 'Hapus barang dari keranjang',
-    caption:'Apakah anda yakin menghapus barang dari keranjang',
+    caption:'Apakah anda yakin menghapus barang dari keranjang?',
     closeText: 'Batal',
     submitText: 'Hapus',
     onSubmit: deleteItem