From 90710579ba1c12060877f6ec2d26103f9c31058d Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Mon, 23 Oct 2023 17:11:33 +0700
Subject: Refactor and migrate register page

---
 src/pages/register.jsx | 30 ++++++++----------------------
 1 file changed, 8 insertions(+), 22 deletions(-)

(limited to 'src')

diff --git a/src/pages/register.jsx b/src/pages/register.jsx
index a2fbbf94..f79d6a4e 100644
--- a/src/pages/register.jsx
+++ b/src/pages/register.jsx
@@ -1,25 +1,11 @@
-import Seo from '@/core/components/Seo'
-import SimpleFooter from '@/core/components/elements/Footer/SimpleFooter'
-import BasicLayout from '@/core/components/layouts/BasicLayout'
-import DesktopView from '@/core/components/views/DesktopView'
-import MobileView from '@/core/components/views/MobileView'
-import RegisterComponent from '@/lib/auth/components/Register'
+import Seo from '@/core/components/Seo';
+import SimpleFooter from '@/core/components/elements/Footer/SimpleFooter';
+import BasicLayout from '@/core/components/layouts/BasicLayout';
+import DesktopView from '@/core/components/views/DesktopView';
+import MobileView from '@/core/components/views/MobileView';
+import RegisterComponent from '@/lib/auth/components/Register';
+import RegisterPage from '~/pages/register';
 
 export default function Register() {
-  return (
-    <>
-      <Seo title='Register - Indoteknik.com' />
-
-      <DesktopView>
-        <BasicLayout>
-          <RegisterComponent />
-        </BasicLayout>
-      </DesktopView>
-
-      <MobileView>
-        <RegisterComponent />
-        <SimpleFooter />
-      </MobileView>
-    </>
-  )
+  return <RegisterPage />;
 }
-- 
cgit v1.2.3


From c82110f7d3a2f85de99045fde7b579e369f15b2c Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Sat, 28 Oct 2023 09:05:00 +0700
Subject: Update authentication feature

---
 src/lib/auth/hooks/useLogin.js | 101 +++++++++++++++++++++--------------------
 src/pages/login.jsx            |  17 ++++---
 src/pages/register.jsx         |   6 ---
 3 files changed, 62 insertions(+), 62 deletions(-)

(limited to 'src')

diff --git a/src/lib/auth/hooks/useLogin.js b/src/lib/auth/hooks/useLogin.js
index 17731a86..dc9580ea 100644
--- a/src/lib/auth/hooks/useLogin.js
+++ b/src/lib/auth/hooks/useLogin.js
@@ -1,80 +1,83 @@
-import Link from '@/core/components/elements/Link/Link'
-import { setAuth } from '@/core/utils/auth'
-import { useRouter } from 'next/router'
-import { useRef, useState } from 'react'
-import loginApi from '../api/loginApi'
-import odooApi from '@/core/api/odooApi'
-import { setCookie } from 'cookies-next'
-import { useSession } from 'next-auth/react'
+import Link from '@/core/components/elements/Link/Link';
+import { setAuth } from '@/core/utils/auth';
+import { useRouter } from 'next/router';
+import { useRef, useState } from 'react';
+import loginApi from '../api/loginApi';
+import odooApi from '@/core/api/odooApi';
+import { setCookie } from 'cookies-next';
+import { useSession } from 'next-auth/react';
 
 const useLogin = () => {
-  const router = useRouter()
-  const [isLoading, setIsLoading] = useState(false)
-  const [alert, setAlert] = useState(null)
-  const [isValid, setIsValid] = useState(false)
+  const router = useRouter();
+  const [isLoading, setIsLoading] = useState(false);
+  const [alert, setAlert] = useState(null);
+  const [isValid, setIsValid] = useState(false);
 
-  const emailRef = useRef(null)
-  const passwordRef = useRef(null)
+  const emailRef = useRef(null);
+  const passwordRef = useRef(null);
 
   const inputVal = () => ({
     email: emailRef.current.value,
-    password: passwordRef.current.value
-  })
+    password: passwordRef.current.value,
+  });
 
   const handleChangeInput = () => {
-    const { email, password } = inputVal()
-    const isValidInput = email && password
-    setIsValid(isValidInput)
-  }
+    const { email, password } = inputVal();
+    const isValidInput = email && password;
+    setIsValid(isValidInput);
+  };
 
   const handleSubmit = async (e) => {
-    e.preventDefault()
-    setAlert(null)
-    setIsLoading(true)
-    const { email, password } = inputVal()
-    const login = await loginApi({ email, password })
-    setIsLoading(false)
+    e.preventDefault();
+    setAlert(null);
+    setIsLoading(true);
+    const { email, password } = inputVal();
+    const login = await loginApi({ email, password });
+    setIsLoading(false);
 
     if (login.isAuth) {
-      setAuth(login.user)
-      router.push(router.query?.next || '/')
-      return
+      setAuth(login.user);
+      router.push(router.query?.next || '/');
+      return;
     }
     switch (login.reason) {
       case 'NOT_FOUND':
         setAlert({
           children: 'Email atau password tidak cocok',
-          type: 'info'
-        })
-        break
+          type: 'info',
+        });
+        break;
       case 'NOT_ACTIVE':
         setAlert({
           children: (
             <>
               Email belum diaktivasi,
-              <Link className='text-gray-900' href={`/activate?email=${email}`}>
+              <Link
+                className='text-gray-900'
+                href={`?activation=email&email=${email}`}
+              >
                 aktivasi sekarang
               </Link>
             </>
           ),
-          type: 'info'
-        })
-        break
+          type: 'info',
+        });
+        break;
     }
-  }
+  };
 
   const handleGoogleSubmit = async (session) => {
     const params = {
-      access_token: session.accessToken
-    }
-    const data = await odooApi('POST', '/api/v1/user/validate-sso', params)
+      access_token: session.accessToken,
+    };
+    const data = await odooApi('POST', '/api/v1/user/validate-sso', params);
     if (data.isAuth) {
-      session.odooUser = data.user
-      setCookie('auth', JSON.stringify(session?.odooUser))
-      router.push(decodeURIComponent(router?.query?.next) ?? '/')
-      return
+      session.odooUser = data.user;
+      setCookie('auth', JSON.stringify(session?.odooUser));
+      router.push(decodeURIComponent(router?.query?.next) ?? '/');
+      return;
     }
-  }
+  };
 
   return {
     handleChangeInput,
@@ -84,8 +87,8 @@ const useLogin = () => {
     alert,
     emailRef,
     passwordRef,
-    handleGoogleSubmit
-  }
-}
+    handleGoogleSubmit,
+  };
+};
 
-export default useLogin
+export default useLogin;
diff --git a/src/pages/login.jsx b/src/pages/login.jsx
index 38174f84..9a1aa85b 100644
--- a/src/pages/login.jsx
+++ b/src/pages/login.jsx
@@ -1,9 +1,10 @@
-import Seo from '@/core/components/Seo'
-import SimpleFooter from '@/core/components/elements/Footer/SimpleFooter'
-import BasicLayout from '@/core/components/layouts/BasicLayout'
-import DesktopView from '@/core/components/views/DesktopView'
-import MobileView from '@/core/components/views/MobileView'
-import LoginComponent from '@/lib/auth/components/Login'
+import Seo from '@/core/components/Seo';
+import SimpleFooter from '@/core/components/elements/Footer/SimpleFooter';
+import BasicLayout from '@/core/components/layouts/BasicLayout';
+import DesktopView from '@/core/components/views/DesktopView';
+import MobileView from '@/core/components/views/MobileView';
+import LoginComponent from '@/lib/auth/components/Login';
+import AccountActivation from '~/modules/account-activation';
 
 export default function Login() {
   return (
@@ -20,6 +21,8 @@ export default function Login() {
         <LoginComponent />
         <SimpleFooter />
       </MobileView>
+
+      <AccountActivation />
     </>
-  )
+  );
 }
diff --git a/src/pages/register.jsx b/src/pages/register.jsx
index f79d6a4e..6112c72b 100644
--- a/src/pages/register.jsx
+++ b/src/pages/register.jsx
@@ -1,9 +1,3 @@
-import Seo from '@/core/components/Seo';
-import SimpleFooter from '@/core/components/elements/Footer/SimpleFooter';
-import BasicLayout from '@/core/components/layouts/BasicLayout';
-import DesktopView from '@/core/components/views/DesktopView';
-import MobileView from '@/core/components/views/MobileView';
-import RegisterComponent from '@/lib/auth/components/Register';
 import RegisterPage from '~/pages/register';
 
 export default function Register() {
-- 
cgit v1.2.3


From 6b221cccd58710682c99db7afbc29322da042880 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Tue, 31 Oct 2023 10:44:25 +0700
Subject: - Add redirect after activation - Add register form validation

---
 src/lib/auth/components/LoginDesktop.jsx | 82 +++++++++++++++-----------
 src/lib/auth/components/LoginMobile.jsx  | 99 +++++++++++++++++++-------------
 src/styles/globals.css                   |  6 +-
 3 files changed, 114 insertions(+), 73 deletions(-)

(limited to 'src')

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;
diff --git a/src/styles/globals.css b/src/styles/globals.css
index ea20b247..bf9fec10 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -107,7 +107,7 @@ button {
             disabled:bg-gray_r-5;
     }
 
-    .form-input[aria-invalid] {
+    .form-input[aria-invalid="true"] {
         @apply border-danger-500
             focus:border-danger-500;
     }
@@ -116,6 +116,10 @@ button {
         @apply py-2;
     }
 
+    .form-msg-danger {
+        @apply text-danger-600 mt-2 block;
+    }
+
     .btn-yellow,
     .btn-light,
     .btn-red,
-- 
cgit v1.2.3


From 94c1fba12e054165e7447e9cf778dd7de8922304 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Tue, 31 Oct 2023 10:51:23 +0700
Subject: Fix login mobile page content path

---
 src/lib/auth/components/LoginMobile.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/lib/auth/components/LoginMobile.jsx b/src/lib/auth/components/LoginMobile.jsx
index 58ae4e6e..40924fbe 100644
--- a/src/lib/auth/components/LoginMobile.jsx
+++ b/src/lib/auth/components/LoginMobile.jsx
@@ -149,7 +149,7 @@ const LoginMobile = () => {
         </div>
 
         <section className='my-10 md:my-0'>
-          <PageContent path='/register' />
+          <PageContent path='/login' />
         </section>
       </div>
     </MobileView>
-- 
cgit v1.2.3