added Login page

apps/hub/app/(auth)/login/_components/Login.tsx

@@ -0,0 +1,44 @@
+'use client';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { signIn } from 'next-auth/react';
+import { useForm } from 'react-hook-form';
+import { z } from 'zod';
+
+export const Login = () => {
+  const schema = z.object({
+    email: z.string().email(),
+    password: z.string().min(6),
+  });
+
+  const form = useForm({
+    resolver: zodResolver(schema),
+  });
+  console.log(form.formState.errors);
+  return (
+    <form
+      className="flex flex-col space-y-4 "
+      onSubmit={form.handleSubmit(async () => {
+        const data = await signIn('credentials', {
+          redirect: false,
+          email: form.getValues('email'),
+          password: form.getValues('password'),
+        });
+        console.log(data);
+      })}
+    >
+      <input
+        {...form.register('email')}
+        placeholder="Email"
+        className="border border-gray-300 rounded-md p-2"
+      />
+      <input
+        {...form.register('password')}
+        placeholder="Password"
+        className="border border-gray-300 rounded-md p-2"
+      />
+      <button type="submit" className="bg-blue-500 text-white rounded-md p-2">
+        Login
+      </button>
+    </form>
+  );
+};

apps/hub/app/(auth)/login/page.tsx

@@ -1,13 +1,12 @@
 import { Provider } from 'next-auth/providers/index';
 import { getProviders } from 'next-auth/react';
+import { Login } from './_components/Login';
 
 export default async () => {
-  const providers = await getProviders();
-  console.log(providers);
-
   return (
-    <div>
+    <div className="mx-auto max-w-sm ">
       <h1 className="text-5xl">Login</h1>
+      <Login />
     </div>
   );
 };