summaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/core/components/elements/Navbar/NavbarDesktop.jsx5
-rw-r--r--src/core/components/elements/Navbar/NavbarUserDropdown.jsx8
-rw-r--r--src/core/components/layouts/BasicLayout.jsx93
-rw-r--r--src/core/utils/auth.js4
-rw-r--r--src/lib/auth/components/LoginDesktop.jsx66
-rw-r--r--src/lib/auth/components/LoginMobile.jsx32
-rw-r--r--src/pages/api/auth/[...nextauth].js13
-rw-r--r--src/pages/my/menu.jsx4
8 files changed, 167 insertions, 58 deletions
diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx
index ea4b03ae..c6575831 100644
--- a/src/core/components/elements/Navbar/NavbarDesktop.jsx
+++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx
@@ -17,9 +17,10 @@ import { getCountCart } from '@/core/utils/cart'
import TopBanner from './TopBanner'
import whatsappUrl from '@/core/utils/whatsappUrl'
import { useRouter } from 'next/router'
-import { getAuth } from '@/core/utils/auth'
+import { getAuth, setAuth } from '@/core/utils/auth'
import { createSlug, getIdFromSlug } from '@/core/utils/slug'
import productApi from '@/lib/product/api/productApi'
+import { useSession } from 'next-auth/react'
const Search = dynamic(() => import('./Search'))
@@ -33,7 +34,7 @@ const NavbarDesktop = () => {
const [payloadWA, setPayloadWa] = useState(null)
const router = useRouter()
-
+
useEffect(() => {
const handleCartChange = () => {
const cart = async () => {
diff --git a/src/core/components/elements/Navbar/NavbarUserDropdown.jsx b/src/core/components/elements/Navbar/NavbarUserDropdown.jsx
index 7848124c..b58be493 100644
--- a/src/core/components/elements/Navbar/NavbarUserDropdown.jsx
+++ b/src/core/components/elements/Navbar/NavbarUserDropdown.jsx
@@ -1,13 +1,15 @@
import { deleteAuth } from '@/core/utils/auth'
import Link from '../Link/Link'
import { useRouter } from 'next/router'
+import { signOut, useSession } from 'next-auth/react'
const NavbarUserDropdown = () => {
const router = useRouter()
- const logout = () => {
- deleteAuth()
- router.push('/login')
+ const logout = async () => {
+ deleteAuth().then(() => {
+ router.push('/login')
+ })
}
return (
diff --git a/src/core/components/layouts/BasicLayout.jsx b/src/core/components/layouts/BasicLayout.jsx
index 073303fe..e8f6434b 100644
--- a/src/core/components/layouts/BasicLayout.jsx
+++ b/src/core/components/layouts/BasicLayout.jsx
@@ -6,10 +6,11 @@ import { useEffect, useState } from 'react'
import axios from 'axios'
import odooApi from '@/core/api/odooApi'
import { useRouter } from 'next/router'
-import { getURL } from 'next/dist/shared/lib/utils'
import productApi from '@/lib/product/api/productApi'
-import { getAuth } from '@/core/utils/auth'
+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'
const Navbar = dynamic(() => import('../elements/Navbar/Navbar'))
const AnimationLayout = dynamic(() => import('./AnimationLayout'))
@@ -17,10 +18,26 @@ const AnimationLayout = dynamic(() => import('./AnimationLayout'))
const BasicLayout = ({ children }) => {
const [templateWA, setTemplateWA] = useState(null)
const [payloadWA, setPayloadWa] = useState(null)
+ const [isLoading, setIsloading] = useState(false)
const router = useRouter()
+ const { data: session } = useSession()
+ const auth = getAuth()
+ const setting = async () => {
+ if (!auth && session) {
+ setCookie('auth', JSON.stringify(session?.odooUser))
+ setIsloading(false)
+ }
+ }
+
+ useEffect(() => {
+ setting()
+ }, [session])
useEffect(() => {
+ setting()
+ console.log('ini session', session)
+ console.log('ini auth', getAuth())
const getIP = async () => {
const ip = await odooApi('GET', '/api/ip-address')
const data = {
@@ -46,42 +63,46 @@ const BasicLayout = ({ children }) => {
}
getProduct()
setTemplateWA('product')
-
}
}, [])
- return (
- <>
- <Navbar />
- <AnimationLayout>
- {children}
- <div className='fixed bottom-4 right-4 sm:bottom-14 sm:right-10 z-50'>
- <a
- href={whatsappUrl(templateWA, payloadWA)}
- className='py-2 pl-3 pr-4 rounded-full bg-[#4FB84A] border border-green-300 flex items-center'
- rel='noopener noreferrer'
- target='_blank'
- >
- <Image
- src='/images/socials/WHATSAPP.svg'
- alt='Whatsapp'
- className='block sm:hidden'
- width={36}
- height={36}
- />
- <Image
- src='/images/socials/WHATSAPP.svg'
- alt='Whatsapp'
- className='hidden sm:block'
- width={44}
- height={44}
- />
- <span className='text-white font-bold ml-1.5'>Whatsapp</span>
- </a>
- </div>
- </AnimationLayout>
- <BasicFooter />
- </>
- )
+ if(isLoading){
+
+ }else{
+ return (
+ <>
+ <Navbar />
+ <AnimationLayout>
+ {children}
+ <div className='fixed bottom-4 right-4 sm:bottom-14 sm:right-10 z-50'>
+ <a
+ href={whatsappUrl(templateWA, payloadWA)}
+ className='py-2 pl-3 pr-4 rounded-full bg-[#4FB84A] border border-green-300 flex items-center'
+ rel='noopener noreferrer'
+ target='_blank'
+ >
+ <Image
+ src='/images/socials/WHATSAPP.svg'
+ alt='Whatsapp'
+ className='block sm:hidden'
+ width={36}
+ height={36}
+ />
+ <Image
+ src='/images/socials/WHATSAPP.svg'
+ alt='Whatsapp'
+ className='hidden sm:block'
+ width={44}
+ height={44}
+ />
+ <span className='text-white font-bold ml-1.5'>Whatsapp</span>
+ </a>
+ </div>
+ </AnimationLayout>
+ <BasicFooter />
+ </>
+ )
+ }
+
}
export default BasicLayout
diff --git a/src/core/utils/auth.js b/src/core/utils/auth.js
index cddff2b8..03b20ae2 100644
--- a/src/core/utils/auth.js
+++ b/src/core/utils/auth.js
@@ -1,4 +1,5 @@
import { deleteCookie, getCookie, setCookie } from 'cookies-next'
+import { signOut } from 'next-auth/react'
/**
* Retrieves authentication data from cookie and returns it as an object.
@@ -27,7 +28,8 @@ const setAuth = (user) => {
*
* @returns {boolean} - Returns `true`.
*/
-const deleteAuth = () => {
+const deleteAuth = async() => {
+ await signOut()
deleteCookie('auth')
return true
}
diff --git a/src/lib/auth/components/LoginDesktop.jsx b/src/lib/auth/components/LoginDesktop.jsx
index f5aa0018..e3bff492 100644
--- a/src/lib/auth/components/LoginDesktop.jsx
+++ b/src/lib/auth/components/LoginDesktop.jsx
@@ -3,15 +3,50 @@ import useLogin from '../hooks/useLogin'
import Link from '@/core/components/elements/Link/Link'
import PageContent from '@/lib/content/components/PageContent'
import Alert from '@/core/components/elements/Alert/Alert'
-import {useSession, signIn, SignOut} from 'next-auth/react'
+import { useSession, signIn, SignOut } from 'next-auth/react'
+import Image from 'next/image'
+import { useRouter } from 'next/router'
+import { useEffect, useState } from 'react'
+import Spinner from '@/core/components/elements/Spinner/Spinner'
const LoginDesktop = () => {
const { handleSubmit, handleChangeInput, isLoading, isValid, alert, emailRef, passwordRef } =
useLogin()
- const { data } = useSession()
- console.log('ini google', data)
+ const router = useRouter()
+ const [query, setQuery] = useState(router?.query?.next || '/')
+ const { data: session } = useSession()
+ const [googleLoading, setGoogleloading] = useState(true)
+ useEffect(() => {
+ // Simulate loading for 2 seconds
+ const delay = setTimeout(() => {
+ setGoogleloading(false);
+ }, 3000);
+
+ return () => {
+ clearTimeout(delay); // Clear the timeout if the component unmounts
+ };
+ }, []);
+
+
+ const handleGoogle = async () => {
+ await signIn('google', { callbackUrl: '/login' })
+ }
+
+ useEffect(() => {
+ if (session) {
+ router.push(query)
+ }
+ }, [session, query])
+
+ if (googleLoading) {
+ return (
+ <div className='flex justify-center my-6'>
+ <Spinner className='w-6 text-gray_r-12/50 fill-gray_r-12' />
+ </div>
+ )
+ }
return (
<DesktopView>
<div className='container mx-auto'>
@@ -64,13 +99,26 @@ const LoginDesktop = () => {
{!isLoading ? 'Masuk' : 'Loading...'}
</button>
</form>
+ <div className='flex items-center mt-3 mb-3'>
+ <hr className='flex-1' />
+ <p className='text-gray-400'>ATAU</p>
+ <hr className='flex-1' />
+ </div>
+
<button
- type='submit'
- className='border border-gray-500 p-3 rounded-md hover:bg-gray-100 w-full mt-2'
- onClick={() => signIn('google')}
- >
- Masuk dengan Google
- </button>
+ type='submit'
+ className='border border-gray-500 p-2 rounded-md hover:bg-gray-100 w-full mt-2 flex items-center justify-center gap-x-2'
+ onClick={() => handleGoogle()}
+ >
+ <Image
+ src='/images/icons8-google.svg'
+ alt='google image'
+ className='h-7 w-7'
+ width={10}
+ height={10}
+ />
+ <p>Masuk dengan Google</p>
+ </button>
<div className='text-gray_r-11 mt-10'>
Belum punya akun Indoteknik?{' '}
diff --git a/src/lib/auth/components/LoginMobile.jsx b/src/lib/auth/components/LoginMobile.jsx
index b365330b..c5177625 100644
--- a/src/lib/auth/components/LoginMobile.jsx
+++ b/src/lib/auth/components/LoginMobile.jsx
@@ -5,10 +5,22 @@ import Alert from '@/core/components/elements/Alert/Alert'
import MobileView from '@/core/components/views/MobileView'
import useLogin from '../hooks/useLogin'
+import { useSession, signIn, SignOut } from 'next-auth/react'
+import { useRouter } from 'next/router'
+import { useState } from 'react'
+
const LoginMobile = () => {
const { handleSubmit, handleChangeInput, isLoading, isValid, alert, emailRef, passwordRef } =
useLogin()
+ const router = useRouter()
+ const [query, setQuery] = useState(router?.query?.next || '/')
+ const { data: session } = useSession()
+
+ if (session) {
+ router.push(query)
+ }
+
return (
<MobileView>
<div className='p-6 pt-10 flex flex-col items-center min-h-screen'>
@@ -56,6 +68,26 @@ const LoginMobile = () => {
{!isLoading ? 'Masuk' : 'Loading...'}
</button>
</form>
+ <div className='flex items-center mt-3 mb-3'>
+ <hr className='flex-1' />
+ <p className='text-gray-400'>ATAU</p>
+ <hr className='flex-1' />
+ </div>
+
+ <button
+ type='submit'
+ className='border border-gray-500 p-2 rounded-md hover:bg-gray-100 w-full mt-2 flex items-center justify-center gap-x-2'
+ onClick={() => signIn('google', { callbackUrl: '/login' })}
+ >
+ <Image
+ src='/images/icons8-google.svg'
+ alt='google image'
+ className='h-7 w-7'
+ width={10}
+ height={10}
+ />
+ <p>Masuk dengan Google</p>
+ </button>
<div className='text-gray_r-11 mt-4'>
Belum punya akun Indoteknik?{' '}
diff --git a/src/pages/api/auth/[...nextauth].js b/src/pages/api/auth/[...nextauth].js
index 6cc8a101..b11ed097 100644
--- a/src/pages/api/auth/[...nextauth].js
+++ b/src/pages/api/auth/[...nextauth].js
@@ -1,3 +1,4 @@
+import odooApi from '@/core/api/odooApi'
import NextAuth from 'next-auth/next'
import GoogleProvider from 'next-auth/providers/google'
@@ -10,20 +11,20 @@ export default NextAuth({
],
callbacks: {
async jwt({ token, account }) {
- // Persist the OAuth access_token to the token right after signin
if (account) {
token.accessToken = account.access_token
}
return token
},
async session({ session, token, user }) {
- // Send properties to the client, like an access_token from a provider.
session.accessToken = token.accessToken
+ const params = {
+ access_token: session.accessToken
+ }
+ const data = await odooApi('POST', '/api/v1/user/validate-sso', params)
+ session.odooUser = data.user
return session
}
},
- secret:process.env.JWT_SECRET
- // pages:{
- // signIn: '/login',
- // }
+ secret: process.env.JWT_SECRET
})
diff --git a/src/pages/my/menu.jsx b/src/pages/my/menu.jsx
index c8e1e7e9..bd20e2eb 100644
--- a/src/pages/my/menu.jsx
+++ b/src/pages/my/menu.jsx
@@ -5,11 +5,13 @@ 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()
@@ -62,7 +64,7 @@ export default function Menu() {
<LinkItem href='/my/address'>Daftar Alamat</LinkItem>
</div>
- <div onClick={logout} className='p-4 mt-2'>
+ <div onClick={() => (logout, signOut)} className='p-4 mt-2'>
<button className='w-full btn-red'>Keluar Akun</button>
</div>
</div>