1 line
10 KiB
JavaScript
1 line
10 KiB
JavaScript
import{j as e,a as c}from"./vendor-react-YMhRUmcb.js";import{C as w,B as N,l as y}from"./index-D2uzyr9g.js";import{a as C}from"./progress-CWjxseYI.js";import{b4 as k,b5 as f,e as S,d as A,w as L,G as E,aQ as P,b6 as F}from"./vendor-icons-DINCNwpk.js";import{S as I}from"./input-DL1WY4HG.js";import{S as d}from"./skeleton-BPDNnZ8E.js";import"./vendor-fFnFILYR.js";import"./vendor-router-DX94Iu-2.js";import"./vendor-tanstack-CoFNL2zy.js";import"./vendor-utils-4BWoYre8.js";const U=({course:t,onClick:s,showProgress:o=!1})=>e.jsxs(w,{variant:"default",className:"group p-0 overflow-hidden cursor-pointer hover:border-kodo-steel/50 transition-all flex flex-col h-full",onClick:()=>s(t),children:[e.jsxs("div",{className:"relative aspect-video bg-kodo-ink overflow-hidden",children:[e.jsx("img",{src:t.thumbnailUrl,className:"w-full h-full object-cover opacity-90 group-hover:opacity-100 transition-opacity duration-200",alt:t.title}),e.jsx("div",{className:"absolute inset-0 bg-black/40 opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center backdrop-blur-sm",children:e.jsx(k,{className:"w-12 h-12 text-white fill-current opacity-80"})}),t.certificateAvailable&&e.jsxs("div",{className:"absolute top-2 right-2 bg-kodo-gold/90 text-black text-[10px] font-bold px-2 py-0.5 rounded shadow-lg flex items-center gap-1",children:[e.jsx(f,{className:"w-3 h-3 fill-current"})," CERTIFIED"]}),e.jsxs("div",{className:"absolute bottom-2 left-2 bg-black/70 text-white text-xs px-2 py-1 rounded font-mono flex items-center gap-1",children:[e.jsx(S,{className:"w-3 h-3"})," ",t.duration]})]}),e.jsxs("div",{className:"p-4 flex flex-col flex-1",children:[e.jsxs("div",{className:"flex justify-between items-start mb-2",children:[e.jsx("span",{className:`text-[10px] px-2 py-0.5 rounded uppercase font-bold ${t.level==="Advanced"?"bg-kodo-red/20 text-kodo-red":t.level==="Intermediate"?"bg-kodo-gold/20 text-kodo-gold":"bg-kodo-lime/20 text-kodo-lime"}`,children:t.level}),t.rating&&e.jsxs("div",{className:"flex items-center gap-1 text-xs text-kodo-gold font-bold",children:[e.jsx(f,{className:"w-3 h-3 fill-current"})," ",t.rating]})]}),e.jsx("h3",{className:"font-bold text-white text-base mb-1 line-clamp-2 group-hover:text-white transition-colors",children:t.title}),e.jsxs("p",{className:"text-kodo-content-dim text-xs mb-3",children:["by ",t.instructor]}),e.jsx("div",{className:"mt-auto pt-2",children:o&&t.progress!==void 0?e.jsxs("div",{className:"space-y-2",children:[e.jsxs("div",{className:"flex justify-between text-xs text-kodo-content-dim",children:[e.jsx("span",{children:"Progress"}),e.jsxs("span",{className:t.progress===100?"text-kodo-lime":"text-white",children:[t.progress,"%"]})]}),e.jsx(C,{value:t.progress,color:t.progress===100?"lime":"cyan"}),t.progress===100&&e.jsxs("div",{className:"flex items-center gap-1 text-xs text-kodo-lime mt-1 font-bold",children:[e.jsx(A,{className:"w-3 h-3"})," Completed"]})]}):e.jsxs("div",{className:"flex justify-between items-center border-t border-white/5 pt-3",children:[e.jsxs("div",{className:"flex items-center gap-1 text-xs text-kodo-content-dim",children:[e.jsx(L,{className:"w-3 h-3"})," ",(t.studentCount||0).toLocaleString()," students"]}),e.jsx("span",{className:"font-mono font-bold text-white",children:t.price&&t.price>0?`$${t.price}`:"Free"})]})})]})]});function B({onMyCoursesClick:t}){return e.jsxs("div",{className:"flex flex-col md:flex-row justify-between items-end border-b border-border pb-6 gap-4",children:[e.jsxs("div",{children:[e.jsx("h2",{className:"text-2xl font-display font-bold text-white mb-2",children:"ACADEMY"}),e.jsx("p",{className:"text-muted-foreground font-mono text-sm",children:"Level up your skills. Earn certificates."})]}),e.jsx(N,{variant:"glass",icon:e.jsx(E,{className:"w-4 h-4"}),onClick:t,children:"MY LEARNING"})]})}function M({className:t}){return e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:[e.jsx("line",{x1:"12",x2:"12",y1:"2",y2:"22"}),e.jsx("path",{d:"M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"})]})}function T({search:t,onSearchChange:s,filterLevel:o,onFilterLevelChange:a,filterPrice:m,onFilterPriceChange:n}){return e.jsxs("div",{className:"flex flex-col md:flex-row gap-4 items-center bg-card/50 p-4 rounded-xl border border-border",children:[e.jsx("div",{className:"w-full md:w-96",children:e.jsx(I,{placeholder:"Search for courses, skills, or teachers...",value:t,onChange:r=>s(r.target.value)})}),e.jsxs("div",{className:"flex flex-wrap gap-2 w-full md:w-auto",children:[e.jsxs("div",{className:"flex items-center gap-2 bg-muted rounded-lg p-1 border border-border",children:[e.jsx(P,{className:"w-4 h-4 text-muted-foreground ml-2"}),e.jsxs("select",{className:"bg-transparent text-sm text-foreground focus:outline-none p-1 cursor-pointer",value:o,onChange:r=>a(r.target.value),children:[e.jsx("option",{value:"All",children:"All Levels"}),e.jsx("option",{value:"Beginner",children:"Beginner"}),e.jsx("option",{value:"Intermediate",children:"Intermediate"}),e.jsx("option",{value:"Advanced",children:"Advanced"})]})]}),e.jsxs("div",{className:"flex items-center gap-2 bg-muted rounded-lg p-1 border border-border",children:[e.jsx(M,{className:"w-4 h-4 text-muted-foreground ml-2"}),e.jsxs("select",{className:"bg-transparent text-sm text-foreground focus:outline-none p-1 cursor-pointer",value:m,onChange:r=>n(r.target.value),children:[e.jsx("option",{value:"All",children:"All Prices"}),e.jsx("option",{value:"Free",children:"Free"}),e.jsx("option",{value:"Paid",children:"Paid"})]})]})]})]})}function D(){return e.jsxs("div",{className:"col-span-full text-center py-24 text-muted-foreground",children:[e.jsx(F,{className:"w-12 h-12 mx-auto mb-4 opacity-50"}),e.jsx("p",{children:"No courses found matching your criteria."})]})}function O(){return e.jsxs("div",{className:"space-y-8 animate-fadeIn pb-20 min-h-layout-page",children:[e.jsxs("div",{className:"flex flex-col md:flex-row justify-between items-end border-b border-border pb-6 gap-4",children:[e.jsxs("div",{children:[e.jsx(d,{className:"h-8 w-32 mb-2"}),e.jsx(d,{className:"h-4 w-64"})]}),e.jsx(d,{className:"h-11 w-40 rounded-lg"})]}),e.jsxs("div",{className:"flex flex-col md:flex-row gap-4 items-center bg-card/50 p-4 rounded-xl border border-border",children:[e.jsx(d,{className:"h-10 w-full md:w-96 rounded-lg"}),e.jsxs("div",{className:"flex gap-2 w-full md:w-auto",children:[e.jsx(d,{className:"h-9 w-28 rounded-lg"}),e.jsx(d,{className:"h-9 w-24 rounded-lg"})]})]}),e.jsx("div",{className:"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-8",children:[1,2,3,4,5,6].map(t=>e.jsx(d,{className:"aspect-video w-full rounded-xl"},t))})]})}const V=[{id:"1",title:"Mastering with Ozone 10",level:"Advanced",duration:"3h 45m",progress:0,instructor:"Luca Pretellesi",thumbnailUrl:"https://picsum.photos/id/200/400/250",price:49.99,rating:4.8,studentCount:1200,tags:["Mixing","Mastering"]},{id:"2",title:"Music Theory for Producers",level:"Beginner",duration:"5h 10m",progress:0,instructor:"Sarah Devine",thumbnailUrl:"https://picsum.photos/id/201/400/250",price:29.99,rating:4.5,studentCount:3400,tags:["Theory","Composition"]},{id:"3",title:"Sound Design from Scratch",level:"Intermediate",duration:"4h 30m",progress:0,instructor:"Noisia",thumbnailUrl:"https://picsum.photos/id/202/400/250",price:39.99,rating:4.9,studentCount:850,tags:["Sound Design","Synthesis"]},{id:"4",title:"Ableton Live 11 Fundamentals",level:"Beginner",duration:"8h 20m",progress:0,instructor:"Ableton Certified",thumbnailUrl:"https://picsum.photos/id/203/400/250",price:0,rating:4.7,studentCount:15e3,tags:["DAW","Ableton"]},{id:"5",title:"Advanced Serum Techniques",level:"Advanced",duration:"2h 15m",progress:0,instructor:"Au5",thumbnailUrl:"https://picsum.photos/id/204/400/250",price:34.99,rating:4.9,studentCount:600,tags:["Synthesis","Serum"]}],R=[{id:"c1",title:"Mastering with Ozone 10",level:"Advanced",duration:"3h 45m",progress:75,thumbnailUrl:"https://picsum.photos/id/200/400/250",instructor:"Luca Pretellesi",lastAccessed:"2 days ago"},{id:"c2",title:"Music Theory for Producers",level:"Beginner",duration:"5h 10m",progress:10,thumbnailUrl:"https://picsum.photos/id/201/400/250",instructor:"Sarah Devine",lastAccessed:"1 week ago"},{id:"c3",title:"Ableton Live 11 Fundamentals",level:"Beginner",duration:"8h 20m",progress:100,thumbnailUrl:"https://picsum.photos/id/203/400/250",instructor:"Ableton Certified",lastAccessed:"1 month ago",certificateAvailable:!0}],G={getCatalog:async()=>(await new Promise(t=>setTimeout(t,500)),V),getMyCourses:async()=>(await new Promise(t=>setTimeout(t,400)),R),enroll:async t=>(await new Promise(s=>setTimeout(s,600)),{success:!0})};function H(t){const[s,o]=c.useState(""),[a,m]=c.useState("All"),[n,r]=c.useState("All"),[x,p]=c.useState(t??[]),[g,u]=c.useState(t===void 0);c.useEffect(()=>{if(t!==void 0)return;(async()=>{u(!0);try{const l=await G.getCatalog();p(l)}catch(l){y.error("Failed to load courses",{error:l instanceof Error?l.message:String(l),stack:l instanceof Error?l.stack:void 0})}finally{u(!1)}})()},[t]);const h=x.filter(i=>{const l=i.title.toLowerCase().includes(s.toLowerCase())||(i.tags??[]).some(j=>j.toLowerCase().includes(s.toLowerCase())),v=a==="All"||i.level===a,b=n==="All"||(n==="Free"?i.price===0:(i.price??0)>0);return l&&v&&b});return{search:s,setSearch:o,filterLevel:a,setFilterLevel:m,filterPrice:n,setFilterPrice:r,courses:x,loading:g,filtered:h}}function Z({onCourseClick:t,onMyCoursesClick:s,initialCourses:o}){const{search:a,setSearch:m,filterLevel:n,setFilterLevel:r,filterPrice:x,setFilterPrice:p,loading:g,filtered:u}=H(o);return g?e.jsx(O,{}):e.jsxs("div",{className:"space-y-8 animate-fadeIn pb-20 min-h-layout-page",children:[e.jsx(B,{onMyCoursesClick:s}),e.jsx(T,{search:a,onSearchChange:m,filterLevel:n,onFilterLevelChange:r,filterPrice:x,onFilterPriceChange:p}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-8",children:[u.map(h=>e.jsx(U,{course:h,onClick:i=>t?.(i)},h.id)),u.length===0&&e.jsx(D,{})]})]})}export{Z as EducationView};
|