3 files changed, 83 insertions, 39 deletions
diff --git a/src/pages/_app.jsx b/src/pages/_app.jsx
index 03147219..7f23b94b 100644
--- a/src/pages/_app.jsx
+++ b/src/pages/_app.jsx
@@ -6,16 +6,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 }) {
+export const AuthContext = createContext({
+  authenticated : false,
+  setAuthenticated : (auth) => {}
+})
+
+function MyApp({ Component, pageProps: { session, ...pageProps } }) {
   const router = useRouter()
   const { isMobile } = useDevice()
 
   const [animateLoader, setAnimateLoader] = useState(false)
+  const [authenticated, setAuthenticated] = useState(null)
+  const auth = getAuth()
+
+  // useEffect(() => {
+  //   setAuthenticated(auth)
+  // }, [auth])
 
   useEffect(() => {
     const handleRouteChangeStart = () => setAnimateLoader(true)
@@ -48,41 +61,43 @@ function MyApp({ Component, pageProps }) {
   }, [isMobile])
 
   return (
-    <>
-      <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>
-    </>
+        <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>
   )
 }
 
diff --git a/src/pages/api/auth/[...nextauth].js b/src/pages/api/auth/[...nextauth].js
new file mode 100644
index 00000000..3c433167
--- /dev/null
+++ b/src/pages/api/auth/[...nextauth].js
@@ -0,0 +1,26 @@
+import odooApi from '@/core/api/odooApi'
+import NextAuth from 'next-auth/next'
+import GoogleProvider from 'next-auth/providers/google'
+
+export default NextAuth({
+  providers: [
+    GoogleProvider({
+      clientId: process.env.GOOGLE_CLIENT_ID,
+      clientSecret: process.env.GOOGLE_CLIENT_SECRET
+    })
+  ],
+  callbacks: {
+    async jwt({ token, account }) {
+      if (account) {
+        token.accessToken = account.access_token
+      }
+      return token
+    },
+    async session({ session, token, user }) {
+      session.accessToken = token.accessToken
+     
+      return session
+    }
+  },
+  secret: process.env.JWT_SECRET
+})
diff --git a/src/pages/my/menu.jsx b/src/pages/my/menu.jsx
index c8e1e7e9..fb8e6b03 100644
--- a/src/pages/my/menu.jsx
+++ b/src/pages/my/menu.jsx
@@ -5,15 +5,18 @@ import useAuth from '@/core/hooks/useAuth'
 import { deleteAuth } from '@/core/utils/auth'
 import IsAuth from '@/lib/auth/components/IsAuth'
 import { ChevronRightIcon, UserIcon } from '@heroicons/react/24/solid'
+import { signOut, useSession } from 'next-auth/react'
 import { useRouter } from 'next/router'
 
 export default function Menu() {
   const auth = useAuth()
   const router = useRouter()
+  const { data: session } = useSession()
 
   const logout = () => {
-    deleteAuth()
-    router.push('/login')
+    deleteAuth().then(() => {
+      router.push('/login')
+    })
   }
 
   return (
@@ -62,7 +65,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>