"use client"; import { useState } from "react"; import { useRouter } from "next/navigation"; import Image from "next/image"; import Link from "next/link"; import { Button } from "@/components/ui/button"; import { Input } from "@/components/ui/input"; import { Label } from "@/components/ui/label"; import { Loader2, ArrowRight } from "lucide-react"; import { motion } from "framer-motion"; import { toast } from "@/hooks/use-toast"; // Matches LoginPage background const AuthBackground = () => (
); export default function RegisterPage() { const [username, setUsername] = useState(""); const [password, setPassword] = useState(""); const [invitationCode, setInvitationCode] = useState(""); const [loading, setLoading] = useState(false); const router = useRouter(); async function handleRegister(e: React.FormEvent) { e.preventDefault(); setLoading(true); try { const res = await fetch(`/api/auth/register`, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ username, password, invitationCode }), }); const data = await res.json(); if (res.ok) { toast({ title: "Account Created! 🎉", description: "Welcome to Ember Market. Redirecting to login...", variant: "default", }); setTimeout(() => router.push("/auth/login"), 1500); } else { toast({ title: "Registration Failed", description: data.error || "Please check your details.", variant: "destructive", }); setLoading(false); } } catch (error) { toast({ title: "Error", description: "Something went wrong. Please try again.", variant: "destructive", }); setLoading(false); } } return (

Create your account

Start managing your store today

setUsername(e.target.value)} className="bg-white/5 border-white/10 text-white placeholder:text-zinc-500 focus:border-indigo-500/50 focus:ring-indigo-500/20 transition-all duration-300" placeholder="Choose a username" disabled={loading} />
setPassword(e.target.value)} className="bg-white/5 border-white/10 text-white placeholder:text-zinc-500 focus:border-indigo-500/50 focus:ring-indigo-500/20 transition-all duration-300" placeholder="Create a strong password" disabled={loading} />
setInvitationCode(e.target.value)} className="bg-white/5 border-white/10 text-white placeholder:text-zinc-500 focus:border-indigo-500/50 focus:ring-indigo-500/20 transition-all duration-300" placeholder="Enter your invite code" disabled={loading} />

Already have an account?{" "} Sign in

); }