3 files changed, 46 insertions, 8 deletions

diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx
index fb94e4a6..d9f5658e 100644
--- a/src/core/components/elements/Navbar/NavbarDesktop.jsx
+++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx
@@ -40,7 +40,7 @@ const NavbarDesktop = () => {
   const router = useRouter()
 
   const { product } = useProductContext()
-  
+
   useEffect(() => {
     if (router.pathname === '/shop/product/[slug]') {
       setPayloadWa({
@@ -110,7 +110,9 @@ const NavbarDesktop = () => {
               <br />
               Quotation
             </Link>
-            <Cardheader cartCount={cartCount}/>
+
+            <Cardheader cartCount={cartCount} />
+
             <Link
               target='_blank'
               rel='noreferrer'
@@ -134,6 +136,7 @@ const NavbarDesktop = () => {
             </a>
           </div>
         </div>
+
         <div className='container mx-auto mt-6'>
           <div className='flex'>
             <button
diff --git a/src/core/components/elements/Navbar/Search.jsx b/src/core/components/elements/Navbar/Search.jsx
index f4a8ab3a..e4f89103 100644
--- a/src/core/components/elements/Navbar/Search.jsx
+++ b/src/core/components/elements/Navbar/Search.jsx
@@ -3,12 +3,18 @@ import { MagnifyingGlassIcon } from '@heroicons/react/24/outline'
 import { useCallback, useEffect, useRef, useState } from 'react'
 import Link from '../Link/Link'
 import { useRouter } from 'next/router'
+import { getIdFromSlug, getNameFromSlug } from '@/core/utils/slug'
 
 const Search = () => {
   const router = useRouter()
   const queryRef = useRef()
+  const { slug = '' } = router.query
   const [query, setQuery] = useState(router.query.q || '')
   const [suggestions, setSuggestions] = useState([])
+  const [segment, setSegment] = useState(null)
+  const [optionSegment, setOptionSegment] = useState(null)
+  const [optoinSelected, setOptionSelected] = useState(getNameFromSlug(slug) || 'default')
+  const [pathSegments, setPathSegments] = useState(router?.asPath.split('/') || [])
 
   const loadSuggestion = useCallback(() => {
     if (query && document.activeElement == queryRef.current) {
@@ -26,14 +32,29 @@ const Search = () => {
     } else {
       setSuggestions([])
     }
+    setFilterSearch()
   }, [loadSuggestion, query])
 
   const handleSubmit = (e) => {
     e.preventDefault()
-    if (query) {
-      router.push(`/shop/search?q=${query}`)
+    if (optionSegment && optoinSelected !== 'default' && optoinSelected) {
+      router.push(`/shop/${segment}/${slug}?q=${query}`)
     } else {
-      queryRef.current.focus()
+      if (query) {
+        router.push(`/shop/search?q=${query}`)
+      } else {
+        queryRef.current.focus()
+      }
+    }
+  }
+
+  const handleSelectChange = async (e) => {
+    await setOptionSelected(e.target.value)
+  }
+  const setFilterSearch = async () => {
+    if (router.pathname.includes('brands') && pathSegments[3]) {
+      await setSegment(pathSegments[2])
+      await setOptionSegment(getNameFromSlug(slug))
     }
   }
 
@@ -46,10 +67,23 @@ const Search = () => {
   return (
     <>
       <form onSubmit={handleSubmit} className='flex-1 flex relative'>
+        {segment && (
+          <select
+            value={optoinSelected}
+            onChange={handleSelectChange}
+            className='form-select p-3 rounded-l-sm bg-white border border-gray_r-6 border-r-0 capitalize'
+          >
+            <option value='default'>Di Indoteknik</option>
+            <option value={optionSegment}>Di {optionSegment}</option>
+          </select>
+        )}
+
         <input
           type='text'
           ref={queryRef}
-          className='form-input p-3 rounded-r-none border-r-0 focus:border-gray_r-6'
+          className={`form-input p-3 ${
+            segment ? 'rounded-l-none border-l-0' : ''
+          } rounded-r-none border-r-0 focus:border-gray_r-6`}
           placeholder='Ketik nama, part number, merk'
           value={query}
           onChange={(e) => setQuery(e.target.value)}
diff --git a/src/core/components/elements/Product/cartProductsList.jsx b/src/core/components/elements/Product/cartProductsList.jsx
index 32df992b..9662cd3b 100644
--- a/src/core/components/elements/Product/cartProductsList.jsx
+++ b/src/core/components/elements/Product/cartProductsList.jsx
@@ -15,7 +15,6 @@ const CardProdcuctsList = ({
   updateQuantity = () => {},
   setDeleteConfirmation = () => {}
 }) => {
-
   return (
     <table className='table-cart'>
       <thead>
@@ -144,7 +143,9 @@ const CardProdcuctsList = ({
                       {product?.code}{' '}
                       {product?.attributes.length > 0 ? `| ${product?.attributes.join(', ')}` : ''}
                     </div>
-                    <div className='text-gray_r-11 mt-2'>Berat item : {product?.weight} Kg</div>
+                    <div className='text-gray_r-11 mt-2'>
+                      Berat item : {product?.weight} Kg x {product?.quantity} Barang
+                    </div>
                   </div>
                 </td>
                 <td className='relative'>