Fix admin login page

- Create proper /admin-login page
- Fix route conflict

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
Manohar Gupta 2026-05-16 11:28:54 +05:30
parent da8675c045
commit 6543d888c8

View file

@ -1,18 +1,98 @@
"use client";
import { useEffect } from "react";
import { useState, useEffect } from "react";
import { useRouter } from "next/navigation";
export default function AdminLoginRedirect() {
export default function AdminLoginPage() {
const router = useRouter();
const [username, setUsername] = useState("");
const [password, setPassword] = useState("");
const [error, setError] = useState("");
const [loading, setLoading] = useState(false);
// Check if already logged in
useEffect(() => {
router.replace("/admin-login");
const token = localStorage.getItem("admin_token");
if (token) {
router.push("/admin");
}
}, [router]);
const handleLogin = async (e: React.FormEvent) => {
e.preventDefault();
if (!username || !password) return;
setLoading(true);
setError("");
try {
const res = await fetch("/api/admin/auth", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ username, password }),
});
const data = await res.json();
if (res.ok && data.success) {
localStorage.setItem("admin_token", data.token);
localStorage.setItem("admin_user", JSON.stringify({ username: data.username, role: data.role }));
router.push("/admin");
} else {
setError(data.error || "Invalid credentials");
}
} catch (err) {
setError("Login failed");
} finally {
setLoading(false);
}
};
return (
<div className="min-h-screen flex items-center justify-center bg-gray-900">
<div className="text-white">Redirecting...</div>
<div className="min-h-screen bg-gray-900 flex items-center justify-center p-4">
<div className="bg-gray-800 p-8 rounded-2xl shadow-lg max-w-md w-full">
<h1 className="text-2xl font-bold text-center mb-6 text-white">Admin Login</h1>
<form onSubmit={handleLogin} className="space-y-4">
<div>
<label className="block text-sm font-medium mb-1 text-gray-300">Username</label>
<input
type="text"
value={username}
onChange={(e) => setUsername(e.target.value)}
className="w-full p-3 bg-gray-700 border border-gray-600 rounded-xl text-white"
required
/>
</div>
<div>
<label className="block text-sm font-medium mb-1 text-gray-300">Password</label>
<input
type="password"
value={password}
onChange={(e) => setPassword(e.target.value)}
className="w-full p-3 bg-gray-700 border border-gray-600 rounded-xl text-white"
required
/>
</div>
{error && (
<p className="text-red-400 text-sm">{error}</p>
)}
<button
type="submit"
disabled={loading}
className="w-full py-3 bg-rose-500 text-white rounded-xl font-medium disabled:opacity-50"
>
{loading ? "..." : "Login"}
</button>
</form>
<p className="text-center mt-4 text-sm text-gray-400">
Default: admin / admin123
</p>
</div>
</div>
);
}