fix(auth): make signup path obvious for first-time users
The /auth page was titled 'Welcome back' which made first-time
visitors think they needed an existing account. Google OAuth
already creates accounts on first sign-in, so this was a copy
problem, not a missing flow.
- Default copy is now neutral ('Sign in or sign up'); explicitly
notes that an account is auto-created on first sign-in.
- All marketing 'Get started' / 'Start free' CTAs now link to
/auth?new=1 which switches the page to 'Create your account'
copy. Plain 'Log in' links keep the neutral default.
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -60,11 +60,21 @@ function NextAuthForm() {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Detect new-vs-returning purely from local search params; we
|
||||||
|
// don't have a session at this render path, but the homepage
|
||||||
|
// sends "Get started" links with `?new=1` and "Sign in" links
|
||||||
|
// without it. Fall back to neutral copy that works for both.
|
||||||
|
const isNewUser = searchParams.get("new") === "1";
|
||||||
|
const title = isNewUser ? "Create your account" : "Sign in or sign up";
|
||||||
|
const subtitle = isNewUser
|
||||||
|
? "Continue with Google to set up your Vibn workspace."
|
||||||
|
: "Continue with Google. New here? An account is created automatically on first sign-in.";
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="justine-auth-inner">
|
<div className="justine-auth-inner">
|
||||||
<div className="justine-auth-card">
|
<div className="justine-auth-card">
|
||||||
<h1 className="justine-auth-title f">Welcome back</h1>
|
<h1 className="justine-auth-title f">{title}</h1>
|
||||||
<p className="justine-auth-sub">Sign in with Google to open your workspace.</p>
|
<p className="justine-auth-sub">{subtitle}</p>
|
||||||
|
|
||||||
{errorHint && (
|
{errorHint && (
|
||||||
<div
|
<div
|
||||||
|
|||||||
@@ -12,7 +12,7 @@ export function CTA() {
|
|||||||
{homepage.finalCTA.title}
|
{homepage.finalCTA.title}
|
||||||
</h2>
|
</h2>
|
||||||
<div className="flex flex-col sm:flex-row gap-4 pt-4">
|
<div className="flex flex-col sm:flex-row gap-4 pt-4">
|
||||||
<Link href="/auth">
|
<Link href="/auth?new=1">
|
||||||
<Button size="lg" className="h-12 px-8 text-base">
|
<Button size="lg" className="h-12 px-8 text-base">
|
||||||
<Sparkles className="mr-2 h-5 w-5" />
|
<Sparkles className="mr-2 h-5 w-5" />
|
||||||
{homepage.finalCTA.cta.primary}
|
{homepage.finalCTA.cta.primary}
|
||||||
|
|||||||
@@ -9,7 +9,7 @@ const links = {
|
|||||||
{ label: "How It Works", href: "/#how-it-works" },
|
{ label: "How It Works", href: "/#how-it-works" },
|
||||||
{ label: "Pricing", href: "/#pricing" },
|
{ label: "Pricing", href: "/#pricing" },
|
||||||
{ label: "Sign In", href: "/auth" },
|
{ label: "Sign In", href: "/auth" },
|
||||||
{ label: "Get Started", href: "/auth" },
|
{ label: "Get Started", href: "/auth?new=1" },
|
||||||
],
|
],
|
||||||
resources: [
|
resources: [
|
||||||
{ label: "GitHub", href: "https://github.com/MawkOne/viben", external: true },
|
{ label: "GitHub", href: "https://github.com/MawkOne/viben", external: true },
|
||||||
|
|||||||
@@ -21,7 +21,7 @@ export function Hero() {
|
|||||||
|
|
||||||
{/* CTAs */}
|
{/* CTAs */}
|
||||||
<div className="flex flex-col sm:flex-row gap-4 mt-4">
|
<div className="flex flex-col sm:flex-row gap-4 mt-4">
|
||||||
<Link href="/auth">
|
<Link href="/auth?new=1">
|
||||||
<Button size="lg" className="h-12 px-8 text-base">
|
<Button size="lg" className="h-12 px-8 text-base">
|
||||||
<Sparkles className="mr-2 h-5 w-5" />
|
<Sparkles className="mr-2 h-5 w-5" />
|
||||||
{homepage.hero.cta.primary}
|
{homepage.hero.cta.primary}
|
||||||
|
|||||||
@@ -170,7 +170,7 @@ export function JustineHomePage() {
|
|||||||
marginTop: 52,
|
marginTop: 52,
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Link href="/auth">
|
<Link href="/auth?new=1">
|
||||||
<button type="button" className="btn-ink-lg">
|
<button type="button" className="btn-ink-lg">
|
||||||
Start free — no code needed
|
Start free — no code needed
|
||||||
</button>
|
</button>
|
||||||
@@ -505,7 +505,7 @@ export function JustineHomePage() {
|
|||||||
<p style={{ fontSize: 16, color: "var(--mid)", lineHeight: 1.75, marginBottom: 38 }}>
|
<p style={{ fontSize: 16, color: "var(--mid)", lineHeight: 1.75, marginBottom: 38 }}>
|
||||||
Thousands of ideas never make it past a spreadsheet. Yours doesn't have to be one of them.
|
Thousands of ideas never make it past a spreadsheet. Yours doesn't have to be one of them.
|
||||||
</p>
|
</p>
|
||||||
<Link href="/auth">
|
<Link href="/auth?new=1">
|
||||||
<button type="button" className="btn-ink-lg" style={{ marginBottom: 16 }}>
|
<button type="button" className="btn-ink-lg" style={{ marginBottom: 16 }}>
|
||||||
Build my product — free
|
Build my product — free
|
||||||
</button>
|
</button>
|
||||||
|
|||||||
@@ -66,7 +66,7 @@ export function JustineNav() {
|
|||||||
<Link href="/auth" style={{ fontSize: 14, color: "#6366F1", fontWeight: 600, textDecoration: "none" }}>
|
<Link href="/auth" style={{ fontSize: 14, color: "#6366F1", fontWeight: 600, textDecoration: "none" }}>
|
||||||
Log in
|
Log in
|
||||||
</Link>
|
</Link>
|
||||||
<Link href="/auth">
|
<Link href="/auth?new=1">
|
||||||
<button type="button" className="btn-ink">
|
<button type="button" className="btn-ink">
|
||||||
Get started free
|
Get started free
|
||||||
</button>
|
</button>
|
||||||
@@ -103,7 +103,7 @@ export function JustineNav() {
|
|||||||
Log in
|
Log in
|
||||||
</Link>
|
</Link>
|
||||||
<div className="mobile-menu-cta">
|
<div className="mobile-menu-cta">
|
||||||
<Link href="/auth" onClick={close} style={{ display: "block", width: "100%" }}>
|
<Link href="/auth?new=1" onClick={close} style={{ display: "block", width: "100%" }}>
|
||||||
<button type="button" className="btn-ink-lg" style={{ width: "100%" }}>
|
<button type="button" className="btn-ink-lg" style={{ width: "100%" }}>
|
||||||
Get started free
|
Get started free
|
||||||
</button>
|
</button>
|
||||||
|
|||||||
Reference in New Issue
Block a user