<Miqdad> sort to popular when in brand page

1 files changed, 35 insertions, 9 deletions

diff --git a/src/lib/product/components/ProductSearch.jsx b/src/lib/product/components/ProductSearch.jsx
index 2fb3138a..497dfec8 100644
--- a/src/lib/product/components/ProductSearch.jsx
+++ b/src/lib/product/components/ProductSearch.jsx
@@ -1,6 +1,6 @@
 import NextImage from 'next/image';
 import { useRouter } from 'next/router';
-import { useEffect, useMemo, useState } from 'react';
+import { useEffect, useMemo, useState, useRef } from 'react';
 
 import { HStack, Image, Tag, TagCloseButton, TagLabel } from '@chakra-ui/react';
 import axios from 'axios';
@@ -50,7 +50,33 @@ const ProductSearch = ({
   const categoryId = getIdFromSlug(prefixUrl);
   const [data, setData] = useState([]);
   const [dataLob, setDataLob] = useState([]);
+  const appliedDefaultBrandOrder = useRef(false);
+
   if (defaultBrand) query.brand = defaultBrand.toLowerCase();
+  useEffect(() => {
+    if (!router.isReady) return;
+
+    const onBrandsPage = router.pathname.includes('brands');
+    const hasOrder = typeof router.query?.orderBy === 'string' && router.query.orderBy !== '';
+
+    if (onBrandsPage && !hasOrder && !appliedDefaultBrandOrder.current) {
+      let params = {
+        ...router.query,
+        orderBy: 'popular',
+      };
+      params = _.pickBy(params, _.identity);
+      const qs = toQuery(params);
+
+      // ganti URL tanpa nambah history & tanpa full reload
+      router.replace(`${prefixUrl}?${qs}`, undefined, { shallow: true });
+
+      // sinkronkan state lokal
+      setOrderBy('popular');
+
+      appliedDefaultBrandOrder.current = true;
+    }
+  }, [router.isReady, router.pathname, router.query?.orderBy, prefixUrl]);
+
   const dataIdCategories = [];
   useEffect(() => {
     if (prefixUrl.includes('category')) {
@@ -84,7 +110,7 @@ const ProductSearch = ({
       if (router.asPath.includes('penawaran')) {
         query = {
           ...query,
-          fq:`flashsale_id_i:${router.query.penawaran} AND  flashsale_price_f:[1 TO *]`,
+          fq: `flashsale_id_i:${router.query.penawaran} AND  flashsale_price_f:[1 TO *]`,
           orderBy: 'flashsale-discount-desc',
         };
         setFinalQuery(query);
@@ -436,7 +462,7 @@ const ProductSearch = ({
                   <>
                     {productStart + 1}-
                     {parseInt(productStart) + parseInt(productRows) >
-                    productFound
+                      productFound
                       ? productFound
                       : parseInt(productStart) + parseInt(productRows)}
                     &nbsp;dari&nbsp;
@@ -597,7 +623,7 @@ const ProductSearch = ({
                       <>
                         {productStart + 1}-
                         {parseInt(productStart) + parseInt(productRows) >
-                        productFound
+                          productFound
                           ? productFound
                           : parseInt(productStart) + parseInt(productRows)}
                         &nbsp;dari&nbsp;
@@ -673,8 +699,8 @@ const ProductSearch = ({
                       href={
                         query?.q
                           ? whatsappUrl('productSearch', {
-                              name: query.q,
-                            })
+                            name: query.q,
+                          })
                           : whatsappUrl()
                       }
                       className='text-danger-500'
@@ -759,9 +785,9 @@ const FilterChoicesComponent = ({
         </Tag>
       )}
       {brandValues?.length > 0 ||
-      categoryValues?.length > 0 ||
-      priceFrom ||
-      priceTo ? (
+        categoryValues?.length > 0 ||
+        priceFrom ||
+        priceTo ? (
         <span>
           <button
             className='btn-transparent py-2 px-5 h-[40px] text-red-700'