141 lines
4.4 KiB
TypeScript

"use client";
import { useState } from "react";
import { useRouter } from "next/navigation";
import Link from "next/link";
import { useAuth } from "@/hooks/useAuth";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Alert, AlertDescription } from "@/components/ui/alert";
import { AuthenticationError } from "@/lib/auth";
export default function LoginAdminPage() {
const [credentials, setCredentials] = useState({ email: "", password: "" });
const [error, setError] = useState("");
const [loading, setLoading] = useState(false);
const router = useRouter();
const { login } = useAuth();
const handleLogin = async (e: React.FormEvent) => {
e.preventDefault();
setLoading(true);
setError("");
try {
// Tentar fazer login usando o contexto com tipo administrador
const success = await login(
credentials.email,
credentials.password,
"administrador",
);
if (success) {
console.log("[LOGIN-ADMIN] Login bem-sucedido, redirecionando...");
// Redirecionamento direto - solução que funcionou
window.location.href = "/dashboard";
}
} catch (error_) {
console.error("[LOGIN-ADMIN] Erro no login:", error_);
if (error_ instanceof AuthenticationError) {
setError(error_.message);
} else {
setError("Erro inesperado. Tente novamente.");
}
} finally {
setLoading(false);
}
};
return (
<div className="min-h-screen flex items-center justify-center bg-background py-12 px-4 sm:px-6 lg:px-8">
<div className="max-w-md w-full space-y-8">
<div className="text-center">
<h2 className="mt-6 text-3xl font-extrabold text-foreground">
Login Administrador de Clínica
</h2>
<p className="mt-2 text-sm text-muted-foreground">
Entre com suas credenciais para acessar o sistema administrativo
</p>
</div>
<Card>
<CardHeader>
<CardTitle className="text-center">Acesso Administrativo</CardTitle>
</CardHeader>
<CardContent>
<form onSubmit={handleLogin} className="space-y-6">
<div>
<label
htmlFor="email"
className="block text-sm font-medium text-foreground"
>
Email
</label>
<Input
id="email"
type="email"
placeholder="Digite seu email"
value={credentials.email}
onChange={(e) =>
setCredentials({ ...credentials, email: e.target.value })
}
required
className="mt-1"
disabled={loading}
/>
</div>
<div>
<label
htmlFor="password"
className="block text-sm font-medium text-foreground"
>
Senha
</label>
<Input
id="password"
type="password"
placeholder="Digite sua senha"
value={credentials.password}
onChange={(e) =>
setCredentials({ ...credentials, password: e.target.value })
}
required
className="mt-1"
disabled={loading}
/>
</div>
{error && (
<Alert variant="destructive">
<AlertDescription>{error}</AlertDescription>
</Alert>
)}
<Button
type="submit"
className="w-full cursor-pointer"
disabled={loading}
>
{loading ? "Entrando..." : "Entrar no Sistema Administrativo"}
</Button>
</form>
<div className="mt-4 text-center">
<Button
variant="outline"
asChild
className="w-full hover:!bg-primary hover:!text-white hover:!border-primary transition-all duration-200"
>
<Link href="/">Voltar ao Início</Link>
</Button>
</div>
</CardContent>
</Card>
</div>
</div>
);
}