veza/apps/web/dist_verification/assets/LibraryPage-55ubQtbB.js

6 lines
15 KiB
JavaScript

import{a as o,j as e}from"./vendor-react-BHG7lGYR.js";import{u as ce,a as de}from"./vendor-tanstack-BzWBL1hV.js";import{g as me,t as ue}from"./tracks-Bqg0pqgn.js";import{j as xe,D as he,k as pe,B as v,m as fe,l as je,n as ge,d as _}from"./index-BWcMVITa.js";import{I as L}from"./input-BGBI2Wze.js";import{u as we,D as be,a as Ne,b as ve,c as Q}from"./useIsRateLimited-HpmSVPdB.js";import{F as ye}from"./vendor-IYr-MHu4.js";import{P as ke}from"./progress-BQIngDvS.js";import{L as P}from"./label-N1Bsuay_.js";import{A as $}from"./alert-tey2YzVZ.js";import{as as z,X as Ce,A as Se,a9 as Le,h as X,ae as Ae,n as De,at as Ee,L as Te,ah as Me,au as Fe,a3 as K,g as Re,aj as Pe,D as ze,T as Ue}from"./vendor-icons-DaGlTw4_.js";import{c as Ie}from"./vendor-router-D-s5vIeO.js";import{f as W,d as Y}from"./vendor-utils-CgOSfOkx.js";import"./dropdown-BYn_8IId.js";const B={all:["library"],tracks:m=>[...B.all,"tracks",{userId:m}]};function Ve(m=1,p=50){const{user:i}=xe();return ce({queryKey:[...B.tracks(i?.id),{page:m,limit:p}],queryFn:()=>me({userId:i?.id,page:m,limit:p}),enabled:!!i?.id,placeholderData:f=>f})}const _e=100*1024*1024,qe={"audio/mpeg":[".mp3"],"audio/wav":[".wav"],"audio/ogg":[".ogg"],"audio/flac":[".flac"],"audio/mp4":[".m4a"],"audio/aac":[".aac"]},q=3;function Be({open:m,onClose:p}){const[i,f]=o.useState(null),[y,u]=o.useState(0),[n,g]=o.useState(!1),[k,c]=o.useState(null),[A,x]=o.useState(null),[C,w]=o.useState(!1),[b,S]=o.useState(0),[j,h]=o.useState(!1),s=we(),l=de(),[N,U]=o.useState({file:null,title:"",artist:"",album:"",genre:""}),[Z,I]=o.useState({}),D=t=>({value:N[t],onChange:a=>{U(d=>({...d,[t]:a.target.value}))}}),E=(t,a)=>{U(d=>({...d,[t]:a}))},T=()=>N,H=()=>{U({file:null,title:"",artist:"",album:"",genre:""}),I({})},J=(t,a)=>d=>{if(d.preventDefault(),!N.file){I({file:"Veuillez sélectionner un fichier"}),a?.({file:{message:"Veuillez sélectionner un fichier"}});return}I({}),t(N)},G=Z,ee=o.useCallback(t=>{const a=t[0];if(a){f(a),c(null),h(!1),E("file",a);const d=a.name.replace(/\.[^/.]+$/,"");T()||E("title",d)}},[E,T]),{getRootProps:se,getInputProps:te,isDragActive:O}=ye({onDrop:ee,accept:qe,maxSize:_e,multiple:!1,onError:t=>{c(`Erreur lors de la sélection du fichier: ${t.message}`)},onDropRejected:t=>{const a=t[0];a.errors[0]?.code==="file-too-large"?c("Le fichier est trop volumineux (max 100 MB)"):a.errors[0]?.code==="file-invalid-type"?c("Format de fichier non supporté. Formats acceptés: MP3, WAV, OGG, FLAC, M4A, AAC"):c(a.errors[0]?.message||"Erreur lors de la sélection du fichier")}}),M=o.useCallback(async(t,a=1)=>{if(!t.file){c("Veuillez sélectionner un fichier"),x(null),w(!1);return}g(!0),c(null),x(null),w(!1),h(!1),u(0);try{const d={title:t.title||t.file.name.replace(/\.[^/.]+$/,""),artist:t.artist,album:t.album,genre:t.genre,is_public:!1};await ue.create(t.file,d,r=>{u(r)}),h(!0),u(100),S(0),l.invalidateQueries({queryKey:B.all}),l.invalidateQueries({queryKey:["tracks"]}),setTimeout(()=>{V()},1500)}catch(d){let r="Erreur lors de l'upload",F=null,R=!1;if(d instanceof Error){r=d.message;const oe=r.toLowerCase().includes("network")||r.toLowerCase().includes("réseau")||r.toLowerCase().includes("timeout")||r.toLowerCase().includes("econnaborted")||r.toLowerCase().includes("etimedout")||r.toLowerCase().includes("se connecter"),ie=r.toLowerCase().includes("serveur")||r.toLowerCase().includes("server")||r.toLowerCase().includes("500")||r.toLowerCase().includes("503")||r.toLowerCase().includes("502"),ne=r.toLowerCase().includes("format")||r.toLowerCase().includes("taille")||r.toLowerCase().includes("invalide")||r.toLowerCase().includes("trop volumineux")||r.toLowerCase().includes("non supporté")||r.toLowerCase().includes("400")||r.toLowerCase().includes("413")||r.toLowerCase().includes("415");oe?(F="NETWORK",R=a<q):ie?(F="SERVER",R=a<q):ne&&(F="VALIDATION",R=!1)}c(r),x(F),w(R),u(0),S(a)}finally{g(!1)}},[l]),re=o.useCallback(async t=>{await M(t,1)},[M]),ae=o.useCallback(()=>{const t=T(),a=b+1;M(t,a)},[b,T,M]),V=()=>{n||(f(null),u(0),c(null),x(null),w(!1),S(0),h(!1),H(),p())},le=()=>{f(null),c(null),h(!1),u(0),E("file",null)};return e.jsx(he,{open:m,onClose:V,title:"Uploader un fichier audio",size:"lg",children:e.jsxs("form",{id:"upload-track-form",onSubmit:J(re,t=>{je.warn("Form validation errors:",{errors:t})}),children:[e.jsx(pe,{children:e.jsxs("div",{className:"space-y-6",children:[i?e.jsx("div",{className:"border rounded-lg p-4","data-testid":"upload-file-display",children:e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{className:"flex items-center gap-4",children:[e.jsx(z,{className:"h-8 w-8 text-primary"}),e.jsxs("div",{children:[e.jsx("p",{className:"font-medium","data-testid":"upload-file-name",children:i.name}),e.jsxs("p",{className:"text-sm text-muted-foreground",children:[(i.size/1024/1024).toFixed(2)," MB"]})]})]}),!n&&e.jsx(v,{type:"button",variant:"ghost",size:"icon",onClick:le,className:"h-8 w-8",children:e.jsx(Ce,{className:"h-4 w-4"})})]})}):e.jsxs("div",{...se(),className:`
border-2 border-dashed rounded-lg p-12 text-center cursor-pointer
transition-colors
${O?"border-primary bg-primary/5":"border-muted-foreground/25"}
hover:border-primary hover:bg-primary/5
`,children:[e.jsx("input",{...te()}),e.jsx(z,{className:"mx-auto h-12 w-12 text-muted-foreground mb-4"}),e.jsx("p",{className:"text-lg font-medium mb-2",children:O?"Déposez le fichier ici":"Glissez-déposez un fichier audio"}),e.jsx("p",{className:"text-sm text-muted-foreground mb-4",children:"ou cliquez pour sélectionner"}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Formats acceptés: MP3, WAV, OGG, FLAC, M4A, AAC (max 100 MB)"})]}),n&&e.jsxs("div",{className:"space-y-2",children:[e.jsxs("div",{className:"flex items-center justify-between text-sm",children:[e.jsx("span",{children:"Upload en cours..."}),e.jsxs("span",{children:[y,"%"]})]}),e.jsx(ke,{value:y})]}),k&&e.jsx($,{variant:"destructive","data-testid":"upload-error",children:e.jsxs("div",{className:"flex items-start gap-4",children:[e.jsx(Se,{className:"h-4 w-4 mt-0.5 shrink-0"}),e.jsxs("div",{className:"flex-1 space-y-2",children:[e.jsxs("div",{children:[e.jsx("p",{className:"font-medium",children:k}),A&&e.jsxs("p",{className:"text-xs text-muted-foreground mt-1",children:["Code d'erreur: ",A]}),b>0&&e.jsxs("p",{className:"text-xs text-muted-foreground mt-1",children:["Tentative ",b,"/",q]})]}),C&&e.jsxs(v,{type:"button",variant:"outline",size:"sm",onClick:ae,disabled:n,className:"mt-2",children:[e.jsx(Le,{className:"h-4 w-4 mr-2"}),"Réessayer"]})]})]})}),j&&e.jsxs($,{className:"bg-kodo-lime/10 border-kodo-lime text-kodo-lime",children:[e.jsx(X,{className:"h-4 w-4"}),e.jsx("span",{children:"Fichier uploadé avec succès !"})]}),i&&!n&&!j&&e.jsxs("div",{className:"space-y-4 border-t pt-4",children:[e.jsx("h3",{className:"font-medium",children:"Métadonnées (optionnel)"}),e.jsxs("div",{className:"grid grid-cols-2 gap-4",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx(P,{htmlFor:"title",children:"Titre *"}),e.jsx(L,{id:"title",...D("title"),placeholder:"Titre du morceau"}),G.title&&e.jsx("p",{className:"text-sm text-destructive",children:G.title.message})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(P,{htmlFor:"artist",children:"Artiste"}),e.jsx(L,{id:"artist",...D("artist"),placeholder:"Nom de l'artiste"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(P,{htmlFor:"album",children:"Album"}),e.jsx(L,{id:"album",...D("album"),placeholder:"Nom de l'album"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(P,{htmlFor:"genre",children:"Genre"}),e.jsx(L,{id:"genre",...D("genre"),placeholder:"Genre musical"})]})]})]})]})}),e.jsxs(fe,{children:[e.jsx(v,{variant:"outline",onClick:V,disabled:n,type:"button",children:j?"Fermer":"Annuler"}),!j&&e.jsxs(v,{type:"submit",form:"upload-track-form",disabled:!i||n||s,className:"gap-2",children:[e.jsx(Ae,{className:"h-4 w-4"}),n?"Upload en cours...":"Uploader"]})]})]})})}function rs(){const[m,p]=o.useState("grid"),[i,f]=o.useState(""),[y,u]=o.useState(new Set),[n,g]=Ie(),{playTrack:k}=ge(),{data:c,isLoading:A}=Ve(1,100),x=c?.tracks||[],C=o.useMemo(()=>x?x.filter(s=>s.title.toLowerCase().includes(i.toLowerCase())||(typeof s.artist=="string"?s.artist:s.artist?.name)?.toLowerCase().includes(i.toLowerCase())):[],[x,i]),w=s=>{const l=new Set(y);l.has(s)?l.delete(s):l.add(s),u(l)},b=n.get("action")==="upload",S=()=>{n.delete("action"),g(n)},j=s=>typeof s.artist=="string"?s.artist:s.artist?.name||"Artiste inconnu",h=s=>{const l=typeof s=="number"?s:0;return l===0&&typeof s=="string"?s:`${Math.floor(l/60)}:${(l%60).toString().padStart(2,"0")}`};return e.jsxs("div",{className:"h-full flex flex-col space-y-6 animate-fadeIn pb-24",children:[e.jsxs("div",{className:"sticky top-0 z-20 bg-kodo-void/80 backdrop-blur-xl border-b border-white/5 py-4 -mx-4 px-4 md:-mx-8 md:px-8 flex flex-col md:flex-row gap-4 justify-between items-center transition-all",children:[e.jsxs("div",{className:"flex items-center gap-4 w-full md:w-auto",children:[e.jsx("h1",{className:"text-2xl font-display font-bold text-white hidden md:block",children:"Bibliothèque"}),e.jsxs("div",{className:"relative flex-1 md:w-80",children:[e.jsx(De,{className:"absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-kodo-text-dim"}),e.jsx(L,{placeholder:"Rechercher...",value:i,onChange:s=>f(s.target.value),className:"pl-9 bg-white/5 border-transparent focus:bg-kodo-ink focus:border-kodo-cyan/50 transition-all rounded-xl"})]})]}),e.jsxs("div",{className:"flex items-center gap-2 w-full md:w-auto justify-end",children:[e.jsxs("div",{className:"bg-white/5 p-1 rounded-lg border border-white/5 flex items-center",children:[e.jsx("button",{onClick:()=>p("grid"),className:_("p-2 rounded-md transition-all",m==="grid"?"bg-white/10 text-kodo-cyan shadow-sm":"text-kodo-text-dim hover:text-white"),children:e.jsx(Ee,{className:"w-4 h-4"})}),e.jsx("button",{onClick:()=>p("list"),className:_("p-2 rounded-md transition-all",m==="list"?"bg-white/10 text-kodo-cyan shadow-sm":"text-kodo-text-dim hover:text-white"),children:e.jsx(Te,{className:"w-4 h-4"})})]}),e.jsx(v,{variant:"default",onClick:()=>g({action:"upload"}),className:"shadow-glow-cyan",icon:e.jsx(Me,{className:"w-4 h-4"}),children:"Nouveau"})]})]}),A?e.jsx("div",{className:"grid grid-cols-2 md:grid-cols-4 xl:grid-cols-5 gap-4",children:Array(10).fill(0).map((s,l)=>e.jsx("div",{className:"aspect-square bg-white/5 rounded-2xl animate-pulse"},l))}):C.length===0?e.jsxs("div",{className:"flex-1 flex flex-col items-center justify-center text-center opacity-60 min-h-[400px]",children:[e.jsx("div",{className:"w-20 h-20 bg-white/5 rounded-full flex items-center justify-center mb-4",children:e.jsx(z,{className:"w-10 h-10 text-kodo-text-dim"})}),e.jsx("h3",{className:"text-lg font-bold text-white mb-2",children:"C'est vide ici"}),e.jsx("p",{className:"text-kodo-text-dim max-w-sm mx-auto mb-6",children:"Commencez par uploader vos premiers fichiers audio pour remplir votre bibliothèque."}),e.jsx(v,{onClick:()=>g({action:"upload"}),children:"Uploader un fichier"})]}):m==="grid"?e.jsx("div",{className:"grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6 gap-4",children:C.map(s=>{const l=y.has(s.id);return e.jsxs("div",{className:_("group relative aspect-[4/5] rounded-2xl border transition-all duration-200 overflow-hidden cursor-pointer",l?"bg-kodo-cyan/10 border-kodo-cyan ring-1 ring-kodo-cyan":"bg-kodo-graphite/40 border-white/5 hover:bg-white/5 hover:border-white/10 hover:-translate-y-1 hover:shadow-xl"),onClick:()=>w(s.id),children:[e.jsx("div",{className:"absolute top-3 left-3 z-10 opacity-0 group-hover:opacity-100 transition-opacity",children:l?e.jsx(X,{className:"w-5 h-5 text-kodo-cyan fill-kodo-ink"}):e.jsx(Fe,{className:"w-5 h-5 text-white/50 hover:text-white"})}),e.jsxs("div",{className:"h-[60%] w-full bg-gradient-to-br from-kodo-ink to-black/40 flex items-center justify-center relative group-hover:from-kodo-ink/80 group-hover:to-black/60 transition-all",children:[s.coverUrl?e.jsx("img",{src:s.coverUrl,alt:s.title,className:"w-full h-full object-cover"}):e.jsx(z,{className:"w-12 h-12 text-kodo-steel/50 group-hover:text-kodo-cyan/50 transition-colors"}),e.jsx("button",{onClick:N=>{N.stopPropagation(),k(s)},className:"absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-all scale-90 group-hover:scale-100",children:e.jsx("div",{className:"w-12 h-12 rounded-full bg-kodo-cyan text-kodo-void flex items-center justify-center shadow-glow-cyan hover:scale-110 transition-transform",children:e.jsx(K,{className:"w-5 h-5 ml-1 fill-current"})})})]}),e.jsxs("div",{className:"p-4 flex flex-col justify-between h-[40%]",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"font-bold text-sm text-white truncate mb-1",title:s.title,children:s.title}),e.jsx("p",{className:"text-xs text-kodo-text-dim truncate",children:j(s)})]}),e.jsxs("div",{className:"flex items-center justify-between text-[10px] text-kodo-text-dim font-mono mt-2",children:[e.jsxs("span",{className:"flex items-center gap-1",children:[e.jsx(Re,{className:"w-3 h-3"}),h(s.duration)]}),e.jsx("span",{children:W(new Date(s.created_at),{locale:Y})})]})]})]},s.id)})}):e.jsx("div",{className:"bg-kodo-graphite/20 border border-white/5 rounded-2xl overflow-hidden",children:e.jsxs("table",{className:"w-full text-left text-sm",children:[e.jsx("thead",{className:"bg-white/5 text-xs uppercase font-mono text-kodo-text-dim",children:e.jsxs("tr",{children:[e.jsx("th",{className:"px-6 py-4 w-12 text-center",children:"#"}),e.jsx("th",{className:"px-6 py-4",children:"Titre"}),e.jsx("th",{className:"px-6 py-4 hidden md:table-cell",children:"Artiste"}),e.jsx("th",{className:"px-6 py-4 hidden sm:table-cell",children:"Date"}),e.jsx("th",{className:"px-6 py-4 text-right",children:"Durée"}),e.jsx("th",{className:"px-6 py-4 w-12"})]})}),e.jsx("tbody",{className:"divide-y divide-white/5",children:C.map((s,l)=>e.jsxs("tr",{className:"group hover:bg-white/5 transition-colors cursor-pointer",onClick:()=>k(s),children:[e.jsxs("td",{className:"px-6 py-4 text-center text-kodo-text-dim group-hover:text-kodo-cyan",children:[e.jsx("span",{className:"group-hover:hidden",children:l+1}),e.jsx(K,{className:"w-4 h-4 hidden group-hover:inline-block fill-current"})]}),e.jsx("td",{className:"px-6 py-4 font-medium text-white",children:s.title}),e.jsx("td",{className:"px-6 py-4 text-kodo-text-dim hidden md:table-cell",children:j(s)}),e.jsx("td",{className:"px-6 py-4 text-kodo-text-dim hidden sm:table-cell font-mono text-xs",children:W(new Date(s.created_at),{addSuffix:!0,locale:Y})}),e.jsx("td",{className:"px-6 py-4 text-right text-kodo-text-dim font-mono text-xs",children:h(s.duration)}),e.jsx("td",{className:"px-6 py-4",children:e.jsxs(be,{children:[e.jsx(Ne,{asChild:!0,children:e.jsx("button",{className:"p-2 hover:bg-white/10 rounded-full transition-colors opacity-0 group-hover:opacity-100",children:e.jsx(Pe,{className:"w-4 h-4 text-kodo-text-dim"})})}),e.jsxs(ve,{align:"end",className:"bg-kodo-ink border-kodo-steel/50",children:[e.jsxs(Q,{className:"cursor-pointer gap-2",children:[e.jsx(ze,{className:"w-4 h-4"})," Télécharger"]}),e.jsxs(Q,{className:"cursor-pointer gap-2 text-kodo-red hover:text-kodo-red hover:bg-kodo-red/10",children:[e.jsx(Ue,{className:"w-4 h-4"})," Supprimer"]})]})]})})]},s.id))})]})}),b&&e.jsx(Be,{isOpen:!0,onClose:S})]})}export{rs as LibraryPage};