diff options
Diffstat (limited to 'src/lib/auth')
| -rw-r--r-- | src/lib/auth/components/LoginDesktop.jsx | 82 | ||||
| -rw-r--r-- | src/lib/auth/components/LoginMobile.jsx | 99 |
2 files changed, 109 insertions, 72 deletions
diff --git a/src/lib/auth/components/LoginDesktop.jsx b/src/lib/auth/components/LoginDesktop.jsx index d22da6f8..1333db14 100644 --- a/src/lib/auth/components/LoginDesktop.jsx +++ b/src/lib/auth/components/LoginDesktop.jsx @@ -1,46 +1,54 @@ -import DesktopView from '@/core/components/views/DesktopView' -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 Image from 'next/image' -import { useRouter } from 'next/router' -import { useContext, useEffect, useState } from 'react' -import { getAuth, setAuth } from '@/core/utils/auth' -import { setCookie } from 'cookies-next' -import BottomPopup from '@/core/components/elements/Popup/BottomPopup' -import Spinner from '@/core/components/elements/Spinner/Spinner' -import LogoSpinner from '@/core/components/elements/Spinner/LogoSpinner' -import odooApi from '@/core/api/odooApi' +import DesktopView from '@/core/components/views/DesktopView'; +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 { useRouter } from 'next/router'; +import { useEffect, useState } from 'react'; +import BottomPopup from '@/core/components/elements/Popup/BottomPopup'; +import LogoSpinner from '@/core/components/elements/Spinner/LogoSpinner'; const LoginDesktop = () => { - const { handleSubmit, handleChangeInput, isLoading, isValid, alert, emailRef, passwordRef, handleGoogleSubmit } = - useLogin() + const { + handleSubmit, + handleChangeInput, + isLoading, + isValid, + alert, + emailRef, + passwordRef, + handleGoogleSubmit, + } = useLogin(); - const router = useRouter() - const [query, setQuery] = useState(router?.query?.next || '/') - const { data: session } = useSession() + const router = useRouter(); + const [query, setQuery] = useState(router?.query?.next || '/'); + const { data: session } = useSession(); const handleGoogle = async () => { - const url = query != '/' ? '/login?source=google&next=' + query : '/login?source=google' - await signIn('google', { callbackUrl: url }) - } + const url = + query != '/' + ? '/login?source=google&next=' + query + : '/login?source=google'; + await signIn('google', { callbackUrl: url }); + }; useEffect(() => { if (session) { - handleGoogleSubmit(session) + handleGoogleSubmit(session); } - }, [session]) + }, [session]); if (router.query.source) { return ( <BottomPopup active={true} close=''> - <div className='leading-7 text-gray_r-12/80 flex justify-center'>Mohon Tunggu</div> + <div className='leading-7 text-gray_r-12/80 flex justify-center'> + Mohon Tunggu + </div> <div className='container flex justify-center my-4'> <LogoSpinner width={48} height={48} /> </div> </BottomPopup> - ) + ); } return ( @@ -48,7 +56,9 @@ const LoginDesktop = () => { <div className='container mx-auto'> <div className='grid grid-cols-2 gap-x-10 pt-16'> <div> - <h1 className='text-2xl font-semibold'>Selamat Datang di Indoteknik</h1> + <h1 className='text-2xl font-semibold'> + Selamat Datang di Indoteknik + </h1> <h2 className='text-gray_r-11 font-normal mt-1 mb-4'> Masuk ke akun kamu untuk mulai transaksi! </h2> @@ -59,7 +69,10 @@ const LoginDesktop = () => { </Alert> )} - <form className='w-full mt-6 flex flex-col gap-y-4' onSubmit={handleSubmit}> + <form + className='w-full mt-6 flex flex-col gap-y-4' + onSubmit={handleSubmit} + > <div> <label htmlFor='email'>Alamat Email</label> <input @@ -118,7 +131,10 @@ const LoginDesktop = () => { <div className='text-gray_r-11 mt-10'> Belum punya akun Indoteknik?{' '} - <Link href='/register' className='inline'> + <Link + href={`/register?${new URLSearchParams(router.query)}`} + className='inline' + > Daftar akun baru </Link> </div> @@ -129,7 +145,7 @@ const LoginDesktop = () => { </div> </div> </DesktopView> - ) -} + ); +}; -export default LoginDesktop +export default LoginDesktop; diff --git a/src/lib/auth/components/LoginMobile.jsx b/src/lib/auth/components/LoginMobile.jsx index 6e1831d4..58ae4e6e 100644 --- a/src/lib/auth/components/LoginMobile.jsx +++ b/src/lib/auth/components/LoginMobile.jsx @@ -1,19 +1,17 @@ -import Image from 'next/image' -import IndoteknikLogo from '@/images/logo.png' -import Link from '@/core/components/elements/Link/Link' -import Alert from '@/core/components/elements/Alert/Alert' -import MobileView from '@/core/components/views/MobileView' -import useLogin from '../hooks/useLogin' +import Image from 'next/image'; +import IndoteknikLogo from '@/images/logo.png'; +import Link from '@/core/components/elements/Link/Link'; +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 { useEffect, useState } from 'react' -import { setCookie } from 'cookies-next' -import BottomPopup from '@/core/components/elements/Popup/BottomPopup' -import LogoSpinner from '@/core/components/elements/Spinner/LogoSpinner' -import odooApi from '@/core/api/odooApi' -import { getAuth } from '@/core/utils/auth' -import PageContent from '@/lib/content/components/PageContent' +import { useSession, signIn, SignOut } from 'next-auth/react'; +import { useRouter } from 'next/router'; +import { useEffect, useState } from 'react'; +import BottomPopup from '@/core/components/elements/Popup/BottomPopup'; +import LogoSpinner from '@/core/components/elements/Spinner/LogoSpinner'; +import { getAuth } from '@/core/utils/auth'; +import PageContent from '@/lib/content/components/PageContent'; const LoginMobile = () => { const { @@ -24,43 +22,55 @@ const LoginMobile = () => { alert, emailRef, passwordRef, - handleGoogleSubmit - } = useLogin() + handleGoogleSubmit, + } = useLogin(); - const router = useRouter() - const [query, setQuery] = useState(router?.query?.next || '/') - const { data: session } = useSession() - const auth = getAuth() + const router = useRouter(); + const [query, setQuery] = useState(router?.query?.next || '/'); + const { data: session } = useSession(); + const auth = getAuth(); const handleGoogle = async () => { - const url = query != '/' ? '/login?source=google&next=' + query : '/login?source=google' - await signIn('google', { callbackUrl: url }) - } + const url = + query != '/' + ? '/login?source=google&next=' + query + : '/login?source=google'; + await signIn('google', { callbackUrl: url }); + }; useEffect(() => { if (session) { - handleGoogleSubmit(session) + handleGoogleSubmit(session); } - }, [session]) + }, [session]); if (router.query.source) { return ( <BottomPopup active={true} close={true}> - <div className='leading-7 text-gray_r-12/80 flex justify-center'>Mohon Tunggu</div> + <div className='leading-7 text-gray_r-12/80 flex justify-center'> + Mohon Tunggu + </div> <div className='container flex justify-center my-4'> <LogoSpinner width={48} height={48} /> </div> </BottomPopup> - ) + ); } return ( <MobileView> <div className='p-6 pt-10 flex flex-col items-center min-h-screen'> <Link href='/'> - <Image src={IndoteknikLogo} alt='Logo Indoteknik' width={150} height={50} /> + <Image + src={IndoteknikLogo} + alt='Logo Indoteknik' + width={150} + height={50} + /> </Link> <h1 className='text-2xl mt-4 font-semibold'>Mulai Belanja Sekarang</h1> - <h2 className='text-gray_r-11 font-normal mt-1 mb-4'>Masuk ke akun kamu untuk belanja</h2> + <h2 className='text-gray_r-11 font-normal mt-1 mb-4'> + Masuk ke akun kamu untuk belanja + </h2> {alert && ( <Alert className='text-center' type={alert.type}> @@ -68,7 +78,10 @@ const LoginMobile = () => { </Alert> )} - <form className='w-full mt-6 flex flex-col gap-y-4' onSubmit={handleSubmit}> + <form + className='w-full mt-6 flex flex-col gap-y-4' + onSubmit={handleSubmit} + > <div> <label htmlFor='email'>Alamat Email</label> <input @@ -96,7 +109,11 @@ const LoginMobile = () => { placeholder='••••••••••••' /> </div> - <button type='submit' className='btn-yellow w-full mt-2' disabled={!isValid || isLoading}> + <button + type='submit' + className='btn-yellow w-full mt-2' + disabled={!isValid || isLoading} + > {!isLoading ? 'Masuk' : 'Loading...'} </button> </form> @@ -123,16 +140,20 @@ const LoginMobile = () => { <div className='text-gray_r-11 mt-4'> Belum punya akun Indoteknik?{' '} - <Link href='/register' className='inline'> + <Link + href={`/register?${new URLSearchParams(router.query)}`} + className='inline' + > Daftar </Link> </div> - {/* <div className='mt-5'> - <PageContent path='/login' /> - </div> */} + + <section className='my-10 md:my-0'> + <PageContent path='/register' /> + </section> </div> </MobileView> - ) -} + ); +}; -export default LoginMobile +export default LoginMobile; |