Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 | 1x 12x 12x 12x 12x 5x 5x 5x 5x 5x 1x 1x 1x 12x 6x | "use client";
import { Suspense, useState } from "react";
import { signIn } from "@/lib/auth-client";
import { useSearchParams } from "next/navigation";
import { Button, ErrorMessage } from "@/components/ui";
function LoginContent() {
const searchParams = useSearchParams();
const [error, setError] = useState("");
const [loading, setLoading] = useState(false);
const callbackUrl = searchParams.get("callbackUrl") || "/collections";
async function handleGoogleSignIn() {
setError("");
setLoading(true);
try {
const { error: socialError } = await signIn.social({
provider: "google",
callbackURL: callbackUrl,
});
if (socialError) {
setError(socialError.message ?? "Google sign-in is unavailable right now.");
setLoading(false);
return;
}
} catch {
setError("Google sign-in is unavailable right now.");
setLoading(false);
}
}
return (
<div className="min-h-[100svh] flex items-center justify-center p-4 sm:p-6">
<div className="w-full max-w-[420px] bg-glass border border-rim rounded-card shadow-card p-6 sm:p-8">
<h1 className="font-display font-bold text-[2rem] tracking-tight text-center text-ink mb-2">
Adored
</h1>
<p className="text-center text-ink-soft mb-6 sm:mb-8">
Find the things you love.
</p>
{error && <ErrorMessage message={error} />}
<Button
type="button"
fullWidth
onClick={handleGoogleSignIn}
disabled={loading}
>
{loading ? "Opening Google..." : "Continue with Google"}
</Button>
</div>
</div>
);
}
export default function LoginPage() {
return (
<Suspense
fallback={
<div className="min-h-[100svh] flex items-center justify-center">
Loading...
</div>
}
>
<LoginContent />
</Suspense>
);
}
|