From f90ec98c509fad7146c169d8d762b4c847d07af8 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Fri, 15 Sep 2023 09:15:54 +0700 Subject: Add product context provider --- src/contexts/ProductContext.js | 15 +++++++++++++++ src/pages/_app.jsx | 5 ++++- src/pages/shop/product/[slug].jsx | 13 +++++++++++-- 3 files changed, 30 insertions(+), 3 deletions(-) create mode 100644 src/contexts/ProductContext.js (limited to 'src') 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 ( + {children} + ) +} + +export const useProductContext = () => { + return useContext(ProductContext) +} 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 && } + + {!animateLoader && } + 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 -- cgit v1.2.3 From e5c08cb213d0c6dbfa5a931e03eeccac518ddba1 Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Fri, 15 Sep 2023 09:32:12 +0700 Subject: change get product odoo to solr di page navbar & basiclayout & bugfix redirect login next page null --- .../components/elements/Navbar/NavbarDesktop.jsx | 37 +++++++++++----------- src/core/components/layouts/BasicLayout.jsx | 17 ++++++++++ src/core/utils/whatsappUrl.js | 5 +-- 3 files changed, 38 insertions(+), 21 deletions(-) (limited to 'src') 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' -- cgit v1.2.3