1 line
47 KiB
JavaScript
1 line
47 KiB
JavaScript
import{j as e,a as m}from"./vendor-react-YMhRUmcb.js";import{C as T,B as k,a as A,b as ye,d as b,c as Ne,u as H,g as F,E as q,e as be,p as je,D as we,v as Ce,t as ke}from"./index-D2uzyr9g.js";import{a6 as Ee,V as Se,Y as X,aa as ne,a1 as De,E as ie,e as oe,aG as W,a9 as Te,aH as Re,T as le,ah as B,X as ce,aI as Oe,i as Ae,C as Y,aJ as G,aK as _e,aL as Ie,aM as de,aF as Me,aq as Pe,q as Le,r as Ve,g as Qe,al as qe,aN as Ke,as as ze}from"./vendor-icons-DINCNwpk.js";import{T as Ue,a as $e,b as z,c as U}from"./Tabs-C8UCeQNW.js";import{u as ue,a as me,b as Q}from"./vendor-tanstack-CoFNL2zy.js";import{q as _,G as L,H as He}from"./vendor-fFnFILYR.js";import{D as Fe,a as We,b as Be,c as Z,u as Ge}from"./useIsRateLimited-C43yhDlJ.js";import{A as Je}from"./avatar-DwZKme3D.js";import{I as K,L as Xe}from"./input-DL1WY4HG.js";import{S as J}from"./Spinner-DMondT4l.js";import{C as Ye}from"./confirmation-dialog-O1mUMh9e.js";import{f as Ze,d as es}from"./vendor-utils-4BWoYre8.js";import{t as ss,T as O,a as rs}from"./tracks-C_h6xkxF.js";import{A as ts,a as as}from"./alert-COAUu9KR.js";import{u as pe,d as ns}from"./vendor-router-DX94Iu-2.js";import"./dropdown-DLDDI8f2.js";function is({track:s}){const r=s.cover_art_path;return e.jsxs("div",{className:"absolute inset-0 h-[60vh] overflow-hidden pointer-events-none",children:[e.jsx("div",{className:"absolute inset-x-0 -top-40 h-[150%] opacity-20 blur-[120px] scale-110",style:{background:r?`url(${r}) center/cover`:"var(--primary)"}}),e.jsx("div",{className:"absolute inset-0 bg-gradient-to-b from-background/40 via-background/80 to-background"})]})}function os({track:s,isCurrentlyPlaying:r,onPlay:a,onPause:t,onAddToQueue:i,onShare:o}){const n=s.cover_art_path,f=s.like_count??0,h=s.play_count??0;return e.jsxs("div",{className:"lg:col-span-4 sticky top-24 space-y-8",children:[e.jsxs("div",{className:"relative aspect-square rounded-3xl overflow-hidden shadow-[0_20px_50px_rgba(0,0,0,0.5)] border border-white/10 group",children:[n?e.jsx("img",{src:n,alt:s.title,className:"w-full h-full object-cover transition-transform duration-700 group-hover:scale-105"}):e.jsx("div",{className:"w-full h-full bg-gradient-to-br from-gray-800 to-black flex items-center justify-center",children:e.jsx(Ee,{className:"h-24 w-24 text-white/20"})}),e.jsx("div",{className:"absolute inset-0 bg-gradient-to-tr from-white/5 to-transparent opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none"})]}),e.jsx(T,{variant:"glass",className:"p-4 border-white/5 bg-black/30 backdrop-blur-xl",children:e.jsxs("div",{className:"flex gap-3",children:[r?e.jsxs(k,{onClick:t,className:"flex-1 h-12 bg-primary text-primary-foreground font-bold shadow-glow-cyan hover:scale-[1.02] transition-transform",children:[e.jsx(Se,{className:"h-5 w-5 mr-2 fill-current"})," Pause"]}):e.jsxs(k,{onClick:a,className:"flex-1 h-12 bg-primary text-primary-foreground font-bold shadow-glow-cyan hover:scale-[1.02] transition-transform",children:[e.jsx(X,{className:"h-5 w-5 mr-2 fill-current"})," Play"]}),e.jsx(k,{onClick:i,variant:"secondary",className:"h-12 w-12 p-0 rounded-xl",title:"Add to Queue",children:e.jsx(ne,{className:"h-5 w-5"})}),e.jsx(k,{onClick:o,variant:"secondary",className:"h-12 w-12 p-0 rounded-xl",title:"Share",children:e.jsx(De,{className:"h-5 w-5"})})]})}),e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[e.jsxs(T,{variant:"glass",className:"p-4 flex flex-col items-center justify-center bg-black/20 text-center hover:bg-white/5 transition-colors",children:[e.jsx(ie,{className:"w-5 h-5 text-magenta-500 mb-1"}),e.jsx("span",{className:"text-xl font-bold text-white",children:f}),e.jsx("span",{className:"text-xs text-muted-foreground uppercase tracking-wider",children:"Likes"})]}),e.jsxs(T,{variant:"glass",className:"p-4 flex flex-col items-center justify-center bg-black/20 text-center hover:bg-white/5 transition-colors",children:[e.jsx(X,{className:"w-5 h-5 text-cyan-500 mb-1"}),e.jsx("span",{className:"text-xl font-bold text-white",children:h}),e.jsx("span",{className:"text-xs text-muted-foreground uppercase tracking-wider",children:"Plays"})]})]})]})}function ls(s){const r=Math.floor(s/60),a=Math.floor(s%60);return`${r}:${a.toString().padStart(2,"0")}`}function cs({track:s}){const r=s.waveform_path,a=s.album,t=s.year,i=s.genre;return e.jsxs("div",{className:"lg:col-span-8 space-y-8",children:[e.jsxs("div",{children:[e.jsx("h1",{className:"text-4xl md:text-6xl font-display font-bold text-white mb-2 leading-tight",children:s.title}),e.jsxs("div",{className:"flex flex-wrap items-center gap-4 text-lg md:text-xl text-muted-foreground",children:[e.jsx("span",{className:"text-primary font-medium",children:s.artist}),a&&e.jsxs("span",{children:["• ",a]}),t!=null&&e.jsxs("span",{children:["• ",t]})]}),e.jsxs("div",{className:"flex flex-wrap gap-3 mt-6",children:[i&&e.jsx("span",{className:"px-3 py-1 rounded-full bg-white/5 border border-white/10 text-sm",children:i}),e.jsxs("span",{className:"px-3 py-1 rounded-full bg-white/5 border border-white/10 text-sm flex items-center gap-1",children:[e.jsx(oe,{className:"w-3 h-3"})," ",ls(s.duration)]})]})]}),r&&e.jsxs("div",{className:"relative h-24 w-full bg-black/20 rounded-xl border border-white/5 overflow-hidden group",children:[e.jsx("div",{className:"absolute inset-0 bg-gradient-to-r from-cyan-500/10 to-magenta-500/10 opacity-50"}),e.jsx("img",{src:r,alt:"Waveform",className:"w-full h-full object-cover opacity-60 group-hover:opacity-80 transition-opacity mix-blend-screen"})]})]})}class p extends Error{constructor(r,a,t=!1,i){super(r),this.code=a,this.retryable=t,this.originalError=i,this.name="CommentError"}}async function he(s,r,a){try{return(await A.post(`/tracks/${s}/comments`,{content:r,parent_id:a})).data.comment}catch(t){if(t instanceof _){if(t.response?.status===401)throw new p("Non autorisé: Veuillez vous connecter pour commenter","VALIDATION",!1,t);if(t.response?.status===404)throw new p("Track ou commentaire parent introuvable","VALIDATION",!1,t);if(t.response?.status===400){const o=t.response?.data?.error||"Données invalides";throw new p(o,"VALIDATION",!1,t)}if(t.response?.status===500)throw new p("Erreur serveur: Impossible de créer le commentaire. Veuillez réessayer plus tard.","SERVER",!0,t);if(t.code==="ECONNABORTED"||t.code==="ETIMEDOUT"||!t.response)throw new p("Erreur réseau: Impossible de se connecter au serveur.","NETWORK",!0,t);const i=t.response?.data?.error||t.message||"Échec de la création du commentaire";throw new p(i,"UNKNOWN",!1,t)}throw t instanceof p?t:new p("Erreur inconnue lors de la création du commentaire","UNKNOWN",!1,t)}}async function ds(s,r=1,a=20){try{return(await A.get(`/tracks/${s}/comments?page=${r}&limit=${a}`)).data}catch(t){if(t instanceof _){if(t.response?.status===404)throw new p("Track introuvable","VALIDATION",!1,t);if(t.response?.status===500)throw new p("Erreur serveur: Impossible de récupérer les commentaires. Veuillez réessayer plus tard.","SERVER",!0,t);if(t.code==="ECONNABORTED"||t.code==="ETIMEDOUT"||!t.response)throw new p("Erreur réseau: Impossible de se connecter au serveur.","NETWORK",!0,t);const i=t.response?.data?.error||t.message||"Échec de la récupération des commentaires";throw new p(i,"UNKNOWN",!1,t)}throw t instanceof p?t:new p("Erreur inconnue lors de la récupération des commentaires","UNKNOWN",!1,t)}}async function us(s,r){try{return(await A.put(`/comments/${s}`,{content:r})).data.comment}catch(a){if(a instanceof _){if(a.response?.status===401)throw new p("Non autorisé: Veuillez vous connecter pour modifier ce commentaire","VALIDATION",!1,a);if(a.response?.status===403)throw new p("Non autorisé: Vous ne pouvez modifier que vos propres commentaires","VALIDATION",!1,a);if(a.response?.status===404)throw new p("Commentaire introuvable","VALIDATION",!1,a);if(a.response?.status===400){const i=a.response?.data?.error||"Données invalides";throw new p(i,"VALIDATION",!1,a)}if(a.response?.status===500)throw new p("Erreur serveur: Impossible de mettre à jour le commentaire. Veuillez réessayer plus tard.","SERVER",!0,a);if(a.code==="ECONNABORTED"||a.code==="ETIMEDOUT"||!a.response)throw new p("Erreur réseau: Impossible de se connecter au serveur.","NETWORK",!0,a);const t=a.response?.data?.error||a.message||"Échec de la mise à jour du commentaire";throw new p(t,"UNKNOWN",!1,a)}throw a instanceof p?a:new p("Erreur inconnue lors de la mise à jour du commentaire","UNKNOWN",!1,a)}}async function ms(s){try{await A.delete(`/comments/${s}`)}catch(r){if(r instanceof _){if(r.response?.status===401)throw new p("Non autorisé: Veuillez vous connecter pour supprimer ce commentaire","VALIDATION",!1,r);if(r.response?.status===403)throw new p("Non autorisé: Vous ne pouvez supprimer que vos propres commentaires","VALIDATION",!1,r);if(r.response?.status===404)throw new p("Commentaire introuvable","VALIDATION",!1,r);if(r.response?.status===500)throw new p("Erreur serveur: Impossible de supprimer le commentaire. Veuillez réessayer plus tard.","SERVER",!0,r);if(r.code==="ECONNABORTED"||r.code==="ETIMEDOUT"||!r.response)throw new p("Erreur réseau: Impossible de se connecter au serveur.","NETWORK",!0,r);const a=r.response?.data?.error||r.message||"Échec de la suppression du commentaire";throw new p(a,"UNKNOWN",!1,r)}throw r instanceof p?r:new p("Erreur inconnue lors de la suppression du commentaire","UNKNOWN",!1,r)}}async function ps(s,r=1,a=20){try{return(await A.get(`/comments/${s}/replies?page=${r}&limit=${a}`)).data}catch(t){if(t instanceof _){if(t.response?.status===404)throw new p("Commentaire parent introuvable","VALIDATION",!1,t);if(t.response?.status===500)throw new p("Erreur serveur: Impossible de récupérer les réponses. Veuillez réessayer plus tard.","SERVER",!0,t);if(t.code==="ECONNABORTED"||t.code==="ETIMEDOUT"||!t.response)throw new p("Erreur réseau: Impossible de se connecter au serveur.","NETWORK",!0,t);const i=t.response?.data?.error||t.message||"Échec de la récupération des réponses";throw new p(i,"UNKNOWN",!1,t)}throw t instanceof p?t:new p("Erreur inconnue lors de la récupération des réponses","UNKNOWN",!1,t)}}function hs({count:s,className:r}){return e.jsx(ye,{className:b(r),children:e.jsxs(Ne,{className:"flex items-center gap-2 tracking-tight",children:[e.jsx(W,{className:"h-5 w-5 text-primary/90","aria-hidden":!0}),"Commentaires (",s,")"]})})}const xs=3;function fs({commentId:s,trackId:r,showReplies:a,initialReplies:t}){const i=Array.isArray(t)&&t.length>0,{data:o,isLoading:n}=ue({queryKey:["commentReplies",s],queryFn:()=>ps(s,1,20),enabled:a&&!i});return{replies:i?t:o?.replies??[],isLoadingReplies:a&&!i&&n}}function gs({comment:s,trackId:r,callbacks:a={}}){const{data:t}=H(),{success:i,error:o}=F(),n=me(),{onReplySuccess:f,onEditSuccess:h,onDeleteSuccess:v}=a,u=Q({mutationFn:d=>he(r,d,s.id),onMutate:async d=>{await n.cancelQueries({queryKey:["commentReplies",s.id]}),await n.cancelQueries({queryKey:["trackComments",r]});const c=n.getQueryData(["commentReplies",s.id]),x=n.getQueryData(["trackComments",r]);if(c&&t){const w={id:`temp-${Date.now()}`,track_id:r,user_id:t.id,parent_id:s.id,content:d.trim(),is_edited:!1,created_at:new Date().toISOString(),updated_at:new Date().toISOString(),user:{id:t.id,username:t.username||"",avatar:t.avatar_url}};n.setQueryData(["commentReplies",s.id],{...c,replies:[...c.replies||[],w]})}return{previousReplies:c,previousComments:x}},onError:(d,c,x)=>{x?.previousReplies&&n.setQueryData(["commentReplies",s.id],x.previousReplies),x?.previousComments&&n.setQueryData(["trackComments",r],x.previousComments),o(d.message||"Erreur lors de la publication de la réponse")},onSuccess:()=>{n.invalidateQueries({queryKey:["trackComments",r]}),n.invalidateQueries({queryKey:["commentReplies",s.id]}),i("Réponse publiée"),f?.()}}),j=Q({mutationFn:d=>us(s.id,d),onMutate:async d=>{await n.cancelQueries({queryKey:["trackComments",r]}),await n.cancelQueries({queryKey:["commentReplies",s.parent_id||s.id]});const c=n.getQueryData(["trackComments",r]),x=s.parent_id?n.getQueryData(["commentReplies",s.parent_id]):null;return c&&n.setQueryData(["trackComments",r],{...c,comments:c.comments.map(w=>w.id===s.id?{...w,content:d.trim(),is_edited:!0,updated_at:new Date().toISOString()}:w)}),x&&s.parent_id&&n.setQueryData(["commentReplies",s.parent_id],{...x,replies:x.replies.map(w=>w.id===s.id?{...w,content:d.trim(),is_edited:!0,updated_at:new Date().toISOString()}:w)}),{previousComments:c,previousReplies:x}},onError:(d,c,x)=>{x?.previousComments&&n.setQueryData(["trackComments",r],x.previousComments),x?.previousReplies&&s.parent_id&&n.setQueryData(["commentReplies",s.parent_id],x.previousReplies),o(d.message||"Erreur lors de la modification")},onSuccess:()=>{n.invalidateQueries({queryKey:["trackComments",r]}),i("Commentaire modifié"),h?.()}}),y=Q({mutationFn:()=>ms(s.id),onMutate:async()=>{await n.cancelQueries({queryKey:["trackComments",r]}),await n.cancelQueries({queryKey:["commentReplies",s.parent_id||s.id]});const d=n.getQueryData(["trackComments",r]),c=s.parent_id?n.getQueryData(["commentReplies",s.parent_id]):null;return d&&n.setQueryData(["trackComments",r],{...d,comments:d.comments.filter(x=>x.id!==s.id),total:Math.max((d.total||1)-1,0)}),c&&s.parent_id&&n.setQueryData(["commentReplies",s.parent_id],{...c,replies:c.replies.filter(x=>x.id!==s.id)}),{previousComments:d,previousReplies:c}},onError:(d,c,x)=>{x?.previousComments&&n.setQueryData(["trackComments",r],x.previousComments),x?.previousReplies&&s.parent_id&&n.setQueryData(["commentReplies",s.parent_id],x.previousReplies),o("Erreur lors de la suppression")},onSuccess:()=>{n.invalidateQueries({queryKey:["trackComments",r]}),i("Commentaire supprimé"),v?.()}});return{createReplyMutation:u,updateCommentMutation:j,deleteCommentMutation:y,handleReplySubmit:(d,c)=>{d.preventDefault(),!(!c.trim()||!t)&&u.mutate(c.trim())},handleEditSubmit:(d,c)=>{d.preventDefault(),c.trim()&&j.mutate(c.trim())},handleDelete:()=>{y.mutate()}}}function vs({comment:s,canEdit:r,canDelete:a,onEdit:t,onDelete:i,className:o}){return e.jsxs("div",{className:b("flex items-start justify-between gap-2",o),"data-testid":"comment-thread-header",children:[e.jsx("div",{className:"flex-1 min-w-0",children:e.jsxs("div",{className:"flex items-center gap-2 flex-wrap",children:[e.jsx("span",{className:"font-medium text-sm tracking-tight text-foreground",children:s.user?.username||"Utilisateur"}),e.jsx("span",{className:"text-xs text-muted-foreground/90",children:Ze(new Date(s.created_at),{addSuffix:!0,locale:es})}),s.is_edited&&e.jsx("span",{className:"text-xs text-muted-foreground/80 italic",children:"(modifié)"})]})}),(r||a)&&e.jsxs(Fe,{children:[e.jsx(We,{asChild:!0,children:e.jsx(k,{variant:"ghost",size:"icon",className:"h-6 w-6 rounded-[var(--radius-md)] transition-colors duration-[var(--duration-normal)] hover:text-foreground hover:bg-muted/50",children:e.jsx(Te,{className:"h-4 w-4"})})}),e.jsxs(Be,{align:"end",className:"rounded-[var(--radius-lg)]",children:[r&&e.jsxs(Z,{onClick:t,children:[e.jsx(Re,{className:"mr-2 h-4 w-4"}),"Modifier"]}),a&&e.jsxs(Z,{onClick:i,className:"text-destructive",children:[e.jsx(le,{className:"mr-2 h-4 w-4"}),"Supprimer"]})]})]})]})}function ys({comment:s,isEditing:r,editContent:a,onEditContentChange:t,onEditSubmit:i,onEditCancel:o,isEditPending:n,className:f}){return r?e.jsxs("form",{onSubmit:i,className:b("space-y-2 rounded-[var(--radius-lg)] transition-opacity duration-[var(--duration-normal)]",f),"data-testid":"comment-edit-form",children:[e.jsx(K,{value:a,onChange:h=>t(h.target.value),maxLength:500,autoFocus:!0,className:"rounded-[var(--radius-md)] transition-[border-color,box-shadow] duration-[var(--duration-normal)]"}),e.jsxs("div",{className:"flex gap-2",children:[e.jsxs(k,{type:"submit",size:"sm",disabled:!a.trim()||n,className:"rounded-[var(--radius-md)] transition-transform duration-[var(--duration-normal)] active:scale-95",children:[n?e.jsx(J,{size:"sm",className:"mr-2"}):e.jsx(B,{className:"h-4 w-4 mr-2"}),"Enregistrer"]}),e.jsxs(k,{type:"button",variant:"outline",size:"sm",onClick:o,className:"rounded-[var(--radius-md)] transition-colors duration-[var(--duration-normal)]",children:[e.jsx(ce,{className:"h-4 w-4 mr-2"}),"Annuler"]})]})]}):e.jsx("p",{className:b("text-sm text-foreground/90 whitespace-pre-wrap break-words tracking-tight leading-relaxed transition-colors duration-[var(--duration-normal)]",f),"data-testid":"comment-content",children:s.content})}const ee={type:"spring",stiffness:300,damping:30},se={rest:{scale:1},hover:{scale:1.03},tap:{scale:.97}};function Ns({canReply:s,hasUser:r,repliesCount:a,showReplies:t,onToggleReply:i,onToggleReplies:o,className:n}){return e.jsxs("div",{className:b("flex items-center gap-4",n),"data-testid":"comment-thread-actions",children:[s&&r&&e.jsx(L.div,{initial:"rest",whileHover:"hover",whileTap:"tap",variants:se,transition:ee,children:e.jsxs(k,{variant:"ghost",size:"sm",onClick:i,className:"h-7 text-xs tracking-tight rounded-[var(--radius-md)] transition-colors duration-[var(--duration-normal)] hover:text-primary hover:bg-primary/10",children:[e.jsx(Oe,{className:"h-3 w-3 mr-1 text-primary/90"}),"Répondre"]})}),a>0&&e.jsx(L.div,{initial:"rest",whileHover:"hover",whileTap:"tap",variants:se,transition:ee,children:e.jsxs(k,{variant:"ghost",size:"sm",onClick:o,className:"h-7 text-xs tracking-tight rounded-[var(--radius-md)] transition-colors duration-[var(--duration-normal)] hover:text-primary hover:bg-primary/10",children:[e.jsx(W,{className:"h-3 w-3 mr-1 text-primary/90"}),t?"Masquer":"Afficher"," ",a," ",a===1?"réponse":"réponses"]})})]})}function bs({placeholder:s,value:r,onChange:a,onSubmit:t,onCancel:i,isPending:o,className:n}){return e.jsxs("form",{onSubmit:t,className:b("space-y-2 pt-2 rounded-[var(--radius-lg)] transition-opacity duration-[var(--duration-normal)]",n),"data-testid":"comment-reply-form",children:[e.jsx(K,{value:r,onChange:f=>a(f.target.value),placeholder:s,maxLength:500,autoFocus:!0,className:"rounded-[var(--radius-md)] transition-[border-color,box-shadow] duration-[var(--duration-normal)]"}),e.jsxs("div",{className:"flex gap-2",children:[e.jsxs(k,{type:"submit",size:"sm",disabled:!r.trim()||o,className:"rounded-[var(--radius-md)] transition-transform duration-[var(--duration-normal)] active:scale-95",children:[o?e.jsx(J,{size:"sm",className:"mr-2"}):e.jsx(B,{className:"h-4 w-4 mr-2"}),"Publier"]}),e.jsxs(k,{type:"button",variant:"outline",size:"sm",onClick:i,className:"rounded-[var(--radius-md)] transition-colors duration-[var(--duration-normal)]",children:[e.jsx(ce,{className:"h-4 w-4 mr-2"}),"Annuler"]})]})]})}function $({className:s}){return e.jsxs("div",{className:b("flex gap-4 animate-pulse rounded-[var(--radius-lg)] transition-opacity duration-[var(--duration-normal)]",s),"data-testid":"comment-thread-skeleton",children:[e.jsx("div",{className:"h-8 w-8 shrink-0 rounded-full bg-muted"}),e.jsxs("div",{className:"flex-1 min-w-0 space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("div",{className:"h-4 w-24 rounded-[var(--radius-md)] bg-muted"}),e.jsx("div",{className:"h-3 w-16 rounded-[var(--radius-md)] bg-muted"})]}),e.jsx("div",{className:"h-4 w-full rounded-[var(--radius-md)] bg-muted"}),e.jsx("div",{className:"h-4 w-2/3 rounded-[var(--radius-md)] bg-muted"})]})]})}function js({isLoading:s,children:r,className:a}){return e.jsx("div",{className:b("space-y-4 pt-2 pl-4 border-l-2 border-border/80 rounded-[var(--radius-sm)] transition-colors duration-[var(--duration-normal)]",a),"data-testid":"comment-replies-list",children:s?e.jsxs("div",{className:"space-y-2","data-testid":"replies-loading",children:[e.jsx($,{}),e.jsx($,{})]}):r})}function xe({comment:s,trackId:r,depth:a=0,className:t}){const{data:i}=H(),[o,n]=m.useState(!1),[f,h]=m.useState(!1),[v,u]=m.useState(""),[j,y]=m.useState(s.content),[l,N]=m.useState(a===0),[C,d]=m.useState(!1),{replies:c,isLoadingReplies:x}=fs({commentId:s.id,trackId:r,showReplies:l,initialReplies:s.replies}),{createReplyMutation:w,updateCommentMutation:E,deleteCommentMutation:S,handleReplySubmit:I,handleEditSubmit:V,handleDelete:g}=gs({comment:s,trackId:r,callbacks:{onReplySuccess:()=>{u(""),n(!1),N(!0)},onEditSuccess:()=>h(!1),onDeleteSuccess:()=>d(!1)}}),D=a<xs,M=i?.id===s.user_id,fe=i?.id===s.user_id||i?.role==="admin",ge=P=>{V(P,j)},ve=P=>{I(P,v)};return e.jsxs(e.Fragment,{children:[e.jsx("div",{className:b("space-y-4 rounded-[var(--radius-lg)] p-3 -m-3 transition-[color,box-shadow] duration-[var(--duration-normal)]","hover:bg-muted/20 focus-within:ring-1 focus-within:ring-primary/20 focus-within:ring-inset focus-within:bg-muted/10",t),children:e.jsxs("div",{className:"flex gap-4",children:[e.jsx(Je,{src:s.user?.avatar,fallback:s.user?.username?.charAt(0).toUpperCase()||"U",size:"sm",className:"h-8 w-8 shrink-0"}),e.jsxs("div",{className:"flex-1 min-w-0 space-y-2",children:[e.jsx(vs,{comment:s,canEdit:M,canDelete:fe,onEdit:()=>h(!0),onDelete:()=>d(!0)}),e.jsx(ys,{comment:s,isEditing:f,editContent:j,onEditContentChange:y,onEditSubmit:ge,onEditCancel:()=>{h(!1),y(s.content)},isEditPending:E.isPending}),!f&&e.jsxs(e.Fragment,{children:[e.jsx(Ns,{canReply:D,hasUser:!!i,repliesCount:c.length,showReplies:l,onToggleReply:()=>n(!o),onToggleReplies:()=>N(!l)}),o&&i&&e.jsx(bs,{placeholder:`Répondre à ${s.user?.username}...`,value:v,onChange:u,onSubmit:ve,onCancel:()=>{n(!1),u("")},isPending:w.isPending}),e.jsx(He,{initial:!1,children:l&&e.jsx(L.div,{initial:{opacity:0,height:0},animate:{opacity:1,height:"auto"},exit:{opacity:0,height:0},transition:{type:"spring",stiffness:300,damping:30},className:"overflow-hidden",children:e.jsx(js,{isLoading:x,children:c.map(P=>e.jsx(xe,{comment:P,trackId:r,depth:a+1},P.id))})})})]})]})]})}),e.jsx(Ye,{open:C,onClose:()=>d(!1),onConfirm:g,title:"Supprimer le commentaire",description:"Êtes-vous sûr de vouloir supprimer ce commentaire ? Cette action est irréversible.",confirmLabel:"Supprimer",cancelLabel:"Annuler",variant:"destructive",isLoading:S.isPending})]})}function ws({rows:s=4,className:r}){return e.jsx("div",{className:b("space-y-4",r),"data-testid":"comment-section-skeleton",children:Array.from({length:Math.min(Math.max(s,1),6)}).map((a,t)=>e.jsx($,{},t))})}function Cs({className:s}){return e.jsx("div",{className:b("text-center text-muted-foreground/90 py-8 text-sm tracking-tight",s),"data-testid":"comment-section-empty",children:"Aucun commentaire pour le moment. Soyez le premier à commenter !"})}function ks({error:s,resourceId:r,onRetry:a,className:t}){return e.jsx("div",{className:b(t),"data-testid":"comment-section-error",children:e.jsx(q,{error:s,variant:"card",severity:"error",context:{action:"fetching comments",resource:"comments",resourceId:r},onRetry:a})})}function Es({value:s,onChange:r,onSubmit:a,placeholder:t="Écrire un commentaire...",maxLength:i=500,isPending:o=!1,isRateLimited:n=!1,hasUser:f,className:h}){const v=!s.trim()||o||n,u=f;return e.jsx("div",{className:b("transition-opacity duration-[var(--duration-normal)]",h),"data-testid":"comment-editor",children:u?e.jsxs("form",{onSubmit:a,className:"flex gap-2",children:[e.jsx(K,{value:s,onChange:j=>r(j.target.value),placeholder:t,maxLength:i}),e.jsx(k,{type:"submit",disabled:v,children:o?e.jsx(J,{size:"sm"}):e.jsx(B,{className:"h-4 w-4"})})]}):e.jsx("p",{className:"text-sm text-muted-foreground tracking-tight",children:"Connectez-vous pour commenter"})})}const Ss={visible:{transition:{staggerChildren:.06,delayChildren:.03}}},Ds={hidden:{opacity:0,y:10},visible:{opacity:1,y:0,transition:{type:"spring",stiffness:300,damping:30}}};function Ts({comments:s,trackId:r,className:a}){return e.jsx(L.ul,{className:b("space-y-4 list-none p-0 m-0",a),variants:Ss,initial:"hidden",animate:"visible","data-testid":"comment-list",children:s.map(t=>e.jsx(L.li,{variants:Ds,children:e.jsx(xe,{comment:t,trackId:r})},t.id))})}function Rs({page:s,totalPages:r,onPageChange:a,className:t}){return r<=1?null:e.jsxs("div",{className:b("flex items-center justify-center gap-2 pt-4",t),"data-testid":"comment-section-pagination",children:[e.jsx(k,{variant:"outline",size:"sm",onClick:()=>a(Math.max(1,s-1)),disabled:s===1,children:"Précédent"}),e.jsxs("span",{className:"text-sm text-muted-foreground/90 tracking-tight",children:["Page ",s," sur ",r]}),e.jsx(k,{variant:"outline",size:"sm",onClick:()=>a(Math.min(r,s+1)),disabled:s===r,children:"Suivant"})]})}const re=20;function Os({trackId:s}){const{data:r}=H(),a=F(),t=me(),i=Ge(),[o,n]=m.useState(""),[f,h]=m.useState(null),[v,u]=m.useState(1),[j,y]=m.useState(""),[l,N]=m.useState(0),{data:C,isLoading:d,error:c}=ue({queryKey:["trackComments",s,v],queryFn:()=>ds(s,v,re),enabled:!!s}),x=Q({mutationFn:g=>he(s,g),onMutate:async g=>{await t.cancelQueries({queryKey:["trackComments",s]});const D=t.getQueryData(["trackComments",s,v]);if(D&&r){const M={id:`temp-${Date.now()}`,track_id:s,user_id:r.id,content:g.trim(),is_edited:!1,created_at:new Date().toISOString(),updated_at:new Date().toISOString(),user:{id:r.id,username:r.username||"",avatar:r.avatar_url}};t.setQueryData(["trackComments",s,v],{...D,comments:[M,...D.comments],total:(D.total||0)+1})}return{previousComments:D}},onError:(g,D,M)=>{M?.previousComments&&t.setQueryData(["trackComments",s,v],M.previousComments),h(new Error(g.message||"Erreur lors de la publication")),y(o.trim())},onSuccess:()=>{t.invalidateQueries({queryKey:["trackComments",s]}),n(""),h(null),N(0),y(""),a.success("Commentaire publié")}}),w=g=>{g.preventDefault(),!(!o.trim()||!r)&&(y(o.trim()),x.mutate(o.trim()))},E=async()=>{if(!(!j||l>=3)){N(g=>g+1);try{await x.mutateAsync(j)}catch{}}},S=C?.comments?.filter(g=>!g.parent_id)||[],I=C?.total||0,V=Math.ceil(I/re);return e.jsxs(T,{children:[e.jsx(hs,{count:C?.total??0}),e.jsxs(be,{className:"space-y-4",children:[f&&e.jsx(q,{error:f,variant:"banner",severity:"error",context:{action:"publishing comment",resource:"comment"},onRetry:l<3?E:void 0,onDismiss:()=>{h(null),N(0),y("")}}),e.jsx(Es,{value:o,onChange:n,onSubmit:w,isPending:x.isPending,isRateLimited:!!i,hasUser:!!r}),d?e.jsx(ws,{rows:4}):c?e.jsx(ks,{error:c instanceof Error?c:new Error("Failed to load comments"),resourceId:s,onRetry:()=>t.invalidateQueries({queryKey:["trackComments",s]})}):S.length===0?e.jsx(Cs,{}):e.jsxs(e.Fragment,{children:[e.jsx(Ts,{comments:S,trackId:s}),e.jsx(Rs,{page:v,totalPages:V,onPageChange:u})]})]})]})}function As({open:s,onClose:r,trackId:a}){const[t,i]=m.useState(null),[o,n]=m.useState(!1),[f,h]=m.useState(!1),[v,u]=m.useState(null),[j,y]=m.useState(0),l=m.useRef(null),N=F();m.useEffect(()=>{s&&!t&&C()},[s]);const C=async()=>{const w=async()=>{const E=new Date;E.setDate(E.getDate()+7);const S=await ss.createShare(a,{permissions:"read",expires_at:E.toISOString()});i(S),u(null),y(0),l.current=null};l.current=w,n(!0),u(null);try{await w()}catch(E){const S=je(E);u(new Error(S.message))}finally{n(!1)}},d=async()=>{if(!(!l.current||j>=3)){y(w=>w+1),n(!0);try{await l.current()}catch{}finally{n(!1)}}},c=async()=>{if(!t)return;const w=`${window.location.origin}/tracks/shared/${t.token}`;try{await navigator.clipboard.writeText(w),h(!0),N.success("Link copied to clipboard"),setTimeout(()=>h(!1),2e3)}catch{N.error("Failed to copy link")}},x=t?`${window.location.origin}/tracks/shared/${t.token}`:"";return e.jsx(we,{open:s,onClose:r,title:"Share Track",variant:"default",size:"md",children:e.jsxs("div",{className:"space-y-4 transition-opacity duration-[var(--duration-normal)]",children:[v&&e.jsx(q,{error:v,variant:"banner",severity:"error",context:{action:"creating share link",resource:"track",resourceId:a},onRetry:j<3?d:void 0,onDismiss:()=>{u(null),y(0),l.current=null}}),o?e.jsx("div",{className:"text-center py-4 text-muted-foreground/90 tracking-tight",children:"Creating share link..."}):t?e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx(Xe,{className:"text-muted-foreground/90 tracking-tight",children:"Share Link"}),e.jsxs("div",{className:"flex gap-2",children:[e.jsx(K,{value:x,readOnly:!0,className:"flex-1 rounded-[var(--radius-md)] transition-[border-color] duration-[var(--duration-normal)]"}),e.jsx(k,{onClick:c,variant:"outline",className:"rounded-[var(--radius-md)] transition-[color,transform] duration-[var(--duration-normal)] active:scale-95",children:f?e.jsx(Ae,{className:"h-4 w-4 text-success"}):e.jsx(Y,{className:"h-4 w-4"})})]})]}),e.jsx("div",{className:"text-xs text-muted-foreground/90 tracking-tight",children:"This link will expire in 7 day(s)"}),e.jsxs("div",{className:"flex justify-end gap-2 pt-4",children:[e.jsx(k,{variant:"outline",onClick:r,className:"rounded-[var(--radius-md)] transition-colors duration-[var(--duration-normal)]",children:"Close"}),e.jsxs(k,{onClick:c,className:"rounded-[var(--radius-md)] transition-[color,transform] duration-[var(--duration-normal)] active:scale-95",children:[e.jsx(Y,{className:"mr-2 h-4 w-4"}),"Copy Link"]})]})]}):e.jsx("div",{className:"text-center text-destructive tracking-tight",children:"Failed to create share link"})]})})}class R extends Error{constructor(r,a,t=!1,i){super(r),this.code=a,this.retryable=t,this.originalError=i,this.name="TrackHistoryError"}}async function _s(s,r){try{const a=new URLSearchParams;r?.limit!==void 0&&a.append("limit",r.limit.toString()),r?.offset!==void 0&&a.append("offset",r.offset.toString());const t=a.toString(),i=`/tracks/${s}/history${t?`?${t}`:""}`;return(await A.get(i)).data}catch(a){if(a instanceof _){if(a.response?.status===400)throw new R("Requête invalide: ID de track invalide","VALIDATION",!1,a);if(a.response?.status===404)throw new R("Track introuvable","NOT_FOUND",!1,a);if(a.response?.status===500)throw new R("Erreur serveur: Impossible de récupérer l'historique. Veuillez réessayer plus tard.","SERVER",!0,a);if(a.code==="ECONNABORTED"||a.code==="ETIMEDOUT"||!a.response)throw new R("Erreur réseau: Impossible de se connecter au serveur. Veuillez vérifier votre connexion.","NETWORK",!0,a);const t=a.response?.data?.error||a.message||"Échec de la récupération de l'historique";throw new R(t,"UNKNOWN",!1,a)}throw a instanceof R?a:new R("Erreur inconnue lors de la récupération de l'historique","UNKNOWN",!1,a)}}function Is(s,r){const[a,t]=m.useState([]),[i,o]=m.useState(!0),[n,f]=m.useState(null),[h,v]=m.useState(0),[u,j]=m.useState(0),y=m.useCallback(async()=>{o(!0),f(null);try{const c=await _s(s,{limit:r,offset:u});t(c.history),v(c.total)}catch(c){c instanceof R?f(c.message):f("Impossible de charger l'historique")}finally{o(!1)}},[s,u,r]);m.useEffect(()=>{y()},[y]);const l=u>0,N=u+r<h,C=m.useCallback(()=>{u>0&&j(c=>Math.max(0,c-r))},[u,r]),d=m.useCallback(()=>{u+r<h&&j(c=>c+r)},[u,r,h]);return{history:a,loading:i,error:n,total:h,currentOffset:u,limit:r,hasPreviousPage:l,hasNextPage:N,handlePreviousPage:C,handleNextPage:d,reload:y}}function Ms({total:s}){return e.jsx("div",{className:"flex items-center justify-between",children:e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(G,{className:"h-5 w-5 text-primary/90","aria-hidden":!0}),e.jsx("h3",{className:"text-lg font-semibold tracking-tight text-foreground",children:"Historique des modifications"}),s>0&&e.jsxs("span",{className:"text-sm text-muted-foreground/90 tracking-tight",children:["(",s,")"]})]})})}function Ps(){return e.jsxs("div",{className:"text-center py-8 text-muted-foreground/90 text-sm tracking-tight rounded-[var(--radius-xl)]",children:[e.jsx(G,{className:"h-12 w-12 mx-auto mb-4 opacity-50 transition-opacity duration-[var(--duration-normal)]","aria-hidden":!0}),e.jsx("p",{children:"Aucune modification enregistrée"})]})}function Ls(s){const r=new Date(s);return Number.isNaN(r.getTime())?s:new Intl.DateTimeFormat("fr-FR",{year:"numeric",month:"long",day:"numeric",hour:"2-digit",minute:"2-digit"}).format(r)}function Vs(s){switch(s){case"created":return ne;case"updated":return Me;case"deleted":return le;case"published":return de;case"unpublished":return Ie;case"restored":return _e;default:return G}}function Qs(s){switch(s){case"created":return"Créé";case"updated":return"Modifié";case"deleted":return"Supprimé";case"published":return"Publié";case"unpublished":return"Dépublié";case"restored":return"Restauré";default:return s}}function qs(s){switch(s){case"created":return"text-success bg-success/10";case"updated":return"text-muted-foreground bg-muted";case"deleted":return"text-destructive bg-destructive/10";case"published":return"text-primary bg-primary/10";case"unpublished":return"text-warning bg-warning/10";case"restored":return"text-primary bg-primary/10";default:return"text-muted-foreground bg-muted"}}function te(s){if(!s)return null;try{return JSON.parse(s)}catch{return s}}function ae(s){return s==null?"":typeof s=="string"?s:typeof s=="object"?JSON.stringify(s,null,2):String(s)}function Ks({item:s}){const r=Vs(s.action),a=qs(s.action),t=te(s.old_value),i=te(s.new_value);return e.jsxs("div",{className:"relative flex gap-4 transition-colors duration-[var(--duration-normal)]",children:[e.jsx("div",{className:b("relative z-10 flex h-12 w-12 shrink-0 items-center justify-center rounded-full border-2 border-background",a),children:e.jsx(r,{className:"h-5 w-5","aria-hidden":!0})}),e.jsxs("div",{className:"flex-1 min-w-0 space-y-2 pb-6",children:[e.jsxs("div",{className:"flex items-center justify-between gap-2 flex-wrap",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:b("text-sm font-semibold tracking-tight",a.split(" ")[0]),children:Qs(s.action)}),e.jsxs("span",{className:"text-xs text-muted-foreground/90 tracking-tight",children:["#",s.id]})]}),e.jsxs("div",{className:"flex items-center gap-1 text-xs text-muted-foreground/90 tracking-tight",children:[e.jsx(Pe,{className:"h-3 w-3 shrink-0","aria-hidden":!0}),e.jsx("span",{children:Ls(s.created_at)})]})]}),(t!==null||i!==null)&&e.jsxs("div",{className:"space-y-2 rounded-[var(--radius-lg)] border border-border/80 bg-muted/50 p-4 text-sm transition-colors duration-[var(--duration-normal)]",children:[t!==null&&e.jsxs("div",{children:[e.jsx("div",{className:"text-xs font-medium text-muted-foreground/90 mb-1 tracking-tight",children:"Ancienne valeur:"}),e.jsx("pre",{className:"text-xs bg-background rounded-[var(--radius-md)] p-2 overflow-x-auto tracking-tight",children:ae(t)})]}),i!==null&&e.jsxs("div",{children:[e.jsx("div",{className:"text-xs font-medium text-muted-foreground/90 mb-1 tracking-tight",children:"Nouvelle valeur:"}),e.jsx("pre",{className:"text-xs bg-background rounded-[var(--radius-md)] p-2 overflow-x-auto tracking-tight",children:ae(i)})]})]})]})]})}function zs({currentOffset:s,limit:r,total:a,hasPreviousPage:t,hasNextPage:i,onPrevious:o,onNext:n}){return e.jsxs("div",{className:"flex items-center justify-between border-t border-border/80 pt-4 transition-colors duration-[var(--duration-normal)]",children:[e.jsxs("div",{className:"text-sm text-muted-foreground/90 tracking-tight tabular-nums",children:["Affichage ",s+1," -"," ",Math.min(s+r,a)," sur ",a]}),e.jsxs("div",{className:"flex gap-2",children:[e.jsxs(k,{variant:"outline",size:"sm",onClick:o,disabled:!t,children:[e.jsx(Le,{className:"h-4 w-4 mr-1"}),"Précédent"]}),e.jsxs(k,{variant:"outline",size:"sm",onClick:n,disabled:!i,children:["Suivant",e.jsx(Ve,{className:"h-4 w-4 ml-1"})]})]})]})}function Us(){return e.jsxs("div",{className:"space-y-4 min-h-layout-story",children:[e.jsx("div",{className:"flex items-center justify-between",children:e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("div",{className:"h-5 w-5 rounded-[var(--radius-md)] bg-muted animate-pulse"}),e.jsx("div",{className:"h-6 w-52 rounded-[var(--radius-md)] bg-muted animate-pulse"}),e.jsx("div",{className:"h-4 w-8 rounded-[var(--radius-md)] bg-muted animate-pulse"})]})}),e.jsxs("div",{className:"relative space-y-6",children:[e.jsx("div",{className:"absolute left-6 top-0 bottom-0 w-0.5 bg-border/80"}),[1,2,3].map(s=>e.jsxs("div",{className:"relative flex gap-4",children:[e.jsx("div",{className:"relative z-10 h-12 w-12 shrink-0 rounded-full bg-muted animate-pulse"}),e.jsxs("div",{className:"flex-1 min-w-0 space-y-2 pb-6",children:[e.jsxs("div",{className:"flex items-center justify-between gap-2",children:[e.jsx("div",{className:"h-4 w-24 rounded-[var(--radius-md)] bg-muted animate-pulse"}),e.jsx("div",{className:"h-3 w-32 rounded-[var(--radius-md)] bg-muted animate-pulse"})]}),e.jsx("div",{className:"h-16 rounded-[var(--radius-lg)] bg-muted animate-pulse"})]})]},s))]})]})}function $s({trackId:s,className:r,limit:a=50}){const{history:t,loading:i,error:o,total:n,currentOffset:f,limit:h,hasPreviousPage:v,hasNextPage:u,handlePreviousPage:j,handleNextPage:y}=Is(s,a);return i?e.jsx("div",{className:b("min-h-layout-story",r),children:e.jsx(Us,{})}):o?e.jsx("div",{className:b("p-4",r),children:e.jsx(ts,{variant:"destructive",className:"rounded-[var(--radius-xl)]",children:e.jsx(as,{className:"tracking-tight",children:o})})}):e.jsxs("div",{className:b("space-y-4 transition-opacity duration-[var(--duration-normal)]",r),children:[e.jsx(Ms,{total:n}),t.length===0?e.jsx(Ps,{}):e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"relative",children:[e.jsx("div",{className:"absolute left-6 top-0 bottom-0 w-0.5 bg-border/80 transition-colors duration-[var(--duration-normal)]"}),e.jsx("div",{className:"space-y-6",children:t.map(l=>e.jsx(Ks,{item:l},l.id))})]}),n>h&&e.jsx(zs,{currentOffset:f,limit:h,total:n,hasPreviousPage:v,hasNextPage:u,onPrevious:j,onNext:y})]})]})}async function Hs(s){try{return(await A.get(`/tracks/${s}/stats`)).data.stats}catch(r){if(r instanceof _){if(r.response?.status===404)throw new O("Track introuvable","VALIDATION",!1,r);if(r.response?.status===500)throw new O("Erreur serveur: Impossible de récupérer les statistiques. Veuillez réessayer plus tard.","SERVER",!0,r);if(r.code==="ECONNABORTED"||r.code==="ETIMEDOUT"||!r.response)throw new O("Erreur réseau: Impossible de se connecter au serveur.","NETWORK",!0,r);const a=r.response?.data?.error||r.message||"Échec de la récupération des statistiques";throw new O(a,"UNKNOWN",!1,r)}throw r instanceof O?r:new O("Erreur inconnue lors de la récupération des statistiques","UNKNOWN",!1,r)}}function Fs({trackId:s,className:r,variant:a="horizontal",showLabels:t=!1}){const[i,o]=m.useState(null),[n,f]=m.useState(!0),[h,v]=m.useState(null);m.useEffect(()=>{(async()=>{f(!0),v(null);try{const N=await Hs(s);o(N)}catch(N){v(N instanceof O?N.message:"Telemetry interrupted")}finally{f(!1)}})()},[s]);const u=l=>l>=1e6?`${(l/1e6).toFixed(1)}M`:l>=1e3?`${(l/1e3).toFixed(1)}K`:l.toString(),j=l=>{const N=Math.floor(l/3600),C=Math.floor(l%3600/60),d=l%60;return N>0?`${N}h ${C}m`:C>0?`${C}m ${d}s`:`${d}s`};if(n)return e.jsxs("div",{className:b("flex h-10 items-center gap-2 text-xs font-mono text-muted-foreground/90 tracking-tight","animate-pulse transition-opacity duration-[var(--duration-normal)]"),children:[e.jsx(Qe,{className:"w-3 h-3 animate-spin"}),"SCANNING..."]});if(h||!i)return null;const y=[{icon:de,value:u(i.views),label:"Views",color:"text-chart-1",bg:"bg-chart-1/10"},{icon:ie,value:u(i.likes),label:"Likes",color:"text-chart-2",bg:"bg-chart-2/10"},{icon:W,value:u(i.comments),label:"Comms",color:"text-chart-3",bg:"bg-chart-3/10"},{icon:qe,value:u(i.downloads),label:"Data",color:"text-chart-4",bg:"bg-chart-4/10"},{icon:oe,value:j(i.total_play_time),label:"Pulse",color:"text-primary",bg:"bg-primary/10"}];return a==="grid"?e.jsx("div",{className:b("grid grid-cols-2 md:grid-cols-5 gap-3 transition-opacity duration-[var(--duration-normal)]",r),children:y.map((l,N)=>{const C=l.icon;return e.jsxs(T,{variant:"outline",className:b("p-3 border-border flex flex-col items-center gap-1","hover:border-primary/30 hover:shadow-md transition-[border-color,box-shadow,transform] duration-[var(--duration-normal)]"),children:[e.jsx("div",{className:b("p-2 rounded-[var(--radius-md)] mb-1 transition-transform duration-[var(--duration-normal)] hover:scale-105",l.bg,l.color),children:e.jsx(C,{className:"w-4 h-4"})}),e.jsx("div",{className:"text-lg font-display font-bold text-foreground tabular-nums tracking-tight",children:l.value}),e.jsx("div",{className:"text-xs font-mono text-muted-foreground/90 uppercase tracking-widest",children:l.label})]},N)})}):e.jsx("div",{className:b("flex flex-wrap items-center gap-6 transition-opacity duration-[var(--duration-normal)]",r),children:y.map((l,N)=>{const C=l.icon;return e.jsxs("div",{className:"flex items-center gap-2 group cursor-default",children:[e.jsx("div",{className:b("p-1.5 rounded-[var(--radius-md)] opacity-80 group-hover:opacity-100 transition-[opacity,transform] duration-[var(--duration-normal)]",l.bg,l.color),children:e.jsx(C,{className:"w-3.5 h-3.5","aria-hidden":!0})}),e.jsxs("div",{className:"flex flex-col",children:[e.jsx("span",{className:"text-sm font-bold text-foreground tabular-nums tracking-tight group-hover:text-primary transition-colors duration-[var(--duration-normal)]",children:l.value}),t&&e.jsx("span",{className:"text-xs font-mono text-muted-foreground/90 uppercase tracking-wider",children:l.label})]})]},N)})})}function Ws({track:s,isShareDialogOpen:r,onShareDialogClose:a}){const t=parseInt(s.id,10)||0;return e.jsxs(e.Fragment,{children:[e.jsxs(Ue,{defaultValue:"comments",className:"w-full",children:[e.jsxs($e,{className:"bg-transparent border-b border-white/10 w-full justify-start h-auto p-0 gap-8 mb-6 rounded-none",children:[e.jsxs(z,{value:"comments",className:"rounded-none border-b-2 border-transparent data-[state=active]:bg-transparent data-[state=active]:border-primary data-[state=active]:text-primary py-3 px-0 text-lg font-display bg-transparent",children:["Discussion ",e.jsx("span",{className:"ml-2 text-xs bg-white/10 px-2 py-0.5 rounded-full text-muted-foreground align-middle",children:"24"})]}),e.jsx(z,{value:"analytics",className:"rounded-none border-b-2 border-transparent data-[state=active]:bg-transparent data-[state=active]:border-primary data-[state=active]:text-primary py-3 px-0 text-lg font-display bg-transparent",children:"Analytics"}),e.jsx(z,{value:"history",className:"rounded-none border-b-2 border-transparent data-[state=active]:bg-transparent data-[state=active]:border-primary data-[state=active]:text-primary py-3 px-0 text-lg font-display bg-transparent",children:"History"})]}),e.jsx(U,{value:"comments",className:"animate-fade-in",children:e.jsx(Os,{trackId:s.id})}),e.jsx(U,{value:"analytics",className:"animate-fade-in",children:e.jsxs(T,{variant:"glass",className:"p-6",children:[e.jsxs("div",{className:"flex items-center gap-3 mb-6",children:[e.jsx(Ke,{className:"w-5 h-5 text-primary"}),e.jsx("h3",{className:"text-xl font-bold",children:"Performance Data"})]}),e.jsx(Fs,{trackId:t,variant:"horizontal",showLabels:!0})]})}),e.jsx(U,{value:"history",className:"animate-fade-in",children:e.jsxs(T,{variant:"glass",className:"p-6",children:[e.jsx("h3",{className:"text-xl font-bold mb-6",children:"Version History"}),e.jsx($s,{trackId:s.id,limit:20})]})})]}),e.jsx(As,{open:r,onClose:a,trackId:s.id,trackTitle:s.title})]})}function Bs({error:s,onRetry:r}){const a=pe();return e.jsx("div",{className:"container mx-auto px-4 py-8 flex flex-col items-center justify-center min-h-layout-page",children:e.jsx(q,{error:s||new Error("Track not found"),variant:"card",severity:"error",onRetry:r,actions:[{label:"Go Back",onClick:()=>a(-1),variant:"outline"}]})})}function Gs(){return e.jsxs("div",{className:"min-h-layout-page pb-24 relative overflow-hidden bg-background transition-opacity duration-[var(--duration-normal)]",children:[e.jsx("div",{className:"absolute inset-0 h-[60vh] bg-muted/30 pointer-events-none"}),e.jsxs("div",{className:"container mx-auto px-4 relative z-10 pt-8",children:[e.jsx("div",{className:"h-10 w-24 bg-muted animate-pulse rounded-full mb-8"}),e.jsxs("div",{className:"grid grid-cols-1 lg:grid-cols-12 gap-12 items-start",children:[e.jsxs("div",{className:"lg:col-span-4 space-y-8",children:[e.jsx("div",{className:"aspect-square rounded-[var(--radius-2xl)] bg-muted animate-pulse"}),e.jsx(T,{variant:"glass",className:"p-4 border-white/5 bg-black/30 backdrop-blur-xl",children:e.jsxs("div",{className:"flex gap-3",children:[e.jsx("div",{className:"flex-1 h-12 bg-muted animate-pulse rounded-[var(--radius-md)]"}),e.jsx("div",{className:"h-12 w-12 bg-muted animate-pulse rounded-[var(--radius-lg)]"}),e.jsx("div",{className:"h-12 w-12 bg-muted animate-pulse rounded-[var(--radius-lg)]"})]})}),e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[e.jsxs(T,{variant:"glass",className:"p-4 bg-black/20",children:[e.jsx("div",{className:"h-5 w-8 bg-muted animate-pulse rounded-[var(--radius-md)] mx-auto mb-2"}),e.jsx("div",{className:"h-4 w-12 bg-muted animate-pulse rounded-[var(--radius-md)] mx-auto"})]}),e.jsxs(T,{variant:"glass",className:"p-4 bg-black/20",children:[e.jsx("div",{className:"h-5 w-8 bg-muted animate-pulse rounded-[var(--radius-md)] mx-auto mb-2"}),e.jsx("div",{className:"h-4 w-12 bg-muted animate-pulse rounded-[var(--radius-md)] mx-auto"})]})]})]}),e.jsxs("div",{className:"lg:col-span-8 space-y-8",children:[e.jsxs("div",{children:[e.jsx("div",{className:"h-12 w-3/4 max-w-xl bg-muted animate-pulse rounded-[var(--radius-md)] mb-4"}),e.jsx("div",{className:"h-6 w-48 bg-muted animate-pulse rounded-[var(--radius-md)] mb-6"}),e.jsxs("div",{className:"flex gap-3",children:[e.jsx("div",{className:"h-8 w-20 bg-muted animate-pulse rounded-full"}),e.jsx("div",{className:"h-8 w-24 bg-muted animate-pulse rounded-full"})]})]}),e.jsx("div",{className:"h-24 w-full bg-muted animate-pulse rounded-[var(--radius-lg)]"}),e.jsxs("div",{className:"space-y-4",children:[e.jsx("div",{className:"h-10 w-full max-w-md bg-muted animate-pulse rounded-[var(--radius-md)]"}),e.jsx("div",{className:"h-64 w-full bg-muted animate-pulse rounded-[var(--radius-xl)]"})]})]})]})]})]})}function Js(s){const{id:r}=ns(),a=s??r??"",[t,i]=m.useState(null),[o,n]=m.useState(!0),[f,h]=m.useState(null),[v,u]=m.useState(!1),{play:j,pause:y,currentTrack:l,isPlaying:N,addToQueue:C}=Ce(),d=m.useCallback(async()=>{if(!a){h(new Error("Track ID is required")),n(!1);return}try{n(!0),h(null);const g=await rs(a);i(g)}catch(g){const D=g instanceof O||g instanceof Error?g.message:"Failed to load track";h(new Error(D))}finally{n(!1)}},[a]);m.useEffect(()=>{d()},[d]);const c=g=>({id:g.id,title:g.title,artist:g.artist,album:g.album,duration:g.duration,url:g.stream_manifest_url||g.file_path,cover:g.cover_art_path,genre:g.genre}),x=()=>{t&&j(c(t))},w=()=>y(),E=()=>{t&&(C([c(t)]),ke.success("Added to queue"))},S=()=>u(!0),I=l?.id===t?.id;return{id:a,track:t,isLoading:o,error:f,loadTrack:d,isShareDialogOpen:v,setIsShareDialogOpen:u,handlePlay:x,handlePause:w,handleAddToQueue:E,handleShare:S,isCurrentTrack:I,isCurrentlyPlaying:I&&N}}function pr(s){const r=s?.trackId,a=pe(),{track:t,isLoading:i,error:o,loadTrack:n,isShareDialogOpen:f,setIsShareDialogOpen:h,handlePlay:v,handlePause:u,handleAddToQueue:j,handleShare:y,isCurrentlyPlaying:l}=Js(r);return i?e.jsx(Gs,{}):o||!t?e.jsx(Bs,{error:o,onRetry:n}):e.jsxs("div",{className:"min-h-layout-page pb-24 relative overflow-hidden bg-background",children:[e.jsx(is,{track:t}),e.jsxs("div",{className:"container mx-auto px-4 relative z-10 pt-8",children:[e.jsxs(k,{onClick:()=>a(-1),variant:"ghost",className:"mb-6 rounded-full hover:bg-white/10",children:[e.jsx(ze,{className:"h-4 w-4 mr-2"})," Back"]}),e.jsxs("div",{className:"grid grid-cols-1 lg:grid-cols-12 gap-12 items-start",children:[e.jsx(os,{track:t,isCurrentlyPlaying:l,onPlay:v,onPause:u,onAddToQueue:j,onShare:y}),e.jsxs("div",{className:"lg:col-span-8 space-y-8",children:[e.jsx(cs,{track:t}),e.jsx(Ws,{track:t,isShareDialogOpen:f,onShareDialogClose:()=>h(!1)})]})]})]})]})}export{pr as TrackDetailPage,Bs as TrackDetailPageNotFound,Gs as TrackDetailPageSkeleton};
|