Merged in CR/migrasi_product_detail_to_solr (pull request #68)

CR/migrasi product detail to solr

6 files changed, 68 insertions, 24 deletions

diff --git a/src/contexts/ProductContext.js b/src/contexts/ProductContext.js
new file mode 100644
index 00000000..7bf65989
--- /dev/null
+++ b/src/contexts/ProductContext.js
@@ -0,0 +1,15 @@
+import { createContext, useContext, useState } from 'react'
+
+const ProductContext = createContext()
+
+export const ProductProvider = ({ children }) => {
+  const [product, setProduct] = useState(null)
+
+  return (
+    <ProductContext.Provider value={{ product, setProduct }}>{children}</ProductContext.Provider>
+  )
+}
+
+export const useProductContext = () => {
+  return useContext(ProductContext)
+}
diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx
index 655c4732..2e4b25fc 100644
--- a/src/core/components/elements/Navbar/NavbarDesktop.jsx
+++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx
@@ -22,6 +22,7 @@ import productApi from '@/lib/product/api/productApi'
 import { useSession } from 'next-auth/react'
 import { AuthContext } from '@/pages/_app'
 import { TopBannerSkeleton } from '../Skeleton/TopBannerSkeleton'
+import { useProductContext } from '@/contexts/ProductContext'
 
 const Search = dynamic(() => import('./Search'))
 const TopBanner = dynamic(() => import('./TopBanner'), {
@@ -30,7 +31,7 @@ const TopBanner = dynamic(() => import('./TopBanner'), {
 
 const NavbarDesktop = () => {
   const [isOpenCategory, setIsOpenCategory] = useState(false)
-  const {authenticated} = useContext(AuthContext)
+  const { authenticated } = useContext(AuthContext)
   const auth = useAuth()
 
   const [cartCount, setCartCount] = useState(0)
@@ -40,7 +41,22 @@ const NavbarDesktop = () => {
   const [urlPath, setUrlPath] = useState(null)
 
   const router = useRouter()
-  
+
+  const { product } = useProductContext()
+
+  useEffect(() => {
+    if (router.pathname === '/shop/product/[slug]') {
+      setPayloadWa({
+        name: product?.name,
+        manufacture: product?.manufacture.name,
+        url: createSlug('/shop/product/', product?.name, product?.id, true)
+      })
+      setTemplateWA('product')
+
+      setUrlPath(router.asPath)
+    }
+  }, [product, router])
+
   useEffect(() => {
     const handleCartChange = () => {
       const cart = async () => {
@@ -52,23 +68,6 @@ const NavbarDesktop = () => {
     handleCartChange()
 
     window.addEventListener('localStorageChange', handleCartChange)
-    if (router.pathname === '/shop/product/[slug]') {
-      const authToken = getAuth().token
-
-      const { slug } = router.query
-      const getProduct = async () => {
-        let product = await productApi({ id: getIdFromSlug(slug), headers: { Token: authToken } })
-        setPayloadWa({
-          name: product[0]?.name,
-          manufacture: product[0]?.manufacture.name,
-          url: createSlug('/shop/product/', product[0]?.name, product[0]?.id, true)
-        })
-      }
-      getProduct()
-      setTemplateWA('product')
-
-      setUrlPath(router.asPath)
-    }
 
     return () => {
       window.removeEventListener('localStorageChange', handleCartChange)
diff --git a/src/core/components/layouts/BasicLayout.jsx b/src/core/components/layouts/BasicLayout.jsx
index 266223d8..030f916c 100644
--- a/src/core/components/layouts/BasicLayout.jsx
+++ b/src/core/components/layouts/BasicLayout.jsx
@@ -11,6 +11,7 @@ import { getAuth, setAuth } from '@/core/utils/auth'
 import { createSlug, getIdFromSlug } from '@/core/utils/slug'
 import { useSession } from 'next-auth/react'
 import { setCookie } from 'cookies-next'
+import { useProductContext } from '@/contexts/ProductContext'
 
 const Navbar = dynamic(() => import('../elements/Navbar/Navbar'))
 const AnimationLayout = dynamic(() => import('./AnimationLayout'))
@@ -22,6 +23,22 @@ const BasicLayout = ({ children }) => {
 
   const router = useRouter()
 
+  const { product } = useProductContext()
+
+  useEffect(() => {
+    if (router.pathname === '/shop/product/[slug]') {
+      setPayloadWa({
+        name: product?.name,
+        manufacture: product?.manufacture.name,
+        url: createSlug('/shop/product/', product?.name, product?.id, true)
+      })
+      setTemplateWA('product')
+
+      setUrlPath(router.asPath)
+    }
+  }, [product, router])
+
+
   useEffect(() => {
     const getIP = async () => {
       const ip = await odooApi('GET', '/api/ip-address')
diff --git a/src/core/utils/whatsappUrl.js b/src/core/utils/whatsappUrl.js
index 6c354924..9a92f424 100644
--- a/src/core/utils/whatsappUrl.js
+++ b/src/core/utils/whatsappUrl.js
@@ -1,9 +1,10 @@
 import { getAuth } from "./auth"
 
-const whatsappUrl = (template = 'default', payload, urlPath = '') => {
+const whatsappUrl = (template = 'default', payload, urlPath = null) => {
   let user = getAuth()
   if(!user){
-    return `/login?next=${urlPath}`
+    if(urlPath)  return `/login?next=${urlPath}`
+    if(!urlPath) return '/login'
   }
   let parentName = user.parentName ||  '-'
   let url = 'https://wa.me/628128080622'
diff --git a/src/pages/_app.jsx b/src/pages/_app.jsx
index 7f23b94b..ef737794 100644
--- a/src/pages/_app.jsx
+++ b/src/pages/_app.jsx
@@ -10,6 +10,7 @@ import { createContext, useContext, useEffect, useState } from 'react'
 import LogoSpinner from '@/core/components/elements/Spinner/LogoSpinner'
 import { SessionProvider } from 'next-auth/react'
 import { getAuth } from '@/core/utils/auth'
+import { ProductProvider } from '@/contexts/ProductContext'
 
 const queryClient = new QueryClient()
 
@@ -93,7 +94,9 @@ function MyApp({ Component, pageProps: { session, ...pageProps } }) {
             initial={false}
             onExitComplete={() => window.scrollTo(0, 0)}
           >
-            {!animateLoader && <Component {...pageProps} key={router.asPath} />}
+            <ProductProvider>
+              {!animateLoader && <Component {...pageProps} key={router.asPath} />}
+            </ProductProvider>
           </AnimatePresence>
         </QueryClientProvider>
       </SessionProvider>
diff --git a/src/pages/shop/product/[slug].jsx b/src/pages/shop/product/[slug].jsx
index af20413f..534aa8da 100644
--- a/src/pages/shop/product/[slug].jsx
+++ b/src/pages/shop/product/[slug].jsx
@@ -7,6 +7,8 @@ import dynamic from 'next/dynamic'
 import { useRouter } from 'next/router'
 import cookie from 'cookie'
 import axios from 'axios'
+import { useProductContext } from '@/contexts/ProductContext'
+import { useEffect } from 'react'
 
 const BasicLayout = dynamic(() => import('@/core/components/layouts/BasicLayout'))
 const Product = dynamic(() => import('@/lib/product/components/Product/Product'))
@@ -19,7 +21,7 @@ export async function getServerSideProps(context) {
   const authToken = auth?.token || ''
 
   let response = await axios(
-    `${process.env.NEXT_PUBLIC_SELF_HOST}/api/shop/product-detail?id=`+getIdFromSlug(slug)
+    `${process.env.NEXT_PUBLIC_SELF_HOST}/api/shop/product-detail?id=` + getIdFromSlug(slug)
   )
   let product = response.data
   // let productSolr = await productApi({ id: getIdFromSlug(slug), headers: { Token: authToken } })
@@ -41,8 +43,15 @@ export async function getServerSideProps(context) {
   }
 }
 
-export default function ProductDetail({ product}) {
+export default function ProductDetail({ product }) {
   const router = useRouter()
+  const { setProduct } = useProductContext()
+
+  useEffect(() => {
+    if (product) {
+      setProduct(product)
+    }
+  }, [product, setProduct])
 
   if (!product) return <PageNotFound />