/home/techb158/balavpn.abdallabala.com/src/app/login
Edit: /home/techb158/balavpn.abdallabala.com/src/app/login/page.jsx (5733B)
"use client";
import { useState, useEffect } from "react";
import { useRouter } from "next/navigation";
const DEMO_CREDENTIALS = [
{ role: "Super Owner", email: "super-owner@cosmic.local", password: "cosmic123" },
{ role: "Super Admin", email: "super-admin@cosmic.local", password: "super123" },
{ role: "Owner", email: "owner@cosmic.local", password: "owner123" },
{ role: "Admin", email: "admin@cosmic.local", password: "admin123" },
{ role: "Project Manager", email: "pm@cosmic.local", password: "pm123" },
{ role: "Risk Owner", email: "risk-owner@cosmic.local", password: "risk123" },
{ role: "Viewer", email: "viewer@cosmic.local", password: "view123" },
];
export default function LoginPage() {
const router = useRouter();
const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
const [error, setError] = useState("");
const [loading, setLoading] = useState(false);
const [ssoEnabled, setSsoEnabled] = useState(false);
const [showDemo, setShowDemo] = useState(false);
useEffect(() => {
fetch("/api/auth/sso")
.then(res => { if (res.status !== 501) setSsoEnabled(true); })
.catch(() => {});
}, []);
async function handleSubmit(event) {
event.preventDefault();
setError("");
setLoading(true);
try {
const res = await fetch("/api/auth/login", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ email, password })
});
if (!res.ok) {
const data = await res.json();
throw new Error(data.error || "Login failed");
}
router.push("/dashboard");
} catch (err) {
setError(err.message);
setLoading(false);
}
}
function fillDemo(email, password) {
setEmail(email);
setPassword(password);
}
return (
COSMIC AI-Risk SaaS
Sign in
Enter your credentials to access the dashboard
{error &&
{error}
}
{ssoEnabled && (
<>
OR
Sign in with SSO
)}
{showDemo && (
Click a row to auto-fill:
{DEMO_CREDENTIALS.map(d => (
fillDemo(d.email, d.password)}
style={{ cursor: "pointer", padding: "6px 8px", borderRadius: 6, display: "flex", justifyContent: "space-between", alignItems: "center" }}
onMouseEnter={e => e.currentTarget.style.background = "var(--line)"}
onMouseLeave={e => e.currentTarget.style.background = "transparent"}>
{d.role}
{d.email}
))}
)}
Create an account
);
}