"use client";
import Link from "next/link";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { TurnstileWidget } from "@/components/security/TurnstileWidget";
import { useSpamGuard } from "@/components/security/useSpamGuard";
type Mode = "login" | "register" | "magic-link";
const PRIVACY_HINT = (
Korišćenjem prihvatate{" "}
Politiku privatnosti
{" "}
i{" "}
Uslove korišćenja
.
);
type Props = {
defaultMode?: Mode;
redirectTo?: string;
googleEnabled?: boolean;
};
export function AuthForm({ defaultMode = "login", redirectTo = "/nalog", googleEnabled = false }: Props) {
const router = useRouter();
const [mode, setMode] = useState(defaultMode);
const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
const [name, setName] = useState("");
const [marketingOptIn, setMarketing] = useState(false);
const [busy, setBusy] = useState(false);
const [err, setErr] = useState(null);
const [magicSent, setMagicSent] = useState(false);
const guard = useSpamGuard();
async function syncFavoritesOnLogin() {
// Best-effort: if user already had local favorites, push them up.
try {
const raw = window.localStorage.getItem("bp_favorites_v1");
if (!raw) return;
const items = JSON.parse(raw);
if (!Array.isArray(items) || items.length === 0) return;
const payload = items.map(
(it: { type: string; id: string; title: string; path: string }) => ({
entityType: it.type,
entityId: it.id,
title: it.title,
path: it.path,
}),
);
await fetch("/api/visitor-favorites/sync", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ items: payload }),
});
} catch {
/* noop */
}
}
async function onSubmit(e: React.FormEvent) {
e.preventDefault();
setErr(null);
setBusy(true);
try {
if (mode === "magic-link") {
const res = await fetch("/api/visitor-auth/magic-link", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
email,
redirectTo,
website_url: guard.honeypotValue,
_bp_t: guard.token,
}),
});
if (!res.ok) throw new Error("Greška pri slanju linka.");
setMagicSent(true);
} else if (mode === "login") {
const res = await fetch("/api/visitor-auth/login", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
email,
password,
website_url: guard.honeypotValue,
_bp_t: guard.token,
}),
});
const data = await res.json().catch(() => ({}));
if (!res.ok) throw new Error(data?.error || "Pogrešni podaci za prijavu.");
await syncFavoritesOnLogin();
router.replace(redirectTo);
router.refresh();
} else {
const res = await fetch("/api/visitor-auth/register", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
email,
password,
name,
marketingOptIn,
website_url: guard.honeypotValue,
_bp_t: guard.token,
}),
});
const data = await res.json().catch(() => ({}));
if (!res.ok) throw new Error(data?.error || "Greška pri registraciji.");
await syncFavoritesOnLogin();
router.replace(redirectTo);
router.refresh();
}
} catch (caught) {
setErr(caught instanceof Error ? caught.message : "Greška.");
} finally {
setBusy(false);
}
}
const inputCls =
"w-full rounded-xl border border-[#ede8e3] bg-[#faf9f7] px-3.5 py-2.5 text-sm text-[#0c1828] placeholder:text-[#9ca3af] outline-none transition focus:border-[#c2410c]/40 focus:bg-white focus:ring-2 focus:ring-[#c2410c]/15";
if (magicSent) {
return (
✓
Proverite e-mail
Poslali smo link za prijavu na {email}. Link važi 30 minuta.
);
}
return (
);
}