function MainComponent() { const [activeTab, setActiveTab] = React.useState("courses"); const [selectedCourse, setSelectedCourse] = React.useState(null); const [selectedLesson, setSelectedLesson] = React.useState(null); const [userProgress, setUserProgress] = React.useState({}); const [loading, setLoading] = React.useState(true); React.useEffect(()=>{ loadAcademyData(); }, []); const loadAcademyData = async ()=>{ setLoading(true); try { // Mock data for academy content setUserProgress({ completedLessons: [ 1, 2, 5, 8 ], currentCourse: 1, totalPoints: 1250, level: "Intermediate" }); } catch (error) { console.error("Error loading academy data:", error); } finally{ setLoading(false); } }; const courses = [ { id: 1, title: "AI Art Fundamentals", description: "Master the basics of AI art generation with comprehensive guides", level: "Beginner", duration: "4 hours", lessons: 12, completed: 8, instructor: "Sarah Chen", rating: 4.9, students: 15420, thumbnail: "https://picsum.photos/300/200?random=1", category: "Fundamentals" }, { id: 2, title: "Midjourney Mastery", description: "Advanced techniques for creating stunning art with Midjourney", level: "Intermediate", duration: "6 hours", lessons: 18, completed: 0, instructor: "Alex Rodriguez", rating: 4.8, students: 12890, thumbnail: "https://picsum.photos/300/200?random=2", category: "Model-Specific" }, { id: 3, title: "FLUX Pro Techniques", description: "Professional workflows and advanced prompting for FLUX", level: "Advanced", duration: "8 hours", lessons: 24, completed: 3, instructor: "Maria Santos", rating: 4.9, students: 8750, thumbnail: "https://picsum.photos/300/200?random=3", category: "Model-Specific" }, { id: 4, title: "Stable Diffusion Deep Dive", description: "Complete guide to Stable Diffusion from basics to advanced", level: "Intermediate", duration: "10 hours", lessons: 30, completed: 0, instructor: "David Kim", rating: 4.7, students: 11200, thumbnail: "https://picsum.photos/300/200?random=4", category: "Model-Specific" } ]; const tutorials = [ { id: 1, title: "Perfect Portrait Prompts", description: "Learn to create stunning portrait prompts that work every time", duration: "15 min", difficulty: "Beginner", views: 45200, likes: 3420, thumbnail: "https://picsum.photos/400/250?random=5", category: "Prompting" }, { id: 2, title: "Lighting Techniques in AI Art", description: "Master lighting prompts for dramatic and professional results", duration: "22 min", difficulty: "Intermediate", views: 32100, likes: 2890, thumbnail: "https://picsum.photos/400/250?random=6", category: "Techniques" }, { id: 3, title: "Character Consistency Guide", description: "Create consistent characters across multiple generations", duration: "18 min", difficulty: "Advanced", views: 28750, likes: 2340, thumbnail: "https://picsum.photos/400/250?random=7", category: "Advanced" }, { id: 4, title: "Style Transfer Mastery", description: "Apply any artistic style to your AI-generated images", duration: "25 min", difficulty: "Intermediate", views: 19800, likes: 1890, thumbnail: "https://picsum.photos/400/250?random=8", category: "Techniques" } ]; const guides = [ { id: 1, title: "Getting Started with AI Art", description: "Complete beginner's guide to AI art generation", readTime: "10 min read", category: "Beginner", author: "PromptHero Team", publishedAt: "2 days ago" }, { id: 2, title: "Understanding Prompt Engineering", description: "Deep dive into the art and science of prompt writing", readTime: "15 min read", category: "Fundamentals", author: "Sarah Chen", publishedAt: "1 week ago" }, { id: 3, title: "Model Comparison Guide 2025", description: "Compare features, strengths, and use cases of popular AI models", readTime: "20 min read", category: "Reference", author: "Alex Rodriguez", publishedAt: "3 days ago" }, { id: 4, title: "Advanced Negative Prompting", description: "Master negative prompts to avoid unwanted elements", readTime: "12 min read", category: "Advanced", author: "Maria Santos", publishedAt: "5 days ago" } ]; const interactiveLessons = [ { id: 1, title: "Prompt Builder Workshop", description: "Interactive tool to build and test prompts in real-time", type: "Interactive", duration: "30 min", difficulty: "Beginner", participants: 8920 }, { id: 2, title: "Style Mixing Lab", description: "Experiment with combining different artistic styles", type: "Lab", duration: "45 min", difficulty: "Intermediate", participants: 5670 }, { id: 3, title: "Composition Challenge", description: "Practice composition techniques with guided exercises", type: "Challenge", duration: "60 min", difficulty: "Advanced", participants: 3420 } ]; const tabs = [ { key: "courses", label: "Courses", icon: "fas fa-play-circle" }, { key: "tutorials", label: "Tutorials", icon: "fas fa-video" }, { key: "guides", label: "Guides", icon: "fas fa-book" }, { key: "interactive", label: "Interactive", icon: "fas fa-gamepad" } ]; const getLevelColor = (level)=>{ switch(level){ case "Beginner": return "bg-green-600"; case "Intermediate": return "bg-yellow-600"; case "Advanced": return "bg-red-600"; default: return "bg-gray-600"; } }; const getProgressPercentage = (completed, total)=>{ return Math.round(completed / total * 100); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-black text-white font-inter", __source: { fileName: "", lineNumber: 234, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "bg-white text-black px-4 py-3 flex items-center justify-between", __source: { fileName: "", lineNumber: 236, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-6", __source: { fileName: "", lineNumber: 237, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "flex items-center space-x-2", __source: { fileName: "", lineNumber: 238, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-6 h-6 bg-black rounded", __source: { fileName: "", lineNumber: 239, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-xl font-bold", __source: { fileName: "", lineNumber: 240, columnNumber: 13 }, __self: this }, "PromptHero")), /*#__PURE__*/ React.createElement("a", { href: "/community", className: "flex items-center space-x-1 text-sm hover:text-black", __source: { fileName: "", lineNumber: 242, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-users text-gray-500", __source: { fileName: "", lineNumber: 246, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-gray-500", __source: { fileName: "", lineNumber: 247, columnNumber: 13 }, __self: this }, "Community")), /*#__PURE__*/ React.createElement("a", { href: "/academy", className: "flex items-center space-x-1 text-sm font-medium", __source: { fileName: "", lineNumber: 249, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-graduation-cap text-black", __source: { fileName: "", lineNumber: 253, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-black", __source: { fileName: "", lineNumber: 254, columnNumber: 13 }, __self: this }, "Academy"), /*#__PURE__*/ React.createElement("span", { className: "bg-yellow-400 text-black px-2 py-0.5 rounded text-xs font-bold", __source: { fileName: "", lineNumber: 255, columnNumber: 13 }, __self: this }, "NEW")), /*#__PURE__*/ React.createElement("a", { href: "/create", className: "flex items-center space-x-1 text-sm hover:text-black", __source: { fileName: "", lineNumber: 259, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-plus text-gray-500", __source: { fileName: "", lineNumber: 263, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-gray-500", __source: { fileName: "", lineNumber: 264, columnNumber: 13 }, __self: this }, "Create"))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-3", __source: { fileName: "", lineNumber: 267, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "text-gray-600 hover:text-black", __source: { fileName: "", lineNumber: 268, columnNumber: 11 }, __self: this }, "Log in"), /*#__PURE__*/ React.createElement("button", { className: "bg-black text-white px-4 py-2 rounded hover:bg-gray-800", __source: { fileName: "", lineNumber: 269, columnNumber: 11 }, __self: this }, "Sign Up"))), /*#__PURE__*/ React.createElement("div", { className: "bg-gradient-to-r from-purple-900 to-blue-900 px-6 py-12", __source: { fileName: "", lineNumber: 276, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto text-center", __source: { fileName: "", lineNumber: 277, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl md:text-6xl font-bold mb-4", __source: { fileName: "", lineNumber: 278, columnNumber: 11 }, __self: this }, "Master AI Art Generation"), /*#__PURE__*/ React.createElement("p", { className: "text-xl text-gray-300 mb-8 max-w-3xl mx-auto", __source: { fileName: "", lineNumber: 281, columnNumber: 11 }, __self: this }, "Learn from industry experts with comprehensive courses, tutorials, and interactive lessons. From beginner basics to advanced techniques."), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row items-center justify-center space-y-4 md:space-y-0 md:space-x-8", __source: { fileName: "", lineNumber: 286, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 287, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-3xl font-bold text-yellow-400", __source: { fileName: "", lineNumber: 288, columnNumber: 15 }, __self: this }, "50+"), /*#__PURE__*/ React.createElement("div", { className: "text-gray-300", __source: { fileName: "", lineNumber: 289, columnNumber: 15 }, __self: this }, "Courses")), /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 291, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-3xl font-bold text-green-400", __source: { fileName: "", lineNumber: 292, columnNumber: 15 }, __self: this }, "200+"), /*#__PURE__*/ React.createElement("div", { className: "text-gray-300", __source: { fileName: "", lineNumber: 293, columnNumber: 15 }, __self: this }, "Tutorials")), /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 295, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-3xl font-bold text-blue-400", __source: { fileName: "", lineNumber: 296, columnNumber: 15 }, __self: this }, "25k+"), /*#__PURE__*/ React.createElement("div", { className: "text-gray-300", __source: { fileName: "", lineNumber: 297, columnNumber: 15 }, __self: this }, "Students"))))), !loading && /*#__PURE__*/ React.createElement("div", { className: "bg-gray-900 px-6 py-4", __source: { fileName: "", lineNumber: 305, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto flex items-center justify-between", __source: { fileName: "", lineNumber: 306, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-6", __source: { fileName: "", lineNumber: 307, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-2", __source: { fileName: "", lineNumber: 308, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user-circle text-2xl text-orange-500", __source: { fileName: "", lineNumber: 309, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 310, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-medium", __source: { fileName: "", lineNumber: 311, columnNumber: 19 }, __self: this }, "Welcome back!"), /*#__PURE__*/ React.createElement("div", { className: "text-sm text-gray-400", __source: { fileName: "", lineNumber: 312, columnNumber: 19 }, __self: this }, "Level: ", userProgress.level))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-2", __source: { fileName: "", lineNumber: 317, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-star text-yellow-500", __source: { fileName: "", lineNumber: 318, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 319, columnNumber: 17 }, __self: this }, userProgress.totalPoints, " points"))), /*#__PURE__*/ React.createElement("div", { className: "text-sm text-gray-400", __source: { fileName: "", lineNumber: 322, columnNumber: 13 }, __self: this }, userProgress.completedLessons.length, " lessons completed"))), /*#__PURE__*/ React.createElement("nav", { className: "bg-gray-100 px-6 py-2 text-black", __source: { fileName: "", lineNumber: 330, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 331, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-6", __source: { fileName: "", lineNumber: 332, columnNumber: 11 }, __self: this }, tabs.map((tab)=>/*#__PURE__*/ React.createElement("button", { key: tab.key, onClick: ()=>setActiveTab(tab.key), className: `flex items-center space-x-2 px-4 py-2 rounded transition-colors ${activeTab === tab.key ? "bg-black text-white" : "text-gray-600 hover:text-black"}`, __source: { fileName: "", lineNumber: 334, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: tab.icon, __source: { fileName: "", lineNumber: 343, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 344, columnNumber: 17 }, __self: this }, tab.label)))))), /*#__PURE__*/ React.createElement("main", { className: "max-w-6xl mx-auto p-6", __source: { fileName: "", lineNumber: 352, columnNumber: 7 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center h-64", __source: { fileName: "", lineNumber: 354, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-white", __source: { fileName: "", lineNumber: 355, columnNumber: 13 }, __self: this }, "Loading academy content...")) : /*#__PURE__*/ React.createElement(React.Fragment, null, activeTab === "courses" && /*#__PURE__*/ React.createElement("div", { className: "space-y-8", __source: { fileName: "", lineNumber: 361, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 362, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold", __source: { fileName: "", lineNumber: 363, columnNumber: 19 }, __self: this }, "Featured Courses"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-4", __source: { fileName: "", lineNumber: 364, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("select", { className: "bg-gray-800 text-white px-3 py-2 rounded border border-gray-600", __source: { fileName: "", lineNumber: 365, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 366, columnNumber: 23 }, __self: this }, "All Levels"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 367, columnNumber: 23 }, __self: this }, "Beginner"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 368, columnNumber: 23 }, __self: this }, "Intermediate"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 369, columnNumber: 23 }, __self: this }, "Advanced")), /*#__PURE__*/ React.createElement("select", { className: "bg-gray-800 text-white px-3 py-2 rounded border border-gray-600", __source: { fileName: "", lineNumber: 371, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 372, columnNumber: 23 }, __self: this }, "All Categories"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 373, columnNumber: 23 }, __self: this }, "Fundamentals"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 374, columnNumber: 23 }, __self: this }, "Model-Specific"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 375, columnNumber: 23 }, __self: this }, "Advanced Techniques")))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", __source: { fileName: "", lineNumber: 380, columnNumber: 17 }, __self: this }, courses.map((course)=>/*#__PURE__*/ React.createElement("div", { key: course.id, className: "bg-gray-900 rounded-lg overflow-hidden hover:bg-gray-800 transition-colors cursor-pointer", onClick: ()=>setSelectedCourse(course), __source: { fileName: "", lineNumber: 382, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: course.thumbnail, alt: course.title, className: "w-full h-48 object-cover", __source: { fileName: "", lineNumber: 387, columnNumber: 23 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "p-6", __source: { fileName: "", lineNumber: 392, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-2", __source: { fileName: "", lineNumber: 393, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `px-2 py-1 rounded text-xs font-bold text-white ${getLevelColor(course.level)}`, __source: { fileName: "", lineNumber: 394, columnNumber: 27 }, __self: this }, course.level), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-1 text-yellow-500", __source: { fileName: "", lineNumber: 399, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-star", __source: { fileName: "", lineNumber: 400, columnNumber: 29 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-sm", __source: { fileName: "", lineNumber: 401, columnNumber: 29 }, __self: this }, course.rating))), /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-bold mb-2", __source: { fileName: "", lineNumber: 404, columnNumber: 25 }, __self: this }, course.title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 text-sm mb-4", __source: { fileName: "", lineNumber: 407, columnNumber: 25 }, __self: this }, course.description), course.completed > 0 && /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 412, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between text-sm mb-1", __source: { fileName: "", lineNumber: 413, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 414, columnNumber: 31 }, __self: this }, "Progress"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 415, columnNumber: 31 }, __self: this }, getProgressPercentage(course.completed, course.lessons), "%")), /*#__PURE__*/ React.createElement("div", { className: "w-full bg-gray-700 rounded-full h-2", __source: { fileName: "", lineNumber: 423, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-orange-500 h-2 rounded-full", style: { width: `${getProgressPercentage(course.completed, course.lessons)}%` }, __source: { fileName: "", lineNumber: 424, columnNumber: 31 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between text-sm text-gray-400", __source: { fileName: "", lineNumber: 434, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 435, columnNumber: 27 }, __self: this }, course.lessons, " lessons"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 436, columnNumber: 27 }, __self: this }, course.duration), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 437, columnNumber: 27 }, __self: this }, course.students.toLocaleString(), " students")), /*#__PURE__*/ React.createElement("div", { className: "text-sm text-gray-500 mt-2", __source: { fileName: "", lineNumber: 441, columnNumber: 25 }, __self: this }, "by ", course.instructor)))))), activeTab === "tutorials" && /*#__PURE__*/ React.createElement("div", { className: "space-y-8", __source: { fileName: "", lineNumber: 453, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 454, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold", __source: { fileName: "", lineNumber: 455, columnNumber: 19 }, __self: this }, "Video Tutorials"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-4", __source: { fileName: "", lineNumber: 456, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("select", { className: "bg-gray-800 text-white px-3 py-2 rounded border border-gray-600", __source: { fileName: "", lineNumber: 457, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 458, columnNumber: 23 }, __self: this }, "All Categories"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 459, columnNumber: 23 }, __self: this }, "Prompting"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 460, columnNumber: 23 }, __self: this }, "Techniques"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 461, columnNumber: 23 }, __self: this }, "Advanced")), /*#__PURE__*/ React.createElement("select", { className: "bg-gray-800 text-white px-3 py-2 rounded border border-gray-600", __source: { fileName: "", lineNumber: 463, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 464, columnNumber: 23 }, __self: this }, "All Difficulties"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 465, columnNumber: 23 }, __self: this }, "Beginner"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 466, columnNumber: 23 }, __self: this }, "Intermediate"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 467, columnNumber: 23 }, __self: this }, "Advanced")))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", __source: { fileName: "", lineNumber: 472, columnNumber: 17 }, __self: this }, tutorials.map((tutorial)=>/*#__PURE__*/ React.createElement("div", { key: tutorial.id, className: "bg-gray-900 rounded-lg overflow-hidden hover:bg-gray-800 transition-colors cursor-pointer", __source: { fileName: "", lineNumber: 474, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 478, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: tutorial.thumbnail, alt: tutorial.title, className: "w-full h-48 object-cover", __source: { fileName: "", lineNumber: 479, columnNumber: 25 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-black bg-opacity-40 flex items-center justify-center", __source: { fileName: "", lineNumber: 484, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-play-circle text-4xl text-white opacity-80", __source: { fileName: "", lineNumber: 485, columnNumber: 27 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-2 right-2 bg-black bg-opacity-75 text-white px-2 py-1 rounded text-sm", __source: { fileName: "", lineNumber: 487, columnNumber: 25 }, __self: this }, tutorial.duration)), /*#__PURE__*/ React.createElement("div", { className: "p-6", __source: { fileName: "", lineNumber: 491, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-2", __source: { fileName: "", lineNumber: 492, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `px-2 py-1 rounded text-xs font-bold text-white ${getLevelColor(tutorial.difficulty)}`, __source: { fileName: "", lineNumber: 493, columnNumber: 27 }, __self: this }, tutorial.difficulty), /*#__PURE__*/ React.createElement("span", { className: "text-xs text-gray-500", __source: { fileName: "", lineNumber: 498, columnNumber: 27 }, __self: this }, tutorial.category)), /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-bold mb-2", __source: { fileName: "", lineNumber: 502, columnNumber: 25 }, __self: this }, tutorial.title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 text-sm mb-4", __source: { fileName: "", lineNumber: 505, columnNumber: 25 }, __self: this }, tutorial.description), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between text-sm text-gray-400", __source: { fileName: "", lineNumber: 508, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-4", __source: { fileName: "", lineNumber: 509, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "flex items-center space-x-1", __source: { fileName: "", lineNumber: 510, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-eye", __source: { fileName: "", lineNumber: 511, columnNumber: 31 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 512, columnNumber: 31 }, __self: this }, tutorial.views.toLocaleString())), /*#__PURE__*/ React.createElement("span", { className: "flex items-center space-x-1", __source: { fileName: "", lineNumber: 514, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-heart text-red-500", __source: { fileName: "", lineNumber: 515, columnNumber: 31 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 516, columnNumber: 31 }, __self: this }, tutorial.likes.toLocaleString()))))))))), activeTab === "guides" && /*#__PURE__*/ React.createElement("div", { className: "space-y-8", __source: { fileName: "", lineNumber: 529, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 530, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold", __source: { fileName: "", lineNumber: 531, columnNumber: 19 }, __self: this }, "Learning Guides"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-4", __source: { fileName: "", lineNumber: 532, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("select", { className: "bg-gray-800 text-white px-3 py-2 rounded border border-gray-600", __source: { fileName: "", lineNumber: 533, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 534, columnNumber: 23 }, __self: this }, "All Categories"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 535, columnNumber: 23 }, __self: this }, "Beginner"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 536, columnNumber: 23 }, __self: this }, "Fundamentals"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 537, columnNumber: 23 }, __self: this }, "Advanced"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 538, columnNumber: 23 }, __self: this }, "Reference")))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", __source: { fileName: "", lineNumber: 543, columnNumber: 17 }, __self: this }, guides.map((guide)=>/*#__PURE__*/ React.createElement("div", { key: guide.id, className: "bg-gray-900 rounded-lg p-6 hover:bg-gray-800 transition-colors cursor-pointer", __source: { fileName: "", lineNumber: 545, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-3", __source: { fileName: "", lineNumber: 549, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "bg-blue-600 text-white px-2 py-1 rounded text-xs font-bold", __source: { fileName: "", lineNumber: 550, columnNumber: 25 }, __self: this }, guide.category), /*#__PURE__*/ React.createElement("span", { className: "text-xs text-gray-500", __source: { fileName: "", lineNumber: 553, columnNumber: 25 }, __self: this }, guide.readTime)), /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-bold mb-2", __source: { fileName: "", lineNumber: 557, columnNumber: 23 }, __self: this }, guide.title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 text-sm mb-4", __source: { fileName: "", lineNumber: 558, columnNumber: 23 }, __self: this }, guide.description), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between text-sm text-gray-500", __source: { fileName: "", lineNumber: 561, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 562, columnNumber: 25 }, __self: this }, "by ", guide.author), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 563, columnNumber: 25 }, __self: this }, guide.publishedAt)))))), activeTab === "interactive" && /*#__PURE__*/ React.createElement("div", { className: "space-y-8", __source: { fileName: "", lineNumber: 573, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center mb-8", __source: { fileName: "", lineNumber: 574, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-2", __source: { fileName: "", lineNumber: 575, columnNumber: 19 }, __self: this }, "Interactive Learning"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400", __source: { fileName: "", lineNumber: 578, columnNumber: 19 }, __self: this }, "Hands-on practice with real-time feedback and guided exercises")), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", __source: { fileName: "", lineNumber: 584, columnNumber: 17 }, __self: this }, interactiveLessons.map((lesson)=>/*#__PURE__*/ React.createElement("div", { key: lesson.id, className: "bg-gradient-to-br from-purple-900 to-blue-900 rounded-lg p-6 hover:from-purple-800 hover:to-blue-800 transition-all cursor-pointer", __source: { fileName: "", lineNumber: 586, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-3", __source: { fileName: "", lineNumber: 590, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "bg-orange-500 text-white px-2 py-1 rounded text-xs font-bold", __source: { fileName: "", lineNumber: 591, columnNumber: 25 }, __self: this }, lesson.type), /*#__PURE__*/ React.createElement("span", { className: `px-2 py-1 rounded text-xs font-bold text-white ${getLevelColor(lesson.difficulty)}`, __source: { fileName: "", lineNumber: 594, columnNumber: 25 }, __self: this }, lesson.difficulty)), /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-bold mb-2", __source: { fileName: "", lineNumber: 600, columnNumber: 23 }, __self: this }, lesson.title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-300 text-sm mb-4", __source: { fileName: "", lineNumber: 601, columnNumber: 23 }, __self: this }, lesson.description), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between text-sm", __source: { fileName: "", lineNumber: 604, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-300", __source: { fileName: "", lineNumber: 605, columnNumber: 25 }, __self: this }, lesson.duration), /*#__PURE__*/ React.createElement("span", { className: "text-gray-300 flex items-center space-x-1", __source: { fileName: "", lineNumber: 606, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-users", __source: { fileName: "", lineNumber: 607, columnNumber: 27 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 608, columnNumber: 27 }, __self: this }, lesson.participants.toLocaleString()))), /*#__PURE__*/ React.createElement("button", { className: "w-full mt-4 bg-white text-black font-medium py-2 rounded hover:bg-gray-200 transition-colors", __source: { fileName: "", lineNumber: 611, columnNumber: 23 }, __self: this }, "Start Interactive Lesson"))))))), selectedCourse && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50 p-4", __source: { fileName: "", lineNumber: 625, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white text-black rounded-lg max-w-4xl w-full max-h-[90vh] overflow-y-auto", __source: { fileName: "", lineNumber: 626, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-6", __source: { fileName: "", lineNumber: 627, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-start mb-6", __source: { fileName: "", lineNumber: 628, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 629, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl font-bold mb-2", __source: { fileName: "", lineNumber: 630, columnNumber: 19 }, __self: this }, selectedCourse.title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mb-4", __source: { fileName: "", lineNumber: 633, columnNumber: 19 }, __self: this }, selectedCourse.description), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-4 text-sm", __source: { fileName: "", lineNumber: 636, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `px-3 py-1 rounded font-bold text-white ${getLevelColor(selectedCourse.level)}`, __source: { fileName: "", lineNumber: 637, columnNumber: 21 }, __self: this }, selectedCourse.level), /*#__PURE__*/ React.createElement("span", { className: "flex items-center space-x-1", __source: { fileName: "", lineNumber: 642, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-clock", __source: { fileName: "", lineNumber: 643, columnNumber: 23 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 644, columnNumber: 23 }, __self: this }, selectedCourse.duration)), /*#__PURE__*/ React.createElement("span", { className: "flex items-center space-x-1", __source: { fileName: "", lineNumber: 646, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-play-circle", __source: { fileName: "", lineNumber: 647, columnNumber: 23 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 648, columnNumber: 23 }, __self: this }, selectedCourse.lessons, " lessons")), /*#__PURE__*/ React.createElement("span", { className: "flex items-center space-x-1 text-yellow-600", __source: { fileName: "", lineNumber: 650, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-star", __source: { fileName: "", lineNumber: 651, columnNumber: 23 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 652, columnNumber: 23 }, __self: this }, selectedCourse.rating)))), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSelectedCourse(null), className: "text-gray-500 hover:text-black text-2xl", __source: { fileName: "", lineNumber: 656, columnNumber: 17 }, __self: this }, "×")), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-8", __source: { fileName: "", lineNumber: 664, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 665, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: selectedCourse.thumbnail, alt: selectedCourse.title, className: "w-full rounded-lg mb-4", __source: { fileName: "", lineNumber: 666, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "text-sm text-gray-600 mb-4", __source: { fileName: "", lineNumber: 671, columnNumber: 19 }, __self: this }, "Instructor:", " ", /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 673, columnNumber: 21 }, __self: this }, selectedCourse.instructor)), /*#__PURE__*/ React.createElement("div", { className: "text-sm text-gray-600 mb-6", __source: { fileName: "", lineNumber: 677, columnNumber: 19 }, __self: this }, selectedCourse.students.toLocaleString(), " students enrolled")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 682, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-bold mb-4", __source: { fileName: "", lineNumber: 683, columnNumber: 19 }, __self: this }, "Course Content"), /*#__PURE__*/ React.createElement("div", { className: "space-y-3 mb-6", __source: { fileName: "", lineNumber: 684, columnNumber: 19 }, __self: this }, Array.from({ length: selectedCourse.lessons }, (_, i)=>/*#__PURE__*/ React.createElement("div", { key: i, className: `flex items-center space-x-3 p-3 rounded ${userProgress.completedLessons.includes(i + 1) ? "bg-green-100 text-green-800" : "bg-gray-100"}`, __source: { fileName: "", lineNumber: 686, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${userProgress.completedLessons.includes(i + 1) ? "fa-check-circle text-green-600" : "fa-play-circle text-gray-400"}`, __source: { fileName: "", lineNumber: 694, columnNumber: 25 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "flex-1", __source: { fileName: "", lineNumber: 701, columnNumber: 25 }, __self: this }, "Lesson ", i + 1, ": Sample Lesson Title"), /*#__PURE__*/ React.createElement("span", { className: "text-sm text-gray-500", __source: { fileName: "", lineNumber: 704, columnNumber: 25 }, __self: this }, "5 min")))), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-3", __source: { fileName: "", lineNumber: 709, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "flex-1 bg-orange-500 text-white py-3 rounded font-medium hover:bg-orange-600 transition-colors", __source: { fileName: "", lineNumber: 710, columnNumber: 21 }, __self: this }, selectedCourse.completed > 0 ? "Continue Course" : "Start Course"), /*#__PURE__*/ React.createElement("button", { className: "px-6 py-3 border border-gray-300 rounded hover:bg-gray-50 transition-colors", __source: { fileName: "", lineNumber: 715, columnNumber: 21 }, __self: this }, "Preview")))))))); }