https://www.abclub.ai/assets/TrackDetail-C36QIQlE.js

1import{j as e}from"./ui-Gn93sXnx.js";import{c as w,L as i}from"./router-da-5gp3u.js";import{H as j}from"./Helmet-_NQcQ4uB.js";import{P as m}from"./PortalShell-CfCSf6s8.js";import{b as g,f as u,c as N,a as k,d as v,n as y}from"./portalTracks-C9NNw9ff.js";import{A as _}from"./arrow-left-Diy9rmxF.js";import{B as C}from"./book-open-B6i_AvKZ.js";import{C as L}from"./clock-KNqI6XqD.js";import{P as d}from"./play-B_NM8QXN.js";import{C as $}from"./check-BtkqYzVe.js";import{C as I}from"./chevron-right-k6CQye0s.js";import"./vendor-Dxln9S8c.js";import"./index-AgFXObMB.js";import"./external-link-Balu67eH.js";import"./settings-Bsq3zbIv.js";import"./search-HQP4_9-j.js";import"./layout-dashboard-BaLeYq18.js";import"./calendar-Bq8_DmDU.js";import"./users-lNVTqO4h.js";const Q=()=>{const{trackId:h}=w(),s=g(h);if(!s)return e.jsx(m,{children:e.jsxs("div",{className:"px-6 lg:px-10 py-12",children:[e.jsx("p",{className:"text-white/60 mb-4",children:"Track not found."}),e.jsx(i,{to:"/portal",className:"text-sm text-white underline",children:"Back to home"})]})});const t=u(s),l=N(t),n=k(t),p=v(t),c=t.findIndex(r=>!r.completed),b=y(s),f=l===0?"Start track":c>=0?"Continue track":"Review track";return e.jsxs(e.Fragment,{children:[e.jsxs(j,{children:[e.jsxs("title",{children:[s.title," — AI Design Academy"]}),e.jsx("meta",{name:"robots",content:"noindex, nofollow"})]}),e.jsx(m,{children:e.jsxs("div",{className:"px-6 lg:px-10 py-8 max-w-[1280px]",children:[e.jsxs(i,{to:"/portal",className:"inline-flex items-center gap-1.5 text-sm text-white/50 hover:text-white mb-6 transition-colors",children:[e.jsx(_,{className:"w-3.5 h-3.5"}),"Back to home"]}),e.jsxs("div",{className:"rounded-3xl overflow-hidden border border-white/[0.08] shadow-[0_12px_40px_-12px_rgba(0,0,0,0.7),0_30px_80px_-30px_rgba(0,0,0,0.5)] mb-10",children:[e.jsxs("div",{className:"aspect-[3/1] sm:aspect-[4/1] relative",style:{background:s.gradient},children:[e.jsx("div",{className:"absolute inset-0 bg-gradient-to-t from-black/80 via-black/35 to-transparent"}),e.jsx("div",{className:"absolute inset-0 flex items-end p-6 sm:p-8 lg:p-10",children:e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center gap-3 mb-3",children:[e.jsx("span",{className:"inline-flex items-center justify-center w-9 h-9 rounded-lg bg-white/15 backdrop-blur border border-white/30 text-sm font-bold",children:s.number}),e.jsx("span",{className:"text-[11px] text-white/85 uppercase tracking-wider px-2 py-0.5 rounded bg-black/30 backdrop-blur border border-white/10",children:s.label})]}),e.jsx("h1",{className:"text-2xl sm:text-3xl lg:text-4xl font-medium tracking-tight mb-2",children:s.title}),e.jsx("p",{className:"text-white/70 text-sm lg:text-base max-w-2xl",children:s.description})]})})]}),e.jsxs("div",{className:"px-6 sm:px-8 lg:px-10 py-5 bg-[#0e0e10] flex flex-col sm:flex-row sm:items-center justify-between gap-4",children:[e.jsxs("div",{className:"flex flex-wrap items-center gap-x-6 gap-y-2 text-sm text-white/55",children:[e.jsxs("span",{className:"flex items-center gap-1.5",children:[e.jsx(C,{className:"w-3.5 h-3.5"})," ",t.length," lessons"]}),e.jsxs("span",{className:"flex items-center gap-1.5",children:[e.jsx(L,{className:"w-3.5 h-3.5"})," ",p,"m total"]}),e.jsxs("span",{children:[l,"/",t.length," completed"]})]}),e.jsxs(i,{to:`/portal/track/${s.id}/lesson/${b}`,className:"inline-flex items-center gap-2 px-5 py-2.5 rounded-full bg-white text-black font-medium text-sm hover:bg-white/90 transition-colors w-fit",children:[e.jsx(d,{className:"w-3.5 h-3.5 fill-current"}),f]})]})]}),e.jsxs("div",{className:"mb-10",children:[e.jsxs("div",{className:"flex items-center justify-between text-sm mb-2",children:[e.jsx("span",{className:"font-medium",children:"Your progress"}),e.jsxs("span",{className:"text-white/50 tabular-nums",children:[n,"%"]})]}),e.jsx("div",{className:"h-1.5 bg-white/[0.08] rounded-full overflow-hidden",children:e.jsx("div",{className:"h-full bg-white transition-[width] duration-500",style:{width:`${n}%`}})})]}),e.jsxs("div",{className:"pb-12",children:[e.jsx("h2",{className:"text-lg font-semibold mb-4",children:"Lessons"}),e.jsx("div",{className:"rounded-2xl border border-white/[0.08] bg-[#0e0e10] overflow-hidden shadow-[0_8px_24px_-8px_rgba(0,0,0,0.5)]",children:t.map((r,a)=>{const o=!!r.completed,x=a===c;return e.jsxs(i,{to:`/portal/track/${s.id}/lesson/${a}`,className:`flex items-center gap-4 px-5 py-4 hover:bg-white/[0.03] transition-colors ${a>0?"border-t border-white/[0.05]":""}`,children:[e.jsx("span",{className:`w-9 h-9 rounded-full flex items-center justify-center flex-shrink-0 ${o?"bg-white text-black":x?"bg-white/15 text-white ring-2 ring-white/40":"bg-white/10 text-white"}`,children:o?e.jsx($,{className:"w-4 h-4"}):e.jsx(d,{className:"w-3.5 h-3.5 fill-current ml-0.5"})}),e.jsxs("div",{className:"flex-1 min-w-0",children:[e.jsx("div",{className:"text-sm font-medium leading-snug",children:r.title}),e.jsxs("div",{className:"text-[11px] text-white/40 mt-0.5",children:["Lesson ",a+1," · ",r.duration]})]}),x&&e.jsx("span",{className:"hidden sm:inline-flex text-[10px] uppercase tracking-wider px-2 py-0.5 rounded bg-white/10 border border-white/15 text-white/75",children:"Up next"}),e.jsx(I,{className:"w-4 h-4 text-white/30 flex-shrink-0"})]},a)})})]})]})})]})};export{Q as default};