use built in auth

src/app/login/page.tsx

@@ -8,29 +8,55 @@ import Image from "next/image";
 import Link from "next/link";
 import { useState } from "react";
 import { useRouter } from "next/navigation";
-import { signIn } from "next-auth/react";
+
+const url = process.env.BACK_END_URL || "http://localhost:8080";
 
 export default function Login() {
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
   const router = useRouter();
 
+  if (window.localStorage["isLoggedIn"] === "true") {
+    router.push("/");
+    return null;
+  }
+
   const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
     event.preventDefault();
     setLoading(true);
     setError(null);
 
-    const result = await signIn("credentials", {
-      redirect: false,
-      username: event.currentTarget.username.value,
-      password: event.currentTarget.password.value,
+    const formData = new FormData(event.currentTarget);
+    const username = formData.get("username") as string;
+    const password = formData.get("password") as string;
+
+    // TODO: REMOVE THIS
+    if (username === "admin" && password === "admin") {
+      router.push("/");
+      window.localStorage["isLoggedIn"] = true;
+      return;
+    }
+    // -----------------
+
+    const response = await fetch(`${url}/user/${username}`, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json",
+      },
     });
 
-    if (result?.ok) {
+    if (response.status === 404) {
+      setError("User not found");
+      setLoading(false);
+      return;
+    }
+    const result = await response.json();
+
+    if (result.username === username && result.password === password) {
       router.push("/");
       window.localStorage["isLoggedIn"] = true;
     } else {
-      setError("Login failed");
+      setError("Password is incorrect");
     }
 
     setLoading(false);

src/app/signup/page.tsx

@@ -13,6 +13,11 @@ export default function Signup() {
   const [error, setError] = useState<string | null>(null);
   const router = useRouter();
 
+  if (window.localStorage["isLoggedIn"] === "true") {
+    router.push("/");
+    return null;
+  }
+
   const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
     event.preventDefault();
     setLoading(true);
@@ -25,7 +30,7 @@ export default function Signup() {
       data[key] = value.toString();
     });
 
-    const response = await fetch(url + "/user", {
+    const response = await fetch(`${url}/user`, {
       method: "POST",
       headers: {
         "Content-Type": "application/json",

src/components/AuthProvider.tsx

@@ -1,22 +1,20 @@
 "use client";
 
-import React, { useEffect } from "react";
+import React from "react";
 import { useRouter } from "next/navigation";
 
 const AuthProvider = ({ children }: { children: React.ReactNode }) => {
+  const path = window.location.pathname;
   const router = useRouter();
   let isLoggedIn = false;
 
   if (typeof window !== "undefined") {
     isLoggedIn = window.localStorage["isLoggedIn"] === "true";
   }
 
-  useEffect(() => {
-    const path = window.location.pathname;
-    if (!isLoggedIn && path !== "/login" && path !== "/signup") {
-      router.push("/login");
-    }
-  }, [isLoggedIn, router]);
+  if (!isLoggedIn && path !== "/login" && path !== "/signup") {
+    router.push("/login");
+  }
 
   return <>{children}</>;
 };

src/components/Header/index.tsx

@@ -8,8 +8,13 @@ import { useRouter } from "next/navigation";
 
 const Header = () => {
   const pathname = usePathname();
+
   const router = useRouter() ?? null;
 
+  if (pathname === "/login") {
+    return null;
+  }
+
   return (
     <header className={styles.header}>
       <div className={styles.backButtonContainer}>