function MainComponent() { const [user, setUser] = useState(null); const [showLoginModal, setShowLoginModal] = useState(true); const [invitationCode, setInvitationCode] = useState(""); const [username, setUsername] = useState(""); const [error, setError] = useState(""); const [loading, setLoading] = useState(false); const [notifications, setNotifications] = useState([]); const addNotification = React.useCallback((message, type = "info")=>{ const notification = { id: Date.now(), message, type, timestamp: new Date() }; setNotifications((prev)=>[ ...prev, notification ]); setTimeout(()=>{ setNotifications((prev)=>prev.filter((n)=>n.id !== notification.id)); }, 5000); }, []); React.useEffect(()=>{ if (typeof window !== "undefined") { try { const savedUser = localStorage.getItem("roofgarden_user"); if (savedUser) { const userData = JSON.parse(savedUser); setUser(userData); setShowLoginModal(false); addNotification(`🏠 Welcome back, ${userData.username}!`, "success"); } } catch (error) { console.error("Error loading user data:", error); localStorage.removeItem("roofgarden_user"); } } }, [ addNotification ]); React.useEffect(()=>{ if (typeof window !== "undefined" && user) { localStorage.setItem("roofgarden_user", JSON.stringify(user)); } }, [ user ]); const handleLogin = async ()=>{ if (!username.trim()) { setError("Please enter your username"); return; } if (!invitationCode.trim()) { setError("Please enter an invitation code"); return; } setLoading(true); setError(""); try { const response = await fetch("/api/use-invitation-code", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ username: username.trim(), invitationCode: invitationCode.trim() }) }); if (!response.ok) { const errorData = await response.json(); throw new Error(errorData.error || "Failed to use invitation code"); } const userData = await response.json(); setUser(userData); setShowLoginModal(false); addNotification(`🎉 Welcome to rOOFGARDEN, ${userData.username}!`, "success"); } catch (error) { console.error("Login error:", error); setError(error.message); } finally{ setLoading(false); } }; const handleLogout = ()=>{ setUser(null); setShowLoginModal(true); setUsername(""); setInvitationCode(""); setError(""); if (typeof window !== "undefined") { localStorage.removeItem("roofgarden_user"); } addNotification("👋 Logged out successfully", "info"); }; if (showLoginModal) { return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen relative overflow-hidden bg-black", __source: { fileName: "", lineNumber: 105, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-cover bg-center bg-no-repeat opacity-30", style: { backgroundImage: "url(https://ucarecdn.com/be80212b-fb71-4d65-b522-95e68621d300/)" }, __source: { fileName: "", lineNumber: 106, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "relative z-10 min-h-screen flex items-center justify-center p-4", __source: { fileName: "", lineNumber: 114, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black bg-opacity-90 p-8 rounded-2xl border border-green-500 max-w-md w-full", __source: { fileName: "", lineNumber: 115, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center mb-8", __source: { fileName: "", lineNumber: 116, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-5xl mb-4", __source: { fileName: "", lineNumber: 117, columnNumber: 15 }, __self: this }, "🏠"), /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold text-white mb-2", __source: { fileName: "", lineNumber: 118, columnNumber: 15 }, __self: this }, "rOOFGARDEN"), /*#__PURE__*/ React.createElement("p", { className: "text-green-400 text-lg", __source: { fileName: "", lineNumber: 119, columnNumber: 15 }, __self: this }, "Live Concert Platform"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 text-sm mt-2", __source: { fileName: "", lineNumber: 120, columnNumber: 15 }, __self: this }, "Enter your invitation code to join")), error && /*#__PURE__*/ React.createElement("div", { className: "bg-red-900 border border-red-500 text-red-200 p-3 rounded-lg mb-4 text-sm", __source: { fileName: "", lineNumber: 126, columnNumber: 15 }, __self: this }, error), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 131, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 132, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-300 text-sm font-semibold mb-2", __source: { fileName: "", lineNumber: 133, columnNumber: 17 }, __self: this }, "Username"), /*#__PURE__*/ React.createElement("input", { type: "text", value: username, onChange: (e)=>setUsername(e.target.value), placeholder: "Enter your username", className: "w-full bg-gray-800 text-white p-3 rounded-lg border border-gray-600 focus:border-green-500 focus:outline-none", disabled: loading, __source: { fileName: "", lineNumber: 136, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 146, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-300 text-sm font-semibold mb-2", __source: { fileName: "", lineNumber: 147, columnNumber: 17 }, __self: this }, "Invitation Code"), /*#__PURE__*/ React.createElement("input", { type: "text", value: invitationCode, onChange: (e)=>setInvitationCode(e.target.value), placeholder: "Enter invitation code", className: "w-full bg-gray-800 text-white p-3 rounded-lg border border-gray-600 focus:border-green-500 focus:outline-none", disabled: loading, onKeyPress: (e)=>e.key === "Enter" && handleLogin(), __source: { fileName: "", lineNumber: 150, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: handleLogin, disabled: loading || !username.trim() || !invitationCode.trim(), className: "w-full bg-gradient-to-r from-green-600 to-emerald-600 text-white py-3 px-4 rounded-lg font-semibold hover:from-green-700 hover:to-emerald-700 transition-all duration-300 disabled:opacity-50 disabled:cursor-not-allowed", __source: { fileName: "", lineNumber: 161, columnNumber: 15 }, __self: this }, loading ? "Joining..." : "Join rOOFGARDEN")), /*#__PURE__*/ React.createElement("div", { className: "mt-6 text-center", __source: { fileName: "", lineNumber: 170, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 text-xs", __source: { fileName: "", lineNumber: 171, columnNumber: 15 }, __self: this }, "Need an invitation code? Contact an admin"))))); } return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen relative overflow-hidden bg-black", __source: { fileName: "", lineNumber: 182, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-cover bg-center bg-no-repeat opacity-20", style: { backgroundImage: "url(https://ucarecdn.com/be80212b-fb71-4d65-b522-95e68621d300/)" }, __source: { fileName: "", lineNumber: 183, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "fixed top-4 right-4 z-50 space-y-2", __source: { fileName: "", lineNumber: 191, columnNumber: 7 }, __self: this }, notifications.map((notification)=>/*#__PURE__*/ React.createElement("div", { key: notification.id, className: `p-3 rounded-lg border text-white text-sm max-w-sm animate-pulse ${notification.type === "success" ? "bg-green-900 border-green-500" : notification.type === "error" ? "bg-red-900 border-red-500" : "bg-gray-900 border-gray-500"}`, __source: { fileName: "", lineNumber: 193, columnNumber: 11 }, __self: this }, notification.message))), /*#__PURE__*/ React.createElement("div", { className: "relative z-10 bg-black bg-opacity-90 p-4 border-b border-green-500", __source: { fileName: "", lineNumber: 208, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between flex-wrap gap-4", __source: { fileName: "", lineNumber: 209, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-4", __source: { fileName: "", lineNumber: 210, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-3xl", __source: { fileName: "", lineNumber: 211, columnNumber: 13 }, __self: this }, "🏠"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 212, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-white", __source: { fileName: "", lineNumber: 213, columnNumber: 15 }, __self: this }, "rOOFGARDEN"), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-green-400", __source: { fileName: "", lineNumber: 214, columnNumber: 15 }, __self: this }, "Live Concert Platform"))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-4", __source: { fileName: "", lineNumber: 218, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-white text-sm", __source: { fileName: "", lineNumber: 219, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-green-400", __source: { fileName: "", lineNumber: 220, columnNumber: 15 }, __self: this }, "👤"), " ", user?.username, user?.user_role === "root" && /*#__PURE__*/ React.createElement("span", { className: "text-purple-400 ml-1", __source: { fileName: "", lineNumber: 222, columnNumber: 17 }, __self: this }, "👑"), user?.user_role === "vip" && /*#__PURE__*/ React.createElement("span", { className: "text-yellow-400 ml-1", __source: { fileName: "", lineNumber: 225, columnNumber: 17 }, __self: this }, "⭐")), user?.user_role === "root" && /*#__PURE__*/ React.createElement("a", { href: "/admin", className: "bg-purple-600 hover:bg-purple-700 text-white px-4 py-2 rounded-lg font-semibold transition-all duration-300", __source: { fileName: "", lineNumber: 230, columnNumber: 15 }, __self: this }, "Admin Panel"), /*#__PURE__*/ React.createElement("a", { href: "/live", className: "bg-green-600 hover:bg-green-700 text-white px-4 py-2 rounded-lg font-semibold transition-all duration-300", __source: { fileName: "", lineNumber: 238, columnNumber: 13 }, __self: this }, "🎵 Live Concert"), /*#__PURE__*/ React.createElement("button", { onClick: handleLogout, className: "bg-red-600 hover:bg-red-700 text-white px-3 py-2 rounded-lg font-semibold transition-all duration-300", __source: { fileName: "", lineNumber: 245, columnNumber: 13 }, __self: this }, "Logout")))), /*#__PURE__*/ React.createElement("div", { className: "relative z-10 p-6", __source: { fileName: "", lineNumber: 255, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 256, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-gradient-to-b from-green-900 to-black rounded-2xl p-8 border border-green-500 text-center mb-8", __source: { fileName: "", lineNumber: 257, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-6xl mb-4", __source: { fileName: "", lineNumber: 258, columnNumber: 13 }, __self: this }, "🎵"), /*#__PURE__*/ React.createElement("h2", { className: "text-3xl font-bold text-white mb-4", __source: { fileName: "", lineNumber: 259, columnNumber: 13 }, __self: this }, "Welcome to rOOFGARDEN"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-300 text-lg mb-6", __source: { fileName: "", lineNumber: 262, columnNumber: 13 }, __self: this }, "Your exclusive live concert experience awaits"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4 mt-8", __source: { fileName: "", lineNumber: 266, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-black bg-opacity-50 p-6 rounded-lg", __source: { fileName: "", lineNumber: 267, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-green-400 text-3xl mb-3", __source: { fileName: "", lineNumber: 268, columnNumber: 17 }, __self: this }, "🎤"), /*#__PURE__*/ React.createElement("h3", { className: "text-white font-bold mb-2", __source: { fileName: "", lineNumber: 269, columnNumber: 17 }, __self: this }, "Live Performances"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 text-sm", __source: { fileName: "", lineNumber: 270, columnNumber: 17 }, __self: this }, "Experience intimate live concerts from talented artists")), /*#__PURE__*/ React.createElement("div", { className: "bg-black bg-opacity-50 p-6 rounded-lg", __source: { fileName: "", lineNumber: 275, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-purple-400 text-3xl mb-3", __source: { fileName: "", lineNumber: 276, columnNumber: 17 }, __self: this }, "💬"), /*#__PURE__*/ React.createElement("h3", { className: "text-white font-bold mb-2", __source: { fileName: "", lineNumber: 277, columnNumber: 17 }, __self: this }, "Interactive Chat"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 text-sm", __source: { fileName: "", lineNumber: 278, columnNumber: 17 }, __self: this }, "Connect with other music lovers during performances")), /*#__PURE__*/ React.createElement("div", { className: "bg-black bg-opacity-50 p-6 rounded-lg", __source: { fileName: "", lineNumber: 283, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-blue-400 text-3xl mb-3", __source: { fileName: "", lineNumber: 284, columnNumber: 17 }, __self: this }, "⭐"), /*#__PURE__*/ React.createElement("h3", { className: "text-white font-bold mb-2", __source: { fileName: "", lineNumber: 285, columnNumber: 17 }, __self: this }, "Exclusive Access"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 text-sm", __source: { fileName: "", lineNumber: 286, columnNumber: 17 }, __self: this }, "VIP features and special events for community members")))), /*#__PURE__*/ React.createElement("div", { className: "bg-black bg-opacity-60 rounded-2xl p-6 border border-gray-700 mb-8", __source: { fileName: "", lineNumber: 293, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-bold text-white mb-4", __source: { fileName: "", lineNumber: 294, columnNumber: 13 }, __self: this }, "👤 Your Profile"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", __source: { fileName: "", lineNumber: 298, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-3", __source: { fileName: "", lineNumber: 299, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 300, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-300", __source: { fileName: "", lineNumber: 301, columnNumber: 19 }, __self: this }, "Username:"), /*#__PURE__*/ React.createElement("span", { className: "text-white font-semibold", __source: { fileName: "", lineNumber: 302, columnNumber: 19 }, __self: this }, user?.username)), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 307, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-300", __source: { fileName: "", lineNumber: 308, columnNumber: 19 }, __self: this }, "Role:"), /*#__PURE__*/ React.createElement("span", { className: `font-semibold ${user?.user_role === "root" ? "text-purple-400" : user?.user_role === "vip" ? "text-yellow-400" : "text-green-400"}`, __source: { fileName: "", lineNumber: 309, columnNumber: 19 }, __self: this }, user?.user_role === "root" ? "👑 Root" : user?.user_role === "vip" ? "⭐ VIP" : "👤 Regular")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 326, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-300", __source: { fileName: "", lineNumber: 327, columnNumber: 19 }, __self: this }, "Member Since:"), /*#__PURE__*/ React.createElement("span", { className: "text-white font-semibold", __source: { fileName: "", lineNumber: 328, columnNumber: 19 }, __self: this }, user?.created_at ? new Date(user.created_at).toLocaleDateString() : "Today"))), /*#__PURE__*/ React.createElement("div", { className: "space-y-3", __source: { fileName: "", lineNumber: 336, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 337, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-300", __source: { fileName: "", lineNumber: 338, columnNumber: 19 }, __self: this }, "Status:"), /*#__PURE__*/ React.createElement("span", { className: "text-green-400 font-semibold", __source: { fileName: "", lineNumber: 339, columnNumber: 19 }, __self: this }, "🟢 Active")), user?.user_role === "vip" && /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 345, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-300", __source: { fileName: "", lineNumber: 346, columnNumber: 21 }, __self: this }, "Tribune Access:"), /*#__PURE__*/ React.createElement("span", { className: "text-yellow-400 font-semibold", __source: { fileName: "", lineNumber: 347, columnNumber: 21 }, __self: this }, "✅ Available")), user?.user_role === "root" && /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 354, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-300", __source: { fileName: "", lineNumber: 355, columnNumber: 21 }, __self: this }, "Admin Access:"), /*#__PURE__*/ React.createElement("span", { className: "text-purple-400 font-semibold", __source: { fileName: "", lineNumber: 356, columnNumber: 21 }, __self: this }, "👑 Full Access"))))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", __source: { fileName: "", lineNumber: 365, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/live", className: "bg-gradient-to-r from-green-600 to-emerald-600 rounded-2xl p-6 border border-green-500 hover:from-green-700 hover:to-emerald-700 transition-all duration-300 transform hover:scale-105 text-center block", __source: { fileName: "", lineNumber: 366, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-4xl mb-3", __source: { fileName: "", lineNumber: 370, columnNumber: 15 }, __self: this }, "🎵"), /*#__PURE__*/ React.createElement("h3", { className: "text-white font-bold text-lg mb-2", __source: { fileName: "", lineNumber: 371, columnNumber: 15 }, __self: this }, "Join Live Concert"), /*#__PURE__*/ React.createElement("p", { className: "text-green-100 text-sm", __source: { fileName: "", lineNumber: 374, columnNumber: 15 }, __self: this }, "Experience live music performances")), user?.user_role === "root" && /*#__PURE__*/ React.createElement("a", { href: "/admin", className: "bg-gradient-to-r from-purple-600 to-indigo-600 rounded-2xl p-6 border border-purple-500 hover:from-purple-700 hover:to-indigo-700 transition-all duration-300 transform hover:scale-105 text-center block", __source: { fileName: "", lineNumber: 380, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-4xl mb-3", __source: { fileName: "", lineNumber: 384, columnNumber: 17 }, __self: this }, "👑"), /*#__PURE__*/ React.createElement("h3", { className: "text-white font-bold text-lg mb-2", __source: { fileName: "", lineNumber: 385, columnNumber: 17 }, __self: this }, "Admin Panel"), /*#__PURE__*/ React.createElement("p", { className: "text-purple-100 text-sm", __source: { fileName: "", lineNumber: 388, columnNumber: 17 }, __self: this }, "Manage users and system settings")), /*#__PURE__*/ React.createElement("a", { href: "/docs", className: "bg-gradient-to-r from-blue-600 to-cyan-600 rounded-2xl p-6 border border-blue-500 hover:from-blue-700 hover:to-cyan-700 transition-all duration-300 transform hover:scale-105 text-center block", __source: { fileName: "", lineNumber: 394, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-4xl mb-3", __source: { fileName: "", lineNumber: 398, columnNumber: 15 }, __self: this }, "📚"), /*#__PURE__*/ React.createElement("h3", { className: "text-white font-bold text-lg mb-2", __source: { fileName: "", lineNumber: 399, columnNumber: 15 }, __self: this }, "Documentation"), /*#__PURE__*/ React.createElement("p", { className: "text-blue-100 text-sm", __source: { fileName: "", lineNumber: 402, columnNumber: 15 }, __self: this }, "Learn how to use rOOFGARDEN"))))), /*#__PURE__*/ React.createElement("div", { className: "relative z-10 bg-black bg-opacity-90 p-4 border-t border-green-500 mt-8", __source: { fileName: "", lineNumber: 410, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 411, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-xs text-gray-400", __source: { fileName: "", lineNumber: 412, columnNumber: 11 }, __self: this }, "POWERED BY pEYMAN")))); }