User activation feature

1 files changed, 19 insertions, 3 deletions

diff --git a/src/pages/login.js b/src/pages/login.js
index 315146a5..20912242 100644
--- a/src/pages/login.js
+++ b/src/pages/login.js
@@ -4,7 +4,7 @@ import Image from "next/image";
 import Link from "next/link";
 import { useRouter } from "next/router";
 import { useEffect, useState } from "react";
-import { toast } from "react-toastify";
+import Alert from "../components/Alert";
 import Spinner from "../components/Spinner";
 import { setAuth } from "../helpers/auth";
 import Logo from "../images/logo.png";
@@ -15,6 +15,7 @@ export default function Login() {
   const [password, setPassword] = useState('');
   const [isInputFulfilled, setIsInputFulfilled] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
+  const [alert, setAlert] = useState();
 
   useEffect(() => {
     setIsInputFulfilled(email && password);
@@ -28,8 +29,20 @@ export default function Login() {
       setAuth(login.data.user);
       router.push('/');
     } else {
-      toast.info('Email atau Password tidak cocok');
-      toast.clearWaitingQueue();
+      switch (login.data.reason) {
+        case 'NOT_FOUND':
+          setAlert({
+            component: <>Email atau password tidak cocok</>,
+            type: 'info'
+          });
+          break;
+        case 'NOT_ACTIVE':
+          setAlert({
+            component: <>Email belum diaktivasi, <Link className="text-gray-900" href={`/activate?email=${email}`}>aktivasi sekarang</Link></>,
+            type: 'info'
+          });
+          break;
+      }
       setIsLoading(false);
     }
   }
@@ -45,6 +58,9 @@ export default function Login() {
         </Link>
         <h1 className="text-2xl text-gray-900 mt-4">Mulai Belanja Sekarang</h1>
         <h2 className="text-gray-800 mt-2 mb-4">Masuk ke akun kamu untuk belanja</h2>
+        {alert ? (
+          <Alert className="text-center" type={alert.type}>{alert.component}</Alert>
+        ) : ''}
         <form onSubmit={login} className="w-full">
           <input 
             type="text"