function MainComponent() { const [error, setError] = useState(null); const [loading, setLoading] = useState(false); const [formData, setFormData] = useState({ email: "", password: "", username: "", expertiseLevel: "Beginner", gamingPlatforms: [], favoriteGames: "", discordUsername: "", steamId: "", psnId: "", xboxLiveId: "" }); const { signUpWithCredentials } = useAuth(); const handleInputChange = (e)=>{ const { name, value } = e.target; setFormData((prev)=>({ ...prev, [name]: value })); }; const handlePlatformToggle = (platform)=>{ setFormData((prev)=>({ ...prev, gamingPlatforms: prev.gamingPlatforms.includes(platform) ? prev.gamingPlatforms.filter((p)=>p !== platform) : [ ...prev.gamingPlatforms, platform ] })); }; const onSubmit = async (e)=>{ e.preventDefault(); setLoading(true); setError(null); if (!formData.email || !formData.password || !formData.username) { setError("Please fill in all required fields"); setLoading(false); return; } try { // First create the auth account await signUpWithCredentials({ email: formData.email, password: formData.password, callbackUrl: "/", redirect: false }); // Then create the user profile const response = await fetch("/api/create_user", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ username: formData.username, email: formData.email, expertiseLevel: formData.expertiseLevel, gamingPlatforms: formData.gamingPlatforms, favoriteGames: formData.favoriteGames.split(",").map((game)=>game.trim()), discordUsername: formData.discordUsername, steamId: formData.steamId, psnId: formData.psnId, xboxLiveId: formData.xboxLiveId }) }); if (!response.ok) { throw new Error("Failed to create user profile"); } // Redirect to dashboard window.location.href = "/dashboard"; } catch (err) { const errorMessages = { OAuthSignin: "Couldn't start sign-up. Please try again or use a different method.", OAuthCallback: "Sign-up failed after redirecting. Please try again.", OAuthCreateAccount: "Couldn't create an account with this sign-up option. Try another one.", EmailCreateAccount: "This email can't be used. It may already be registered.", Callback: "Something went wrong during sign-up. Please try again.", OAuthAccountNotLinked: "This account is linked to a different sign-in method. Try using that instead.", CredentialsSignin: "Invalid email or password. If you already have an account, try signing in instead.", AccessDenied: "You don't have permission to sign up.", Configuration: "Sign-up isn't working right now. Please try again later.", Verification: "Your sign-up link has expired. Request a new one." }; setError(errorMessages[err.message] || "Something went wrong. Please try again."); setLoading(false); } }; const platforms = [ { id: "pc", label: "PC", icon: "fas fa-desktop" }, { id: "playstation", label: "PlayStation", icon: "fab fa-playstation" }, { id: "xbox", label: "Xbox", icon: "fab fa-xbox" }, { id: "nintendo", label: "Nintendo", icon: "fas fa-gamepad" }, { id: "mobile", label: "Mobile", icon: "fas fa-mobile-alt" } ]; const expertiseLevels = [ "Beginner", "Intermediate", "Advanced", "Expert" ]; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen w-full bg-[#1a1f3c] py-8 px-4", __source: { fileName: "", lineNumber: 121, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("form", { noValidate: true, onSubmit: onSubmit, className: "mx-auto max-w-4xl rounded-lg border-2 border-[#40F8C6] bg-[#1a1f3c]/70 p-8 backdrop-blur-sm", __source: { fileName: "", lineNumber: 122, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "mb-8 text-center font-mono text-4xl font-bold text-[#40F8C6]", __source: { fileName: "", lineNumber: 127, columnNumber: 9 }, __self: this }, "JOIN THE QUEST"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 gap-8 md:grid-cols-2", __source: { fileName: "", lineNumber: 131, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 133, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-mono text-xl font-bold text-[#40F8C6]", __source: { fileName: "", lineNumber: 134, columnNumber: 13 }, __self: this }, "Required Information"), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 138, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-mono text-sm font-medium text-[#40F8C6]", __source: { fileName: "", lineNumber: 139, columnNumber: 15 }, __self: this }, "Email *"), /*#__PURE__*/ React.createElement("input", { required: true, name: "email", type: "email", value: formData.email, onChange: handleInputChange, placeholder: "Enter your email", className: "w-full rounded-lg border-2 border-[#40F8C6] bg-[#1a1f3c]/50 px-4 py-3 font-mono text-white placeholder-gray-400 focus:border-[#3DE0B5] focus:outline-none focus:ring-1 focus:ring-[#3DE0B5]", __source: { fileName: "", lineNumber: 142, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 153, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-mono text-sm font-medium text-[#40F8C6]", __source: { fileName: "", lineNumber: 154, columnNumber: 15 }, __self: this }, "Password *"), /*#__PURE__*/ React.createElement("input", { required: true, name: "password", type: "password", value: formData.password, onChange: handleInputChange, placeholder: "Create a password", className: "w-full rounded-lg border-2 border-[#40F8C6] bg-[#1a1f3c]/50 px-4 py-3 font-mono text-white placeholder-gray-400 focus:border-[#3DE0B5] focus:outline-none focus:ring-1 focus:ring-[#3DE0B5]", __source: { fileName: "", lineNumber: 157, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 168, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-mono text-sm font-medium text-[#40F8C6]", __source: { fileName: "", lineNumber: 169, columnNumber: 15 }, __self: this }, "Username *"), /*#__PURE__*/ React.createElement("input", { required: true, name: "username", type: "text", value: formData.username, onChange: handleInputChange, placeholder: "Choose your username", className: "w-full rounded-lg border-2 border-[#40F8C6] bg-[#1a1f3c]/50 px-4 py-3 font-mono text-white placeholder-gray-400 focus:border-[#3DE0B5] focus:outline-none focus:ring-1 focus:ring-[#3DE0B5]", __source: { fileName: "", lineNumber: 172, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 183, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-mono text-sm font-medium text-[#40F8C6]", __source: { fileName: "", lineNumber: 184, columnNumber: 15 }, __self: this }, "Gaming Experience Level *"), /*#__PURE__*/ React.createElement("select", { name: "expertiseLevel", value: formData.expertiseLevel, onChange: handleInputChange, className: "w-full rounded-lg border-2 border-[#40F8C6] bg-[#1a1f3c]/50 px-4 py-3 font-mono text-white focus:border-[#3DE0B5] focus:outline-none focus:ring-1 focus:ring-[#3DE0B5]", __source: { fileName: "", lineNumber: 187, columnNumber: 15 }, __self: this }, expertiseLevels.map((level)=>/*#__PURE__*/ React.createElement("option", { key: level, value: level, className: "bg-[#1a1f3c]", __source: { fileName: "", lineNumber: 194, columnNumber: 19 }, __self: this }, level))))), /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 203, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-mono text-xl font-bold text-[#40F8C6]", __source: { fileName: "", lineNumber: 204, columnNumber: 13 }, __self: this }, "Gaming Profile"), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 208, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-mono text-sm font-medium text-[#40F8C6]", __source: { fileName: "", lineNumber: 209, columnNumber: 15 }, __self: this }, "Gaming Platforms"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-3", __source: { fileName: "", lineNumber: 212, columnNumber: 15 }, __self: this }, platforms.map((platform)=>/*#__PURE__*/ React.createElement("button", { key: platform.id, type: "button", onClick: ()=>handlePlatformToggle(platform.id), className: `flex items-center gap-2 rounded-lg border-2 px-4 py-2 font-mono transition-colors ${formData.gamingPlatforms.includes(platform.id) ? "border-[#40F8C6] bg-[#40F8C6] text-black" : "border-[#40F8C6] text-[#40F8C6] hover:bg-[#40F8C6] hover:text-black"}`, __source: { fileName: "", lineNumber: 214, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: platform.icon, __source: { fileName: "", lineNumber: 224, columnNumber: 21 }, __self: this }), platform.label)))), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 231, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-mono text-sm font-medium text-[#40F8C6]", __source: { fileName: "", lineNumber: 232, columnNumber: 15 }, __self: this }, "Favorite Games"), /*#__PURE__*/ React.createElement("input", { name: "favoriteGames", type: "text", value: formData.favoriteGames, onChange: handleInputChange, placeholder: "Enter games, separated by commas", className: "w-full rounded-lg border-2 border-[#40F8C6] bg-[#1a1f3c]/50 px-4 py-3 font-mono text-white placeholder-gray-400 focus:border-[#3DE0B5] focus:outline-none focus:ring-1 focus:ring-[#3DE0B5]", __source: { fileName: "", lineNumber: 235, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 245, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-mono text-sm font-medium text-[#40F8C6]", __source: { fileName: "", lineNumber: 246, columnNumber: 15 }, __self: this }, "Gaming Accounts"), /*#__PURE__*/ React.createElement("div", { className: "space-y-3", __source: { fileName: "", lineNumber: 250, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 251, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-discord text-[#40F8C6] text-xl", __source: { fileName: "", lineNumber: 252, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("input", { name: "discordUsername", type: "text", value: formData.discordUsername, onChange: handleInputChange, placeholder: "Discord Username", className: "w-full rounded-lg border-2 border-[#40F8C6] bg-[#1a1f3c]/50 px-4 py-2 font-mono text-white placeholder-gray-400 focus:border-[#3DE0B5] focus:outline-none focus:ring-1 focus:ring-[#3DE0B5]", __source: { fileName: "", lineNumber: 253, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 263, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-steam text-[#40F8C6] text-xl", __source: { fileName: "", lineNumber: 264, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("input", { name: "steamId", type: "text", value: formData.steamId, onChange: handleInputChange, placeholder: "Steam ID", className: "w-full rounded-lg border-2 border-[#40F8C6] bg-[#1a1f3c]/50 px-4 py-2 font-mono text-white placeholder-gray-400 focus:border-[#3DE0B5] focus:outline-none focus:ring-1 focus:ring-[#3DE0B5]", __source: { fileName: "", lineNumber: 265, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 275, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-playstation text-[#40F8C6] text-xl", __source: { fileName: "", lineNumber: 276, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("input", { name: "psnId", type: "text", value: formData.psnId, onChange: handleInputChange, placeholder: "PSN ID", className: "w-full rounded-lg border-2 border-[#40F8C6] bg-[#1a1f3c]/50 px-4 py-2 font-mono text-white placeholder-gray-400 focus:border-[#3DE0B5] focus:outline-none focus:ring-1 focus:ring-[#3DE0B5]", __source: { fileName: "", lineNumber: 277, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 287, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-xbox text-[#40F8C6] text-xl", __source: { fileName: "", lineNumber: 288, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("input", { name: "xboxLiveId", type: "text", value: formData.xboxLiveId, onChange: handleInputChange, placeholder: "Xbox Live ID", className: "w-full rounded-lg border-2 border-[#40F8C6] bg-[#1a1f3c]/50 px-4 py-2 font-mono text-white placeholder-gray-400 focus:border-[#3DE0B5] focus:outline-none focus:ring-1 focus:ring-[#3DE0B5]", __source: { fileName: "", lineNumber: 289, columnNumber: 19 }, __self: this })))))), error && /*#__PURE__*/ React.createElement("div", { className: "mt-6 rounded-lg bg-red-500/10 p-3 text-center font-mono text-sm text-red-500", __source: { fileName: "", lineNumber: 304, columnNumber: 11 }, __self: this }, error), /*#__PURE__*/ React.createElement("div", { className: "mt-8 space-y-4", __source: { fileName: "", lineNumber: 309, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: loading, className: "w-full rounded-lg bg-[#40F8C6] px-4 py-3 font-mono text-lg font-bold text-black transition-colors hover:bg-[#3DE0B5] focus:outline-none focus:ring-2 focus:ring-[#40F8C6] focus:ring-offset-2 disabled:opacity-50", __source: { fileName: "", lineNumber: 310, columnNumber: 11 }, __self: this }, loading ? "Creating Account..." : "Create Account"), /*#__PURE__*/ React.createElement("p", { className: "text-center font-mono text-sm text-gray-300", __source: { fileName: "", lineNumber: 318, columnNumber: 11 }, __self: this }, "Already have an account?", " ", /*#__PURE__*/ React.createElement("a", { href: `/account/signin${typeof window !== "undefined" ? window.location.search : ""}`, className: "text-[#40F8C6] hover:text-[#3DE0B5]", __source: { fileName: "", lineNumber: 320, columnNumber: 13 }, __self: this }, "Sign in"))))); }