"use client";
import { useState } from "react";

export default function AdminLoginPage(){
  const [error,setError]=useState("");
  const [loading,setLoading]=useState(false);
  async function submit(e:React.FormEvent<HTMLFormElement>){
    e.preventDefault();setError("");setLoading(true);
    const form=new FormData(e.currentTarget);
    const res=await fetch('/api/auth/login',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({email:form.get('email'),password:form.get('password')})});
    const data=await res.json().catch(()=>({}));
    if(res.ok){window.location.href='/admin';return}
    setError(data.error||'Login gagal');setLoading(false);
  }
  return <main className="login-page"><div className="login-card"><div className="brand-mark">AJ</div><h1>Login CMS Al Jannah</h1><p className="muted">Masuk untuk mengelola konten, donasi, dan Local SEO.</p><form onSubmit={submit}><label>Email</label><input name="email" type="email" required placeholder="admin@aljannah.org"/><label>Password</label><input name="password" type="password" required placeholder="••••••••"/>{error&&<div className="login-error">{error}</div>}<button className="btn" disabled={loading}>{loading?'Memeriksa...':'Masuk ke CMS'}</button></form><a className="link" href="/">← Kembali ke website</a></div></main>
}
