function MainComponent() { const [selectedCategory, setSelectedCategory] = useState("music"); useEffect(()=>{ const link = document.createElement("link"); link.rel = "icon"; link.href = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ctext y='.9em' font-size='90'%3E🎵%3C/text%3E%3C/svg%3E"; document.head.appendChild(link); return ()=>document.head.removeChild(link); }, []); const categories = { latest: { title: "Latest Release: In a place they call Tulsa", url: "https://youtu.be/hlPsX9vxNCI", icon: "fa-compact-disc", color: "from-yellow-500 to-amber-500" }, live: { title: "JayceePEETV Live", url: "https://jayceepeetv.created.app/", icon: "fa-tv", color: "from-green-500 to-teal-500" }, ondemand: { title: "JayceePEETV On Demand", url: "https://jayceepeetv.vhx.tv/", icon: "fa-play", color: "from-orange-500 to-red-500" }, music: { title: "Music Playlist", url: "https://youtu.be/Qdpy5ZWq0gQ", icon: "fa-music", color: "from-pink-500 to-rose-500" }, podcast: { title: "Podcast Playlist", id: "PLKxeTm073DCq4fTz-yA50MGvmfqNJQJZJ", icon: "fa-microphone", color: "from-purple-500 to-indigo-500" }, holiday: { title: "Holiday Tracks", id: "PLKxeTm073DCo3aTzuIIF3TlSka2-K9Wog", icon: "fa-star", color: "from-amber-500 to-orange-500" } }; const handleJoinMeeting = ()=>{ if (meetingUrl) { window.open(meetingUrl, "_blank"); setShowJoinModal(false); setMeetingUrl(""); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-br from-[#0f172a] to-[#1e293b] text-white", __source: { fileName: "", lineNumber: 60, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-7xl mx-auto p-3 md:p-6", __source: { fileName: "", lineNumber: 61, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("nav", { className: "flex flex-col md:flex-row justify-between items-center mb-6 md:mb-12 backdrop-blur-sm bg-white/5 p-4 rounded-xl gap-4", __source: { fileName: "", lineNumber: 62, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-4", __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "https://play.google.com/store/apps/details?id=com.app.jayceepeegosepl&pcampaignid=web_share", target: "_blank", rel: "noopener noreferrer", className: "bg-gradient-to-r from-gray-500 to-slate-500 p-2 rounded-xl flex items-center justify-center hover:shadow-lg hover:shadow-gray-500/20 transition-all duration-200", __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-arrow-left text-white", __source: { fileName: "", lineNumber: 70, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 72, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-play-circle text-2xl text-rose-500", __source: { fileName: "", lineNumber: 73, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold font-roboto bg-gradient-to-r from-rose-500 to-pink-500 bg-clip-text text-transparent", __source: { fileName: "", lineNumber: 74, columnNumber: 15 }, __self: this }, "Video Platform"))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row gap-3 md:gap-4 w-full md:w-auto", __source: { fileName: "", lineNumber: 80, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "mailto:admin@fivestarsappsolutions.com?subject=Request%20Access%20to%20Live%20Sessions&body=I%20would%20like%20to%20request%20access%20to%20the%20live%20sessions.", className: "bg-gradient-to-r from-purple-500 to-pink-500 px-4 md:px-6 py-2 md:py-2.5 rounded-xl flex items-center justify-center gap-2 hover:shadow-lg hover:shadow-purple-500/20 transition-all duration-200 font-medium w-full md:w-auto", __source: { fileName: "", lineNumber: 81, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-envelope", __source: { fileName: "", lineNumber: 85, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-sm md:text-base", __source: { fileName: "", lineNumber: 86, columnNumber: 15 }, __self: this }, "Get Invited")), /*#__PURE__*/ React.createElement("a", { href: "https://goddessrantsliveshow.created.app/", target: "_blank", rel: "noopener noreferrer", className: "bg-gradient-to-r from-blue-500 to-cyan-500 px-4 md:px-6 py-2 md:py-2.5 rounded-xl flex items-center justify-center gap-2 hover:shadow-lg hover:shadow-blue-500/20 transition-all duration-200 font-medium w-full md:w-auto", __source: { fileName: "", lineNumber: 88, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-video", __source: { fileName: "", lineNumber: 94, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-sm md:text-base", __source: { fileName: "", lineNumber: 95, columnNumber: 15 }, __self: this }, "Join Live Podcast")), /*#__PURE__*/ React.createElement("a", { href: "https://goddessrantsforum.created.app/", target: "_blank", rel: "noopener noreferrer", className: "bg-gradient-to-r from-green-500 to-emerald-500 px-4 md:px-6 py-2 md:py-2.5 rounded-xl flex items-center justify-center gap-2 hover:shadow-lg hover:shadow-green-500/20 transition-all duration-200 font-medium w-full md:w-auto", __source: { fileName: "", lineNumber: 97, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-comments", __source: { fileName: "", lineNumber: 103, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-sm md:text-base", __source: { fileName: "", lineNumber: 104, columnNumber: 15 }, __self: this }, "Chat")))), /*#__PURE__*/ React.createElement("div", { className: "backdrop-blur-sm bg-gradient-to-r from-amber-500/20 to-orange-500/20 border border-amber-500/30 p-4 md:p-6 rounded-xl mb-8 shadow-2xl", __source: { fileName: "", lineNumber: 110, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row items-center gap-6", __source: { fileName: "", lineNumber: 111, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-shrink-0", __source: { fileName: "", lineNumber: 112, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/2240ac55-e0a1-4209-af39-1d71d6e05423/-/format/auto/", alt: "Tik Tok Album Cover", className: "w-32 h-32 md:w-40 md:h-40 rounded-xl shadow-lg object-cover", __source: { fileName: "", lineNumber: 113, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex-1 text-center md:text-left", __source: { fileName: "", lineNumber: 119, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-2", __source: { fileName: "", lineNumber: 120, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "bg-gradient-to-r from-amber-400 to-orange-400 text-black px-3 py-1 rounded-full text-sm font-bold uppercase tracking-wide", __source: { fileName: "", lineNumber: 121, columnNumber: 17 }, __self: this }, "🔥 NEW RELEASE")), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl md:text-3xl font-bold bg-gradient-to-r from-amber-400 to-orange-400 bg-clip-text text-transparent mb-2", __source: { fileName: "", lineNumber: 125, columnNumber: 15 }, __self: this }, "Tik Tok Album Fall Drop 25"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-300 mb-4", __source: { fileName: "", lineNumber: 128, columnNumber: 15 }, __self: this }, 'The latest album featuring 8 tracks including "Awa mu li", "Tik Tok", and "Flow Through Me"'), /*#__PURE__*/ React.createElement("a", { href: "https://soundcloud.com/jayceepeemusic/sets/tik-tok-album-fall-drop-25?si=6ecd7054121e4ec287b69f6884b54a5f&utm_source=clipboard&utm_medium=text&utm_campaign=social_sharing", target: "_blank", rel: "noopener noreferrer", className: "bg-gradient-to-r from-amber-500 to-orange-500 px-6 py-3 rounded-xl flex items-center justify-center gap-2 hover:shadow-lg hover:shadow-amber-500/20 transition-all duration-200 font-medium inline-flex", __source: { fileName: "", lineNumber: 132, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-soundcloud", __source: { fileName: "", lineNumber: 138, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 139, columnNumber: 17 }, __self: this }, "Listen on SoundCloud"))))), /*#__PURE__*/ React.createElement("div", { className: "backdrop-blur-sm bg-white/5 p-4 md:p-6 rounded-xl mb-8", __source: { fileName: "", lineNumber: 145, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2 mb-4 md:mb-6 text-gray-300", __source: { fileName: "", lineNumber: 146, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-info-circle text-blue-400", __source: { fileName: "", lineNumber: 147, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-sm md:text-base", __source: { fileName: "", lineNumber: 148, columnNumber: 13 }, __self: this }, "Select a category below to explore our curated playlists")), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-4 gap-3 md:gap-4 mb-6 md:mb-8", __source: { fileName: "", lineNumber: 152, columnNumber: 11 }, __self: this }, Object.entries(categories).map(([key, category])=>key === "live" || key === "ondemand" || key === "latest" ? /*#__PURE__*/ React.createElement("div", { key: key, className: "flex flex-col", __source: { fileName: "", lineNumber: 155, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: category.url, target: "_blank", rel: "noopener noreferrer", className: `p-4 rounded-xl flex items-center gap-3 transition-all duration-200 bg-gradient-to-r ${category.color} shadow-lg`, __source: { fileName: "", lineNumber: 156, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${category.icon} text-white`, __source: { fileName: "", lineNumber: 162, columnNumber: 21 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-medium text-white", __source: { fileName: "", lineNumber: 163, columnNumber: 21 }, __self: this }, category.title)), key === "live" && /*#__PURE__*/ React.createElement("div", { className: "mt-2 text-center", __source: { fileName: "", lineNumber: 168, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-mono text-lg font-bold bg-gradient-to-r from-pink-500 to-red-500 bg-clip-text text-transparent live-pulse", __source: { fileName: "", lineNumber: 169, columnNumber: 23 }, __self: this }, "NOW LIVE"))) : /*#__PURE__*/ React.createElement("button", { key: key, onClick: ()=>setSelectedCategory(key), className: `p-4 rounded-xl flex items-center gap-3 transition-all duration-200 ${selectedCategory === key ? `bg-gradient-to-r ${category.color} shadow-lg` : "bg-white/5 hover:bg-white/10"}`, __source: { fileName: "", lineNumber: 176, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${category.icon} ${selectedCategory === key ? "text-white" : "text-gray-400"}`, __source: { fileName: "", lineNumber: 186, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: selectedCategory === key ? "font-medium" : "text-gray-400", __source: { fileName: "", lineNumber: 189, columnNumber: 19 }, __self: this }, category.title)))), /*#__PURE__*/ React.createElement("div", { className: "rounded-xl overflow-hidden shadow-2xl", __source: { fileName: "", lineNumber: 200, columnNumber: 11 }, __self: this }, selectedCategory === "latest" ? /*#__PURE__*/ React.createElement("iframe", { src: "https://www.youtube.com/embed/hlPsX9vxNCI", title: "In a place they call Tulsa", className: "w-full aspect-video", allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture", allowFullScreen: true, __source: { fileName: "", lineNumber: 202, columnNumber: 15 }, __self: this }) : selectedCategory === "live" ? /*#__PURE__*/ React.createElement("iframe", { src: "https://www.youtube.com/embed/nFvKOsaJiN0?si=wHkaigzE8kDidr8W", title: "JayceePEETV Live", className: "w-full aspect-video", allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture", allowFullScreen: true, __source: { fileName: "", lineNumber: 210, columnNumber: 15 }, __self: this }) : selectedCategory === "music" ? /*#__PURE__*/ React.createElement("iframe", { src: "https://www.youtube.com/embed/hlPsX9vxNCI", title: "In a place they call Tulsa", className: "w-full aspect-video", allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture", allowFullScreen: true, __source: { fileName: "", lineNumber: 218, columnNumber: 15 }, __self: this }) : /*#__PURE__*/ React.createElement("iframe", { src: `https://www.youtube.com/embed/videoseries?list=${categories[selectedCategory].id}`, title: categories[selectedCategory].title, className: "w-full aspect-video", allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture", allowFullScreen: true, __source: { fileName: "", lineNumber: 226, columnNumber: 15 }, __self: this })))), /*#__PURE__*/ React.createElement("footer", { className: "text-center py-6 backdrop-blur-sm bg-white/5", __source: { fileName: "", lineNumber: 238, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-gray-400", __source: { fileName: "", lineNumber: 239, columnNumber: 9 }, __self: this }, "© 2024 Powered by", " ", /*#__PURE__*/ React.createElement("a", { href: "https://www.fivestarsappsolutions.com/", target: "_blank", rel: "noopener noreferrer", className: "font-medium bg-gradient-to-r from-rose-500 to-pink-500 bg-clip-text text-transparent hover:opacity-80 transition-opacity", __source: { fileName: "", lineNumber: 241, columnNumber: 11 }, __self: this }, "Five Stars App Solutions AI Builder"))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 252, columnNumber: 7 }, __self: this }, ` @keyframes pulse { 0% { opacity: 1; } 50% { opacity: 0.5; } 100% { opacity: 1; } } .live-pulse { animation: pulse 2s infinite; } `)); }