added login page

Websites/jefes-nextjs/app/api/auth/[...nextauth]/route.ts

@@ -1,5 +1,7 @@
 import NextAuth from "next-auth";
 import CredentialsProvider from "next-auth/providers/credentials";
+import { compare } from "bcrypt";
+import mysql from 'mysql2/promise';
 
 const handler = NextAuth({
   providers: [
@@ -15,18 +17,10 @@ const handler = NextAuth({
         password: {},
       },
       async authorize(credentials, req) {
-        // Add logic here to look up the user from the credentials supplied
-        const user = { id: "1", name: "J Smith", email: "jsmith@example.com" };
-
-        if (user) {
-          // Any object returned will be saved in `user` property of the JWT
-          return user;
-        } else {
-          // If you return null then an error will be displayed advising the user to check their details.
-          return null;
-
-          // You can also Reject this callback with an Error thus the user will be sent to the error page with the error message as a query parameter
-        }
+        // compare hashed password with password entered
+        
+        console.log({ credentials });
+        return null;
       },
     }),
   ],

Websites/jefes-nextjs/app/api/auth/register/route.ts

@@ -28,7 +28,7 @@ export async function POST(request: Request) {
 
     const response = await db.insert(users).values({
       email: email,
-      password: password,
+      password: hashedPassword,
     });
   } catch (e) {
     console.log({ e });

Websites/jefes-nextjs/app/login/loginForm.tsx

@@ -0,0 +1,31 @@
+"use client";
+import React, { FormEvent } from "react";
+import { Input } from "@/components/ui/input";
+import { Button } from "@/components/ui/button";
+import { signIn } from "next-auth/react";
+
+const LoginForm = () => {
+  const handleSubmit = async (e: FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    const formData = new FormData(e.currentTarget);
+    signIn("credentials", {
+      email: formData.get("email"),
+      password: formData.get("password"),
+      redirect: false,
+    });
+  };
+  return (
+    <div className="w-full h-full">
+      <form
+        onSubmit={handleSubmit}
+        className="flex flex-col gap-2 mx-auto max-w-md mt-20"
+      >
+        <Input name="email" type="email" placeholder="email" />
+        <Input name="password" type="password" placeholder="password" />
+        <Button className="bg-blue-500 text-white text-lg">Login</Button>
+      </form>
+    </div>
+  );
+};
+
+export default LoginForm;

Websites/jefes-nextjs/app/login/page.tsx

@@ -0,0 +1,12 @@
+import React from "react";
+import LoginForm from "./loginForm";
+
+export default function LoginPage() {
+  return (
+    <div className="flex flex-col bg-emerald-700 w-full h-[800svh]">
+      <div className="absolute w-full h-[20svh] top-60">
+        <LoginForm />
+      </div>
+    </div>
+  );
+}

Websites/jefes-nextjs/app/register/page.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import RegistrationForm from "./registrationForm";
 
-export default async function Admin() {
+export default async function Register() {
   return (
     <div className="flex flex-col bg-emerald-700 w-full h-[800svh]">
       <div className="absolute w-full h-[20svh] top-60">