From f09422d942fad5de2a81c19a7d66a4f403b69ed4 Mon Sep 17 00:00:00 2001
From: Miqdad <ahmadmiqdad27@gmail.com>
Date: Thu, 25 Sep 2025 11:58:25 +0700
Subject: <Miqdad> CR Filter

---
 src/lib/product/components/ProductSearch.jsx | 36 +++++++++++++---------------
 1 file changed, 17 insertions(+), 19 deletions(-)

diff --git a/src/lib/product/components/ProductSearch.jsx b/src/lib/product/components/ProductSearch.jsx
index 497dfec8..850d00cc 100644
--- a/src/lib/product/components/ProductSearch.jsx
+++ b/src/lib/product/components/ProductSearch.jsx
@@ -6,7 +6,7 @@ import { HStack, Image, Tag, TagCloseButton, TagLabel } from '@chakra-ui/react';
 import axios from 'axios';
 import _ from 'lodash';
 import { toQuery } from 'lodash-contrib';
-
+import { FunnelIcon, AdjustmentsHorizontalIcon } from '@heroicons/react/24/outline';
 import odooApi from '@/core/api/odooApi';
 import searchSpellApi from '@/core/api/searchSpellApi';
 import Link from '@/core/components/elements/Link/Link';
@@ -430,9 +430,7 @@ const ProductSearch = ({
         <div className='p-4 pt-0'>
           {isNotReadyStockPage && isBrand && isBrand.logo && (
             <div className='mb-3'>
-              <h1 className='mb-2 font-semibold text-h-sm'>
-                Brand Pencarian {q}
-              </h1>
+              <h1 className='mb-2 font-semibold text-h-sm'>Brand Pencarian {q}</h1>
               <Link
                 href={createSlug('/shop/brands/', isBrand.name, isBrand.id)}
                 className='inline'
@@ -445,7 +443,9 @@ const ProductSearch = ({
               </Link>
             </div>
           )}
+
           <h1 className='mb-2 font-semibold text-h-sm'>Produk</h1>
+
           <FilterChoicesComponent
             brandValues={brandValues}
             categoryValues={categoryValues}
@@ -454,6 +454,7 @@ const ProductSearch = ({
             handleDeleteFilter={handleDeleteFilter}
           />
 
+          {/* info jumlah hasil */}
           <div className='mb-2 leading-6 text-gray_r-11'>
             {!spellings ? (
               <>
@@ -461,8 +462,7 @@ const ProductSearch = ({
                 {pageCount > 1 ? (
                   <>
                     {productStart + 1}-
-                    {parseInt(productStart) + parseInt(productRows) >
-                      productFound
+                    {parseInt(productStart) + parseInt(productRows) > productFound
                       ? productFound
                       : parseInt(productStart) + parseInt(productRows)}
                     &nbsp;dari&nbsp;
@@ -474,8 +474,7 @@ const ProductSearch = ({
                 &nbsp;produk{' '}
                 {query.q && (
                   <>
-                    untuk pencarian{' '}
-                    <span className='font-semibold'>{query.q}</span>
+                    untuk pencarian <span className='font-semibold'>{query.q}</span>
                   </>
                 )}
               </>
@@ -483,37 +482,37 @@ const ProductSearch = ({
               SpellingComponent
             )}
           </div>
-          <LobSectionCategory categories={dataLob} />
-          <CategorySection categories={dataCategories} />
 
           {productFound > 0 && (
-            <div className='flex items-center gap-x-2 mb-5 justify-between'>
+            <div className='flex items-center gap-x-2 mt-2 mb-3 justify-end'>
               <div>
                 <button
-                  className='btn-light py-2 px-5 h-[40px]'
+                  aria-label='Filter'
+                  title='Filter'
                   onClick={popup.activate}
+                  className='btn-light w-fit flex items-center justify-center rounded-md'
                 >
-                  Filter
+                  <AdjustmentsHorizontalIcon className='w-5 h-5' />
                 </button>
               </div>
-              <div className=''>
+              <div>
                 <select
                   name='limit'
-                  className='form-input w-24'
+                  className='form-input w-20'
                   value={router.query?.limit || ''}
                   onChange={(e) => handleLimit(e)}
                 >
                   {numRows.map((option, index) => (
                     <option key={index} value={option}>
-                      {' '}
-                      {option}{' '}
+                      {option}
                     </option>
                   ))}
                 </select>
               </div>
             </div>
           )}
-
+          {!!dataLob?.length && <LobSectionCategory categories={dataLob} />}
+          {!!dataCategories?.length && <CategorySection categories={dataCategories} />}
           <div className='grid grid-cols-2 gap-3'>
             {products &&
               products.map((product) => (
@@ -525,7 +524,6 @@ const ProductSearch = ({
             pageCount={pageCount}
             currentPage={parseInt(page)}
             url={`${prefixUrl}?${toQuery(_.omit(query, ['page', 'fq']))}`}
-            // url={prefixUrl.includes('category') || prefixUrl.includes('lob')? `${prefixUrl}?${toQuery(_.omit(finalQuery, ['page']))}` : `${prefixUrl}?${toQuery(_.omit(query, ['page']))}`}
             className='mt-6 mb-2'
           />
 
-- 
cgit v1.2.3