{"path":"src/app/(auth)/signup/page.tsx","size":5182,"locked":false,"binary":false,"truncated":false,"content":"\"use client\";\n\nexport const dynamic = \"force-dynamic\";\n\nimport { useState } from \"react\";\nimport { useRouter } from \"next/navigation\";\nimport Link from \"next/link\";\nimport { createClient } from \"@/lib/supabase/client\";\nimport { brandConfig } from \"@/lib/brand\";\n\nexport default function SignupPage() {\n  const [email, setEmail] = useState(\"\");\n  const [password, setPassword] = useState(\"\");\n  const [fullName, setFullName] = useState(\"\");\n  const [loading, setLoading] = useState(false);\n  const [error, setError] = useState(\"\");\n  const [success, setSuccess] = useState(false);\n  const router = useRouter();\n  const supabase = createClient();\n\n  const handleSignup = async (e: React.FormEvent) => {\n    e.preventDefault();\n    if (!supabase) {\n      setError(\"Authentication is not configured yet.\");\n      return;\n    }\n    setLoading(true);\n    setError(\"\");\n\n    const { error } = await supabase.auth.signUp({\n      email,\n      password,\n      options: {\n        data: { full_name: fullName },\n      },\n    });\n\n    if (error) {\n      setError(error.message);\n      setLoading(false);\n      return;\n    }\n\n    // If email verification is off, the user is immediately created\n    setSuccess(true);\n    setLoading(false);\n  };\n\n  if (success) {\n    return (\n      <div className=\"flex min-h-[80vh] items-center justify-center bg-[#fafafa] px-4\">\n        <div className=\"w-full max-w-md space-y-8 rounded-sm border border-neutral-200 bg-white p-8 shadow-sm text-center\">\n          <h2 className=\"font-serif text-2xl font-medium tracking-wider text-neutral-900\">\n            Account created\n          </h2>\n          <p className=\"text-sm text-neutral-500\">\n            You can now sign in.{\" \"}\n            <Link\n              href=\"/login\"\n              className=\"font-medium text-neutral-900 underline hover:text-black\"\n            >\n              Sign in\n            </Link>\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"flex min-h-[80vh] items-center justify-center bg-[#fafafa] px-4\">\n      <div className=\"w-full max-w-md space-y-8 rounded-sm border border-neutral-200 bg-white p-8 shadow-sm\">\n        <div className=\"text-center\">\n          <h2 className=\"font-serif text-3xl font-medium tracking-wider text-neutral-900\">\n            Create your account\n          </h2>\n          <p className=\"mt-2 text-sm text-neutral-500\">\n            Get started with your business website.\n          </p>\n        </div>\n        <form className=\"mt-8 space-y-6\" onSubmit={handleSignup}>\n          <div className=\"space-y-4\">\n            <div>\n              <label className=\"block text-[11px] uppercase tracking-widest text-neutral-500 mb-1\">\n                Full name\n              </label>\n              <input\n                type=\"text\"\n                required\n                value={fullName}\n                onChange={(e) => setFullName(e.target.value)}\n                className=\"w-full bg-[#f4f4f4] border border-transparent text-sm px-4 py-3 rounded-sm focus:outline-none focus:border-neutral-300 transition font-light\"\n                placeholder=\"Jane Smith\"\n              />\n            </div>\n            <div>\n              <label className=\"block text-[11px] uppercase tracking-widest text-neutral-500 mb-1\">\n                Email address\n              </label>\n              <input\n                type=\"email\"\n                required\n                value={email}\n                onChange={(e) => setEmail(e.target.value)}\n                className=\"w-full bg-[#f4f4f4] border border-transparent text-sm px-4 py-3 rounded-sm focus:outline-none focus:border-neutral-300 transition font-light\"\n                placeholder=\"jane@example.com\"\n              />\n            </div>\n            <div>\n              <label className=\"block text-[11px] uppercase tracking-widest text-neutral-500 mb-1\">\n                Password\n              </label>\n              <input\n                type=\"password\"\n                required\n                value={password}\n                onChange={(e) => setPassword(e.target.value)}\n                className=\"w-full bg-[#f4f4f4] border border-transparent text-sm px-4 py-3 rounded-sm focus:outline-none focus:border-neutral-300 transition font-light\"\n                placeholder=\"••••••••\"\n              />\n            </div>\n          </div>\n\n          {error && <p className=\"text-sm text-red-500 text-center\">{error}</p>}\n\n          <button\n            type=\"submit\"\n            disabled={loading}\n            className=\"w-full bg-black text-white text-[11px] uppercase tracking-[0.15em] font-medium py-3.5 rounded-sm hover:bg-neutral-800 transition disabled:opacity-50\"\n          >\n            {loading ? \"Creating account…\" : \"Sign up\"}\n          </button>\n        </form>\n        <div className=\"text-center text-sm\">\n          <p className=\"text-neutral-500\">\n            Already have an account?{\" \"}\n            <Link\n              href=\"/login\"\n              className=\"font-medium text-neutral-900 underline hover:text-black transition\"\n            >\n              Sign in\n            </Link>\n          </p>\n        </div>\n      </div>\n    </div>\n  );\n          }\n"}