const form = document.querySelector("#login-form");
const message = document.querySelector("#message");
const submitButton = form.querySelector("button[type=submit]");

function showError(text) {
	message.textContent = text;
	message.className = "auth-message error";
}

form.addEventListener("submit", async (event) => {
	event.preventDefault();
	submitButton.disabled = true;
	message.textContent = "";
	try {
		const response = await fetch("/api/auth/login", {
			method: "POST",
			headers: { "content-type": "application/json" },
			body: JSON.stringify(Object.fromEntries(new FormData(form))),
		});
		const body = await response.json();
		if (!response.ok) {
			showError(
				body.code === "too_many_attempts"
					? "Too many attempts. Try again in a few minutes."
					: body.error || "Could not log in. Check your email and password.",
			);
			return;
		}
		location.assign("/app");
	} catch {
		showError("Could not reach the server. Check your connection and try again.");
	} finally {
		submitButton.disabled = false;
	}
});