Merge branch 'master' into development_tri/feedback_UAT

11 files changed, 89 insertions, 72 deletions

diff --git a/src/pages/_app.jsx b/src/pages/_app.jsx
index 634e631f..3c93d27f 100644
--- a/src/pages/_app.jsx
+++ b/src/pages/_app.jsx
@@ -1,11 +1,12 @@
 import '../styles/globals.css'
 import NextProgress from 'next-progress'
-import { useRouter } from 'next/router'
+import { useRouter, Router } from 'next/router'
 import { AnimatePresence } from 'framer-motion'
 import { Toaster } from 'react-hot-toast'
 import { QueryClient, QueryClientProvider } from 'react-query'
 import useDevice from '@/core/hooks/useDevice'
 import { useEffect, useState } from 'react'
+import LogoSpinner from '@/core/components/elements/Spinner/LogoSpinner'
 
 const queryClient = new QueryClient()
 
@@ -13,6 +14,18 @@ function MyApp({ Component, pageProps }) {
   const router = useRouter()
   const { isMobile } = useDevice()
 
+  const [animateLoader, setAnimateLoader] = useState(false)
+
+  useEffect(() => {
+    Router.events.on('routeChangeStart', () => setAnimateLoader(true))
+    Router.events.on('routeChangeComplete', () => setAnimateLoader(false))
+
+    return () => {
+      Router.events.off('routeChangeStart', () => setAnimateLoader(true))
+      Router.events.off('routeChangeComplete', () => setAnimateLoader(false))
+    }
+  }, [])
+
   const [toasterStyle, setToasterStyle] = useState({})
 
   useEffect(() => {
@@ -30,6 +43,11 @@ function MyApp({ Component, pageProps }) {
 
   return (
     <>
+      {animateLoader && (
+        <div className='w-screen h-screen z-[500] flex justify-center items-center backdrop-blur'>
+          <LogoSpinner />
+        </div>
+      )}
       <Toaster
         position='top-center'
         containerStyle={toasterStyle}
@@ -45,7 +63,7 @@ function MyApp({ Component, pageProps }) {
           initial={false}
           onExitComplete={() => window.scrollTo(0, 0)}
         >
-          <Component {...pageProps} key={router.asPath} />
+          {!animateLoader && <Component {...pageProps} key={router.asPath} />}
         </AnimatePresence>
       </QueryClientProvider>
     </>
diff --git a/src/pages/api/shop/search.js b/src/pages/api/shop/search.js
index ef070dcd..bab96237 100644
--- a/src/pages/api/shop/search.js
+++ b/src/pages/api/shop/search.js
@@ -15,19 +15,19 @@ export default async function handler(req, res) {
     limit = 30
   } = req.query
 
-  let paramOrderBy = ''
+  let paramOrderBy = 'product_rating_f DESC'
   switch (orderBy) {
     case 'price-asc':
-      paramOrderBy = ', price_discount_f ASC'
+      paramOrderBy += ', price_discount_f ASC'
       break
     case 'price-desc':
-      paramOrderBy = ', price_discount_f DESC'
+      paramOrderBy += ', price_discount_f DESC'
       break
     case 'popular':
-      paramOrderBy = ', search_rank_i DESC'
+      paramOrderBy += ', search_rank_i DESC'
       break
     case 'stock':
-      paramOrderBy = ', stock_total_f DESC'
+      paramOrderBy += ', stock_total_f DESC'
       break
   }
 
@@ -37,12 +37,13 @@ export default async function handler(req, res) {
     'facet.field=category_name',
     'facet=true',
     'indent=true',
-    `facet.query=${q}`,
+    `facet.query=${escapeSolrQuery(q)}`,
     `q.op=${operation}`,
     `q=${escapeSolrQuery(q)}`,
+    'qf=name_s',
     `start=${offset}`,
     `rows=${limit}`,
-    `sort=product_rating_f DESC ${paramOrderBy}`,
+    `sort=${paramOrderBy}`,
     `fq=price_discount_f:[${priceFrom == '' ? '*' : priceFrom} TO ${priceTo == '' ? '*' : priceTo}]`
   ]
 
@@ -68,9 +69,18 @@ export default async function handler(req, res) {
 }
 
 const escapeSolrQuery = (query) => {
-  const specialChars = /[\]\[{}()"\\]/g
-  const escapedQuery = query.replace(specialChars, '\\$&')
-  return escapedQuery
+  if (query == '*') return query
+
+  const specialChars = /([\+\-\!\(\)\{\}\[\]\^"~\*\?:\\\/])/g
+  const words = query.split(/\s+/)
+  const escapedWords = words.map((word) => {
+    if (specialChars.test(word)) {
+      return `"${word.replace(specialChars, '\\$1')}"`
+    }
+    return word
+  })
+
+  return escapedWords.join(' ')
 }
 
 const productResponseMap = (products) => {
diff --git a/src/pages/api/shop/suggest.js b/src/pages/api/shop/suggest.js
index 5a1b559a..83ab69d4 100644
--- a/src/pages/api/shop/suggest.js
+++ b/src/pages/api/shop/suggest.js
@@ -5,7 +5,7 @@ export default async function handler(req, res) {
 
   let result = await axios(
     process.env.SOLR_HOST +
-      `/solr/product/suggest?suggest=true&suggest.dictionary=mySuggester&suggest.q=${q}`
+      `/solr/product/suggest?suggest=true&suggest.dictionary=mySuggester&q=${q}`
   )
   try {
     res.status(200).json(result.data.suggest.mySuggester[q])
diff --git a/src/pages/forgot-password.jsx b/src/pages/forgot-password.jsx
index 6211d237..23239363 100644
--- a/src/pages/forgot-password.jsx
+++ b/src/pages/forgot-password.jsx
@@ -91,7 +91,11 @@ const FormComponent = () => {
           placeholder='Masukan alamat email'
           autoFocus
         />
-        <button type='submit' disabled={!email || isLoading} className='btn-yellow font-semibold mt-4 w-full'>
+        <button
+          type='submit'
+          disabled={!email || isLoading}
+          className='btn-yellow font-semibold mt-4 w-full'
+        >
           {isLoading ? 'Loading...' : 'Kirim Permintaan'}
         </button>
       </form>
diff --git a/src/pages/my/menu.jsx b/src/pages/my/menu.jsx
index 851bcf56..e7ae27fd 100644
--- a/src/pages/my/menu.jsx
+++ b/src/pages/my/menu.jsx
@@ -19,10 +19,7 @@ export default function Menu() {
   return (
     <IsAuth>
       <AppLayout title='Menu Utama'>
-        <Link
-          href='/my/profile'
-          className='p-4 flex items-center'
-        >
+        <Link href='/my/profile' className='p-4 flex items-center'>
           <div className='rounded-full p-3 bg-gray_r-6 text-gray_r-12/80'>
             <UserIcon className='w-5' />
           </div>
@@ -64,10 +61,7 @@ export default function Menu() {
               <LinkItem href='/my/address'>Daftar Alamat</LinkItem>
             </div>
 
-            <div
-              onClick={logout}
-              className='p-4 mt-2'
-            >
+            <div onClick={logout} className='p-4 mt-2'>
               <button className='w-full btn-red'>Keluar Akun</button>
             </div>
           </div>
@@ -78,19 +72,13 @@ export default function Menu() {
 }
 
 const MenuHeader = ({ children, ...props }) => (
-  <div
-    {...props}
-    className='font-medium px-4 flex'
-  >
+  <div {...props} className='font-medium px-4 flex'>
     {children}
   </div>
 )
 
 const LinkItem = ({ children, ...props }) => (
-  <Link
-    {...props}
-    className='!text-gray_r-12/70 !font-normal p-4 flex items-center'
-  >
+  <Link {...props} className='!text-gray_r-12/70 !font-normal p-4 flex items-center'>
     {children}
     <div className='ml-auto !text-gray_r-11'>
       <ChevronRightIcon className='w-5' />
diff --git a/src/pages/reset-password.jsx b/src/pages/reset-password.jsx
index a4aa2201..0bf6f31e 100644
--- a/src/pages/reset-password.jsx
+++ b/src/pages/reset-password.jsx
@@ -46,7 +46,7 @@ const FormComponent = () => {
   const checkValidPassword = () => {
     const passwordVal = password.current.value
     const retypePasswordVal = retypePassword.current.value
-    if (passwordVal == retypePasswordVal) {
+    if (passwordVal && passwordVal == retypePasswordVal) {
       setIsValidPassword(true)
     } else {
       setIsValidPassword(false)
@@ -56,7 +56,10 @@ const FormComponent = () => {
   const resetPasswordRequest = async (e) => {
     e.preventDefault()
     setIsLoading(true)
-    const result = await odooApi('POST', '/api/v1/user/reset-password', { token })
+    const result = await odooApi('POST', '/api/v1/user/reset-password', {
+      token,
+      password: password.current.value
+    })
     setIsLoading(false)
     password.current.value = ''
     retypePassword.current.value = ''
diff --git a/src/pages/shop/brands/[slug].jsx b/src/pages/shop/brands/[slug].jsx
index 9c5193ad..88f19bc0 100644
--- a/src/pages/shop/brands/[slug].jsx
+++ b/src/pages/shop/brands/[slug].jsx
@@ -11,7 +11,7 @@ const Brand = dynamic(() => import('@/lib/brand/components/Brand'))
 export default function BrandDetail() {
   const router = useRouter()
   const { slug = '' } = router.query
-  
+
   const brandName = getNameFromSlug(slug)
   return (
     <BasicLayout>
@@ -21,8 +21,7 @@ export default function BrandDetail() {
         additionalMetaTags={[
           {
             property: 'keywords',
-            content:
-              `Jual ${brandName}, beli ${brandName}, Distributor ${brandName} Indonesia, cari ${brandName}, produk ${brandName}, ${brandName} Indonesia, harga ${brandName}`
+            content: `Jual ${brandName}, beli ${brandName}, Distributor ${brandName} Indonesia, cari ${brandName}, produk ${brandName}, ${brandName} Indonesia, harga ${brandName}`
           }
         ]}
       />
diff --git a/src/pages/shop/checkout/[status].jsx b/src/pages/shop/checkout/[status].jsx
index 7c39718c..2c3bebcf 100644
--- a/src/pages/shop/checkout/[status].jsx
+++ b/src/pages/shop/checkout/[status].jsx
@@ -21,7 +21,7 @@ export default function Finish() {
   return (
     <>
       <Seo title='Checkout Indoteknik.com' />
-      
+
       <IsAuth>
         <BasicLayout>
           <FinishCheckoutComponent query={router.query || {}} />
diff --git a/src/pages/shop/quotation/finish.jsx b/src/pages/shop/quotation/finish.jsx
index f6c0ac6b..0e9c5672 100644
--- a/src/pages/shop/quotation/finish.jsx
+++ b/src/pages/shop/quotation/finish.jsx
@@ -12,37 +12,37 @@ export default function FinishQuotation() {
   const { id } = router.query
   return (
     <>
-    <Seo title='Quotation Indoteknik.com' />
-    
-    <IsAuth>
-      <BasicLayout>
-        <div className='mx-auto container'>
-          <div className='m-4 md:m-0 md:mt-10 px-4 py-6 shadow-md border border-gray_r-3'>
-            <div className='flex'>
-              <span className='p-3 mx-auto bg-warning-100 border border-warning-300 rounded'>
-                <EnvelopeIcon className='w-8 text-warning-800' />
-              </span>
-            </div>
-            <p className='h2 text-center mt-6'>Terima Kasih {auth?.name}</p>
-            <p className='text-center mt-3 leading-6 text-gray_r-11'>
-              Penawaran harga kamu di Indoteknik.com berhasil dikirimkan, tim kami akan segera
-              menghubungi anda.
-            </p>
-            {id && (
-              <Link
-                href={`/my/transaction/${id}`}
-                className='btn-yellow !text-gray_r-12 mt-6 w-full md:w-1/3 md:mx-auto'
-              >
-                Lihat Penawaran
+      <Seo title='Quotation Indoteknik.com' />
+
+      <IsAuth>
+        <BasicLayout>
+          <div className='mx-auto container'>
+            <div className='m-4 md:m-0 md:mt-10 px-4 py-6 shadow-md border border-gray_r-3'>
+              <div className='flex'>
+                <span className='p-3 mx-auto bg-warning-100 border border-warning-300 rounded'>
+                  <EnvelopeIcon className='w-8 text-warning-800' />
+                </span>
+              </div>
+              <p className='h2 text-center mt-6'>Terima Kasih {auth?.name}</p>
+              <p className='text-center mt-3 leading-6 text-gray_r-11'>
+                Penawaran harga kamu di Indoteknik.com berhasil dikirimkan, tim kami akan segera
+                menghubungi anda.
+              </p>
+              {id && (
+                <Link
+                  href={`/my/transaction/${id}`}
+                  className='btn-yellow !text-gray_r-12 mt-6 w-full md:w-1/3 md:mx-auto'
+                >
+                  Lihat Penawaran
+                </Link>
+              )}
+              <Link href='/' className='btn-light !text-gray_r-12 mt-2 w-full md:w-1/3 md:mx-auto'>
+                Ke Halaman Utama
               </Link>
-            )}
-            <Link href='/' className='btn-light !text-gray_r-12 mt-2 w-full md:w-1/3 md:mx-auto'>
-              Ke Halaman Utama
-            </Link>
+            </div>
           </div>
-        </div>
-      </BasicLayout>
-    </IsAuth>
+        </BasicLayout>
+      </IsAuth>
     </>
   )
 }
diff --git a/src/pages/shop/search.jsx b/src/pages/shop/search.jsx
index bf38d0bc..907465b7 100644
--- a/src/pages/shop/search.jsx
+++ b/src/pages/shop/search.jsx
@@ -13,12 +13,7 @@ export default function Search() {
     <BasicLayout>
       <Seo title={`Cari produk ${router.query.q || ''} di Indoteknik.com`} />
 
-      {!_.isEmpty(router.query) && (
-        <ProductSearch
-          query={router.query}
-          prefixUrl='/shop/search'
-        />
-      )}
+      {!_.isEmpty(router.query) && <ProductSearch query={router.query} prefixUrl='/shop/search' />}
     </BasicLayout>
   )
 }
diff --git a/src/pages/sitemap/products/[id].xml.js b/src/pages/sitemap/products/[id].xml.js
index e9caaa00..98c2bf40 100644
--- a/src/pages/sitemap/products/[id].xml.js
+++ b/src/pages/sitemap/products/[id].xml.js
@@ -8,7 +8,7 @@ export async function getServerSideProps({ res }) {
   const limit = 2500
   const query = { limit }
   const products = await productSearchApi({ query: _.toQuery(query) })
-  console.log(products);
+  console.log(products)
   // const sitemap = create('urlset', { encoding: 'UTF-8' })
 
   // const date = new Date()