2 files changed, 4 insertions, 4 deletions
diff --git a/src/lib/product/components/ProductFilter.jsx b/src/lib/product/components/ProductFilter.jsx
index 14eef0ba..69738b33 100644
--- a/src/lib/product/components/ProductFilter.jsx
+++ b/src/lib/product/components/ProductFilter.jsx
@@ -15,7 +15,7 @@ const orderOptions = [
 const ProductFilter = ({ active, close, brands, categories, prefixUrl, defaultBrand = null }) => {
   const router = useRouter()
   const { query } = router
-  const [order, setOrder] = useState(query?.orderBy)
+  const [order, setOrder] = useState(query?.orderBy || 'popular')
   const [brand, setBrand] = useState(query?.brand)
   const [category, setCategory] = useState(query?.category)
   const [priceFrom, setPriceFrom] = useState(query?.priceFrom)
diff --git a/src/lib/product/components/ProductSearch.jsx b/src/lib/product/components/ProductSearch.jsx
index dc9796f2..9d59b305 100644
--- a/src/lib/product/components/ProductSearch.jsx
+++ b/src/lib/product/components/ProductSearch.jsx
@@ -23,8 +23,9 @@ const ProductSearch = ({ query, prefixUrl, defaultBrand = null }) => {
   const { page = 1 } = query
   const [q, setQ] = useState(query?.q || '*')
   const [limit, setLimit] = useState(query?.limit || 30)
+  const [orderBy, setOrderBy] = useState(router.query?.orderBy || 'popular')
   if (defaultBrand) query.brand = defaultBrand.toLowerCase()
-  const { productSearch } = useProductSearch({ query: { ...query, q, limit } })
+  const { productSearch } = useProductSearch({ query: { ...query, q, limit, orderBy } })
   const [products, setProducts] = useState(null)
   const [spellings, setSpellings] = useState(null)
   const [bannerPromotionHeader, setBannerPromotionHeader] = useState(null)
@@ -303,10 +304,9 @@ const ProductSearch = ({ query, prefixUrl, defaultBrand = null }) => {
                   <select
                     name='urutan'
                     className='form-input mt-2'
-                    value={router.query?.orderBy || ''}
+                    value={orderBy}
                     onChange={(e) => handleOrderBy(e)}
                   >
-                    <option value=''>Urutkan</option>
                     {orderOptions.map((option, index) => (
                       <option key={index} value={option.value}>
                         {' '}