diff options
Diffstat (limited to 'src/pages/_app.jsx')
| -rw-r--r-- | src/pages/_app.jsx | 87 |
1 files changed, 50 insertions, 37 deletions
diff --git a/src/pages/_app.jsx b/src/pages/_app.jsx index cda9e970..9f30752a 100644 --- a/src/pages/_app.jsx +++ b/src/pages/_app.jsx @@ -5,18 +5,29 @@ import { AnimatePresence, motion } 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 { 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' const queryClient = new QueryClient() -function MyApp({ Component, pageProps :{session, ...pageProps} }) { +export const AuthContext = createContext({ + authenticated : false, + setAuthenticated : (auth) => {} +}) + +function MyApp({ Component, pageProps: { session, ...pageProps } }) { const router = useRouter() const { isMobile } = useDevice() - console.log('ini session', session) const [animateLoader, setAnimateLoader] = useState(false) + const [authenticated, setAuthenticated] = useState(null) + const auth = getAuth() + + useEffect(() => { + setAuthenticated(auth) + }, [auth]) useEffect(() => { const handleRouteChangeStart = () => setAnimateLoader(true) @@ -49,41 +60,43 @@ function MyApp({ Component, pageProps :{session, ...pageProps} }) { }, [isMobile]) return ( - <SessionProvider session={session}> - <AnimatePresence> - {animateLoader && ( - <motion.div - initial={{ opacity: 0 }} - animate={{ opacity: 1 }} - exit={{ opacity: 0 }} - transition={{ - duration: 0.1 - }} - className='fixed w-screen h-screen z-[500] bg-white flex justify-center items-center' - > - <LogoSpinner /> - </motion.div> - )} - </AnimatePresence> - <Toaster - position='top-center' - containerStyle={toasterStyle} - toastOptions={{ - duration: 3000, - className: 'border border-gray_r-8' - }} - /> - <NextProgress color='#F01C21' options={{ showSpinner: false }} /> - <QueryClientProvider client={queryClient}> - <AnimatePresence - mode='popLayout' - initial={false} - onExitComplete={() => window.scrollTo(0, 0)} - > - {!animateLoader && <Component {...pageProps} key={router.asPath} />} + <AuthContext.Provider value={{authenticated, setAuthenticated}}> + <SessionProvider session={session}> + <AnimatePresence> + {animateLoader && ( + <motion.div + initial={{ opacity: 0 }} + animate={{ opacity: 1 }} + exit={{ opacity: 0 }} + transition={{ + duration: 0.1 + }} + className='fixed w-screen h-screen z-[500] bg-white flex justify-center items-center' + > + <LogoSpinner /> + </motion.div> + )} </AnimatePresence> - </QueryClientProvider> - </SessionProvider> + <Toaster + position='top-center' + containerStyle={toasterStyle} + toastOptions={{ + duration: 3000, + className: 'border border-gray_r-8' + }} + /> + <NextProgress color='#F01C21' options={{ showSpinner: false }} /> + <QueryClientProvider client={queryClient}> + <AnimatePresence + mode='popLayout' + initial={false} + onExitComplete={() => window.scrollTo(0, 0)} + > + {!animateLoader && <Component {...pageProps} key={router.asPath} />} + </AnimatePresence> + </QueryClientProvider> + </SessionProvider> + </AuthContext.Provider> ) } |
