1 files changed, 23 insertions, 7 deletions

diff --git a/src/pages/register.js b/src/pages/register.js
index 8c499b32..69099a0b 100644
--- a/src/pages/register.js
+++ b/src/pages/register.js
@@ -3,7 +3,7 @@ import Head from "next/head";
 import Image from "next/image";
 import Link from "next/link";
 import { useEffect, useState } from "react";
-import { toast } from "react-toastify";
+import Alert from "../components/Alert";
 import Spinner from "../components/Spinner";
 import Logo from "../images/logo.png";
 
@@ -13,6 +13,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 && name && password);
@@ -21,14 +22,26 @@ export default function Login() {
   const register = async (e) => {
     e.preventDefault();
     setIsLoading(true);
-    let login = await axios.post(`${process.env.SELF_HOST}/api/register`, {email, name, password});
-    if (login.data.register) {
-      toast.success('Berhasil mendaftarkan akun anda, cek email untuk melakukan aktivasi akun');
+    let register = await axios.post(`${process.env.SELF_HOST}/api/register`, {email, name, password});
+    if (register.data.register) {
+      setAlert({
+        component: <>Berhasil mendaftarkan akun anda, cek email untuk melakukan aktivasi akun</>,
+        type: 'success'
+      });
+      setEmail('');
+      setName('');
+      setPassword('');
     } else {
-      toast.info('Email telah digunakan');
-      toast.clearWaitingQueue();
-      setIsLoading(false);
+      switch (register.data.reason) {
+        case 'EMAIL_USED':
+          setAlert({
+            component: <>Email telah digunakan</>,
+            type: 'info'
+          });
+          break;
+      }
     }
+    setIsLoading(false);
   }
 
   return (
@@ -42,6 +55,9 @@ export default function Login() {
         </Link>
         <h1 className="text-2xl text-gray-900 mt-4 text-center">Mudahkan Pembelian dengan Indoteknik</h1>
         <h2 className="text-gray-800 mt-2 mb-4">Daftar untuk melanjutkan</h2>
+        {alert ? (
+          <Alert className="text-center" type={alert.type}>{alert.component}</Alert>
+        ) : ''}
         <form onSubmit={register} className="w-full">
           <input 
             type="text"