Add auth

src/app/api/auth/[...all]/route.ts

@@ -0,0 +1,4 @@
+import { auth } from "@/lib/auth";
+import { toNextJsHandler } from "better-auth/next-js";
+
+export const { POST, GET } = toNextJsHandler(auth);

src/app/login/page.tsx

@@ -0,0 +1,23 @@
+import LoginForm from "@/components/auth/LoginForm";
+import { Suspense } from "react";
+
+export default function LoginPage() {
+  return (
+    <div className="flex min-h-screen items-center justify-center">
+      <div className="w-full max-w-sm space-y-6">
+        <div className="space-y-2 text-center">
+          <h1 className="text-2xl font-semibold tracking-tight">
+            Admin Sign In
+          </h1>
+          <p className="text-sm text-muted-foreground">
+            Sign in with your administrator account
+          </p>
+        </div>
+
+        <Suspense>
+          <LoginForm />
+        </Suspense>
+      </div>
+    </div>
+  );
+}

src/components/auth/LoginForm.tsx

@@ -0,0 +1,86 @@
+"use client";
+
+import { useRouter, useSearchParams } from "next/navigation";
+import * as React from "react";
+
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+
+export default function LoginForm() {
+  const router = useRouter();
+  const searchParams = useSearchParams();
+
+  const next = searchParams.get("next") ?? "/";
+  const [email, setEmail] = React.useState("");
+  const [password, setPassword] = React.useState("");
+  const [pending, setPending] = React.useState(false);
+  const [error, setError] = React.useState<string | null>(null);
+
+  async function onSubmit(e: React.FormEvent) {
+    e.preventDefault();
+    setPending(true);
+    setError(null);
+
+    try {
+      const res = await fetch("/api/auth/sign-in/email", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          email,
+          password,
+        }),
+      });
+
+      if (!res.ok) {
+        const data = await res.json().catch(() => null);
+        setError(data?.message ?? "Invalid email or password");
+        return;
+      }
+
+      // Successful login → redirect back
+      router.replace(next);
+      router.refresh();
+    } catch {
+      setError("Something went wrong. Please try again.");
+    } finally {
+      setPending(false);
+    }
+  }
+
+  return (
+    <form onSubmit={onSubmit} className="space-y-4">
+      <div className="space-y-2">
+        <Label htmlFor="email">Email</Label>
+        <Input
+          id="email"
+          type="email"
+          autoComplete="email"
+          required
+          value={email}
+          onChange={(e) => setEmail(e.target.value)}
+        />
+      </div>
+
+      <div className="space-y-2">
+        <Label htmlFor="password">Password</Label>
+        <Input
+          id="password"
+          type="password"
+          autoComplete="current-password"
+          required
+          value={password}
+          onChange={(e) => setPassword(e.target.value)}
+        />
+      </div>
+
+      {error && (
+        <p className="text-sm text-destructive">{error}</p>
+      )}
+
+      <Button type="submit" className="w-full" disabled={pending}>
+        {pending ? "Signing in…" : "Sign in"}
+      </Button>
+    </form>
+  );
+}

src/components/auth/LogoutButton.tsx

@@ -0,0 +1,20 @@
+"use client";
+
+import { Button } from "@/components/ui/button";
+import { useRouter } from "next/navigation";
+
+export function LogoutButton() {
+  const router = useRouter();
+
+  async function logout() {
+    await fetch("/api/auth/sign-out", { method: "POST" });
+    router.replace("/login");
+    router.refresh();
+  }
+
+  return (
+    <Button variant="secondary" onClick={logout}>
+      Sign out
+    </Button>
+  );
+}

src/components/global/Header.tsx

@@ -1,16 +1,13 @@
-// import { auth } from "@/auth";
-// import { SignInOutButton } from "../auth/SignInOutButton";
+import { LogoutButton } from "../auth/LogoutButton";
 import ModeToggle from "./ModeToggle";
 import TopNav from "./TopNav";
 
 export default async function Header() {
-  // const session = await auth()
-
   return (
     <div className="flex items-center justify-between">
       <TopNav />
       <div className="flex items-center justify-between gap-4">
-        {/* <SignInOutButton session={session} /> */}
+        <LogoutButton />
         <ModeToggle />
       </div>
     </div>

src/lib/auth.ts

@@ -0,0 +1,12 @@
+import { betterAuth } from "better-auth";
+import { prismaAdapter } from "better-auth/adapters/prisma";
+import { prisma } from "./prisma";
+
+export const auth = betterAuth({
+  database: prismaAdapter(prisma, {
+    provider: "postgresql",
+  }),
+  emailAndPassword: { 
+    enabled: true, 
+  }, 
+});

src/proxy.ts

@@ -0,0 +1,30 @@
+import { auth } from "@/lib/auth";
+import { headers } from "next/headers";
+import { NextRequest, NextResponse } from "next/server";
+
+export async function proxy(request: NextRequest) {
+    const { pathname, search } = request.nextUrl;
+    
+    const session = await auth.api.getSession({
+        headers: await headers()
+    })
+
+    if (
+        pathname === "/login" ||
+        pathname.startsWith("/api/auth") ||
+        pathname.startsWith("/_next") ||
+        pathname === "/favicon.ico"
+    ) {
+        return NextResponse.next();
+    }
+
+    if(!session) {
+        return NextResponse.redirect(new URL("/login", request.url));
+    }
+
+    return NextResponse.next();
+}
+
+export const config = {
+  matcher: ["/((?!api/auth|api/image|login|_next/static|_next/image|favicon.ico).*)"],
+};