veza/apps/web/dist_verification/assets/LibraryPage-Bs71TQk9.js
senke 203cb5d5e5 refactor: Phase 8 — Update docs, ESLint, Storybook config for SUMI
- DESIGN_TOKENS.md: Complete rewrite to document --sumi-* token system
- APP_SHELL.md: Update layout shell docs (glass bg, backdrop-blur, z-index)
- DESIGN_DIRECTION.md: Update aesthetic direction to SUMI philosophy
- .storybook/preview.tsx: Remove deleted CSS imports, update bg colors
- eslint.config.js: Update color rule message from Kodo to SUMI tokens
- tailwind.config.ts: Fix comment referencing deleted design-tokens.css

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 02:15:11 +01:00

6 lines
19 KiB
JavaScript

import{j as e,a as l}from"./vendor-react-Dkpvlwai.js";import{d as P,j as ce,B as T,D as de,l as ue,k as me,C as xe,S as U,m as pe,E as fe}from"./index-jE2AGx2y.js";import{C as he}from"./ContentFadeIn-Tb-ft8CP.js";import{G as ge,y as B}from"./vendor-CAoAb3tF.js";import{u as be,a as je}from"./vendor-tanstack-BoI3DtL9.js";import{t as ye}from"./tracks-DFRy168u.js";import{g as ve}from"./trackService-BilERhFT.js";import{u as Ne,D as we,a as ke,b as Ce,c as q}from"./useIsRateLimited-V6u_TMsM.js";import{al as V,X as Se,a as De,R as Ae,c as K,aa as Ee,am as Ue,Z as $,b as Me,ad as Pe,an as Te,T as Le,S as Re,ao as Fe,d as ze,ae as Ie}from"./vendor-icons-CbmLcMl-.js";import{P as Ve}from"./progress-5klaDPNN.js";import{A as Ge}from"./alert-DvTTzGyG.js";import{L as I,I as M}from"./input-CpxrTzwP.js";import{p as _e,i as Oe,f as Qe}from"./vendor-utils-CDFfoeXY.js";import{c as Be}from"./vendor-router-4bycex72.js";import"./dropdown-WuZUrg5z.js";function qe({children:s,variant:r="default",className:t}){return e.jsx("div",{className:P("p-8",r==="alert"&&"text-destructive",t),children:s})}function Ke({children:s,className:r}){return e.jsx("div",{className:P("flex items-center justify-end gap-2 p-8 border-t border-border",r),children:s})}const Q={all:["library"],tracks:s=>[...Q.all,"tracks",{userId:s}]};function $e(s=1,r=50){const{user:t}=ce();return be({queryKey:[...Q.tracks(t?.id),{page:s,limit:r}],queryFn:()=>ve({userId:t?.id,page:s,limit:r}),enabled:!!t?.id,placeholderData:c=>c})}const Ye=100*1024*1024,We={"audio/mpeg":[".mp3"],"audio/wav":[".wav"],"audio/ogg":[".ogg"],"audio/flac":[".flac"],"audio/mp4":[".m4a"],"audio/aac":[".aac"]},O=3;function Xe({onClose:s}){const[r,t]=l.useState(null),[c,a]=l.useState(0),[d,x]=l.useState(!1),[v,i]=l.useState(null),[h,g]=l.useState(null),[N,b]=l.useState(!1),[j,p]=l.useState(0),[D,y]=l.useState(!1),[u,w]=l.useState({file:null,title:"",artist:"",album:"",genre:""}),[L,S]=l.useState({}),m=Ne(),A=je(),k=l.useCallback(()=>{w({file:null,title:"",artist:"",album:"",genre:""}),S({})},[]),G=l.useCallback(()=>{d||(t(null),a(0),i(null),g(null),b(!1),p(0),y(!1),k(),s())},[d,k,s]),E=l.useCallback((o,n)=>{w(f=>({...f,[o]:n}))},[]),_=l.useCallback(()=>u,[u]),R=l.useCallback(async(o,n=1)=>{if(!o.file){i("Veuillez sélectionner un fichier"),g(null),b(!1);return}x(!0),i(null),g(null),b(!1),y(!1),a(0);try{const f={title:o.title||o.file.name.replace(/\.[^/.]+$/,""),artist:o.artist,album:o.album,genre:o.genre,is_public:!1};await ye.create(o.file,f,C=>{a(C)}),y(!0),a(100),p(0),A.invalidateQueries({queryKey:Q.all}),A.invalidateQueries({queryKey:["tracks"]}),setTimeout(()=>G(),1500)}catch(f){let C="Erreur lors de l'upload",F=null,z=!1;if(f instanceof Error){C=f.message;const oe=/network|réseau|timeout|econnaborted|etimedout|se connecter/i.test(C),ie=/serveur|server|500|503|502/i.test(C),ne=/format|taille|invalide|trop volumineux|non supporté|400|413|415/i.test(C);oe?(F="NETWORK",z=n<O):ie?(F="SERVER",z=n<O):ne&&(F="VALIDATION",z=!1)}i(C),g(F),b(z),a(0),p(n)}finally{x(!1)}},[A,G]),Z=l.useCallback(o=>{const n=o[0];if(n){t(n),i(null),y(!1),E("file",n);const f=n.name.replace(/\.[^/.]+$/,"");u.title||E("title",f)}},[E,u.title]),{getRootProps:H,getInputProps:J,isDragActive:ee}=ge({onDrop:Z,accept:We,maxSize:Ye,multiple:!1,onError:o=>i(`Erreur lors de la sélection du fichier: ${o.message}`),onDropRejected:o=>{const n=o[0];n?.errors[0]?.code==="file-too-large"?i("Le fichier est trop volumineux (max 100 MB)"):n?.errors[0]?.code==="file-invalid-type"?i("Format de fichier non supporté. Formats acceptés: MP3, WAV, OGG, FLAC, M4A, AAC"):i(n?.errors[0]?.message||"Erreur lors de la sélection du fichier")}}),se=o=>({value:u[o]instanceof File?"":u[o]||"",onChange:n=>{w(f=>({...f,[o]:n.target.value}))}}),re=l.useCallback((o,n)=>f=>{if(f.preventDefault(),!u.file){S({file:"Veuillez sélectionner un fichier"}),n?.({file:{message:"Veuillez sélectionner un fichier"}});return}S({}),o(u)},[u]),te=l.useCallback(async o=>{await R(o,1)},[R]),ae=l.useCallback(()=>{R(_(),j+1)},[j,_,R]),le=l.useCallback(()=>{t(null),i(null),y(!1),a(0),E("file",null)},[E]);return{file:r,uploadProgress:c,isUploading:d,error:v,errorCode:h,isRetryable:N,retryCount:j,success:D,formData:u,formErrors:L,register:se,handleSubmit:re,onSubmit:te,getValues:_,getRootProps:H,getInputProps:J,isDragActive:ee,handleClose:G,handleRetry:ae,handleRemoveFile:le,isRateLimited:m}}function Ze({getRootProps:s,getInputProps:r,isDragActive:t}){return e.jsxs("div",{...s(),className:`
border-2 border-dashed rounded-lg p-12 text-center cursor-pointer
transition-colors
${t?"border-primary bg-primary/5":"border-muted-foreground/25"}
hover:border-primary hover:bg-primary/5
`,children:[e.jsx("input",{...r()}),e.jsx(V,{className:"mx-auto h-12 w-12 text-muted-foreground mb-4"}),e.jsx("p",{className:"text-lg font-medium mb-2",children:t?"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)"})]})}function He({file:s,isUploading:r,onRemove:t}){return 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(V,{className:"h-8 w-8 text-primary"}),e.jsxs("div",{children:[e.jsx("p",{className:"font-medium","data-testid":"upload-file-name",children:s.name}),e.jsxs("p",{className:"text-sm text-muted-foreground",children:[(s.size/1024/1024).toFixed(2)," MB"]})]})]}),!r&&e.jsx(T,{type:"button",variant:"ghost",size:"icon",onClick:t,className:"h-8 w-8",children:e.jsx(Se,{className:"h-4 w-4"})})]})})}function Je({progress:s}){return 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:[s,"%"]})]}),e.jsx(Ve,{value:s})]})}function es({error:s,errorCode:r,retryCount:t,isRetryable:c,isUploading:a,onRetry:d}){return e.jsx(Ge,{variant:"destructive","data-testid":"upload-error",children:e.jsxs("div",{className:"flex items-start gap-4",children:[e.jsx(De,{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:s}),r&&e.jsxs("p",{className:"text-xs text-muted-foreground mt-1",children:["Code d'erreur: ",r]}),t>0&&e.jsxs("p",{className:"text-xs text-muted-foreground mt-1",children:["Tentative ",t,"/",O]})]}),c&&e.jsxs(T,{type:"button",variant:"outline",size:"sm",onClick:d,disabled:a,className:"mt-2",children:[e.jsx(Ae,{className:"h-4 w-4 mr-2"}),"Réessayer"]})]})]})})}function ss({register:s,errors:r}){return 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(I,{htmlFor:"title",children:"Titre *"}),e.jsx(M,{id:"title",...s("title"),placeholder:"Titre du morceau"}),r.title&&e.jsx("p",{className:"text-sm text-destructive",children:r.title})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(I,{htmlFor:"artist",children:"Artiste"}),e.jsx(M,{id:"artist",...s("artist"),placeholder:"Nom de l'artiste"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(I,{htmlFor:"album",children:"Album"}),e.jsx(M,{id:"album",...s("album"),placeholder:"Nom de l'album"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(I,{htmlFor:"genre",children:"Genre"}),e.jsx(M,{id:"genre",...s("genre"),placeholder:"Genre musical"})]})]})]})}function rs({open:s,onClose:r}){const{file:t,uploadProgress:c,isUploading:a,error:d,errorCode:x,isRetryable:v,retryCount:i,success:h,formErrors:g,register:N,handleSubmit:b,onSubmit:j,getRootProps:p,getInputProps:D,isDragActive:y,handleClose:u,handleRetry:w,handleRemoveFile:L,isRateLimited:S}=Xe({onClose:r});return e.jsx(de,{open:s,onClose:u,title:"Uploader un fichier audio",size:"lg",children:e.jsxs("form",{id:"upload-track-form",onSubmit:b(j,m=>{ue.warn("Form validation errors:",{errors:m})}),children:[e.jsx(qe,{children:e.jsxs("div",{className:"space-y-6",children:[t?e.jsx(He,{file:t,isUploading:a,onRemove:L}):e.jsx(Ze,{getRootProps:p,getInputProps:D,isDragActive:y}),a&&e.jsx(Je,{progress:c}),d&&e.jsx(es,{error:d,errorCode:x,retryCount:i,isRetryable:v,isUploading:a,onRetry:w}),h&&e.jsxs("div",{className:"rounded-lg border bg-success/10 border-success p-4 flex items-center gap-2 text-success",children:[e.jsx(K,{className:"h-4 w-4 shrink-0"}),e.jsx("span",{children:"Fichier uploadé avec succès !"})]}),t&&!a&&!h&&e.jsx(ss,{register:N,errors:g})]})}),e.jsxs(Ke,{children:[e.jsx(T,{variant:"outline",onClick:u,disabled:a,type:"button",children:h?"Fermer":"Annuler"}),!h&&e.jsxs(T,{type:"submit",form:"upload-track-form",disabled:!t||a||S,className:"gap-2",children:[e.jsx(Ee,{className:"h-4 w-4"}),a?"Upload en cours...":"Uploader"]})]})]})})}function ts({onUploadClick:s}){return e.jsx(me,{variant:"centered",icon:e.jsx(V,{className:"w-full h-full"}),title:"Your library is empty",description:"Upload your first track or create a playlist to get started.",action:{label:"Upload Track",onClick:s},size:"lg",className:"min-h-layout-page-sm"})}function Y(s,r){try{let t;if(typeof s=="string")t=_e(s);else if(s instanceof Date)t=s;else if(typeof s=="number")t=new Date(s);else return"";return Oe(t)?Qe(t,r):"unknown time"}catch{return""}}function W(s){const r=s.artist;return typeof r=="string"?r:r?.name??"Unknown Artist"}function X(s){const r=typeof s=="number"?s:0;return r===0&&typeof s=="string"?s:`${Math.floor(r/60)}:${String(r%60).padStart(2,"0")}`}const as={visible:{transition:{staggerChildren:.03,delayChildren:.02}}},ls={hidden:{opacity:0,y:8},visible:{opacity:1,y:0}};function os({tracks:s,selectedTracks:r,onToggleSelection:t,onPlayTrack:c}){return e.jsx(B.div,{className:"grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6 gap-6",variants:as,initial:"hidden",animate:"visible",children:s.map(a=>{const d=r.has(a.id);return e.jsx(B.div,{variants:ls,children:e.jsxs(xe,{variant:"glass",tabIndex:0,role:"button",className:P("group relative aspect-[4/5] overflow-hidden cursor-pointer hover:-translate-y-2 transition-all duration-[var(--sumi-duration-normal)] border-white/5 bg-black/20 backdrop-blur-xl focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50 focus-visible:ring-offset-2 focus-visible:ring-offset-background",d?"border-primary ring-1 ring-primary":"hover:border-primary/30"),onClick:()=>t(a.id),onKeyDown:x=>{(x.key==="Enter"||x.key===" ")&&(x.preventDefault(),t(a.id))},children:[e.jsx("div",{className:"absolute top-3 left-3 z-10 opacity-0 group-hover:opacity-100 transition-opacity duration-[var(--duration-fast)]",children:d?e.jsx(K,{className:"w-6 h-6 text-primary fill-background drop-shadow-md"}):e.jsx(Ue,{className:"w-6 h-6 text-white/70 hover:text-foreground drop-shadow-md"})}),e.jsxs("div",{className:"h-3/5 w-full bg-gradient-to-br from-background to-black/40 flex items-center justify-center relative group-hover:from-background/80 group-hover:to-black/60 transition-all",children:[a.coverUrl?e.jsx("img",{src:a.coverUrl,alt:a.title,className:"w-full h-full object-cover transition-transform duration-[var(--sumi-duration-slower)] group-hover:scale-110"}):e.jsx(V,{className:"w-12 h-12 text-muted-foreground/30 group-hover:text-primary/50 transition-colors duration-[var(--sumi-duration-normal)]"}),e.jsx("button",{type:"button",onClick:x=>{x.stopPropagation(),c(a)},className:"absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-all duration-[var(--sumi-duration-normal)] scale-90 group-hover:scale-100 focus:opacity-100 focus:scale-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50 focus-visible:ring-inset",children:e.jsx("div",{className:"w-14 h-14 rounded-full bg-primary text-primary-foreground flex items-center justify-center transition-transform duration-[var(--duration-fast)]",children:e.jsx($,{className:"w-6 h-6 ml-1 fill-current"})})})]}),e.jsxs("div",{className:"p-4 flex flex-col justify-between h-2/5 bg-black/20 backdrop-blur-sm",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"font-bold text-sm text-foreground truncate mb-1 group-hover:text-primary transition-colors duration-[var(--duration-fast)]",title:a.title,children:a.title}),e.jsx("p",{className:"text-xs text-muted-foreground truncate",children:W(a)})]}),e.jsxs("div",{className:"flex items-center justify-between text-xs text-muted-foreground/70 font-mono mt-2",children:[e.jsxs("span",{className:"flex items-center gap-1",children:[e.jsx(Me,{className:"w-3 h-3"}),X(a.duration)]}),e.jsx("span",{children:Y(a.created_at)})]})]})]})},a.id)})})}function is({tracks:s,onPlayTrack:r}){return e.jsx("div",{className:"glass rounded-2xl overflow-hidden shadow-lg",children:e.jsxs("table",{className:"w-full text-left text-sm",children:[e.jsx("thead",{className:"bg-black/20 text-xs uppercase font-mono text-muted-foreground",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:"Title"}),e.jsx("th",{className:"px-6 py-4 hidden md:table-cell",children:"Artist"}),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:"Duration"}),e.jsx("th",{className:"px-6 py-4 w-12"})]})}),e.jsx("tbody",{className:"divide-y divide-border/50",children:s.map((t,c)=>e.jsxs("tr",{className:"group hover:bg-white/5 transition-colors duration-[var(--duration-fast)] cursor-pointer",onClick:()=>r(t),children:[e.jsxs("td",{className:"px-6 py-4 text-center text-muted-foreground group-hover:text-primary",children:[e.jsx("span",{className:"group-hover:hidden",children:c+1}),e.jsx($,{className:"w-4 h-4 hidden group-hover:inline-block fill-current"})]}),e.jsx("td",{className:"px-6 py-4 font-medium text-foreground group-hover:text-primary transition-colors duration-[var(--duration-fast)]",children:t.title}),e.jsx("td",{className:"px-6 py-4 text-muted-foreground hidden md:table-cell",children:W(t)}),e.jsx("td",{className:"px-6 py-4 text-muted-foreground hidden sm:table-cell font-mono text-xs",children:Y(t.created_at,{addSuffix:!0})}),e.jsx("td",{className:"px-6 py-4 text-right text-muted-foreground font-mono text-xs",children:X(t.duration)}),e.jsx("td",{className:"px-6 py-4",children:e.jsxs(we,{children:[e.jsx(ke,{asChild:!0,children:e.jsx("button",{type:"button",className:"p-2 hover:bg-white/10 rounded-full transition-colors duration-[var(--duration-fast)] opacity-0 group-hover:opacity-100 text-muted-foreground",onClick:a=>a.stopPropagation(),children:e.jsx(Pe,{className:"w-4 h-4"})})}),e.jsxs(Ce,{align:"end",className:"bg-background/90 backdrop-blur-xl border-border",children:[e.jsxs(q,{className:"cursor-pointer gap-2 focus:bg-primary/20",children:[e.jsx(Te,{className:"w-4 h-4"})," Download"]}),e.jsxs(q,{className:"cursor-pointer gap-2 text-destructive focus:bg-destructive/10 focus:text-destructive",children:[e.jsx(Le,{className:"w-4 h-4"})," Delete"]})]})]})})]},t.id))})]})})}function ns(){return e.jsxs("div",{className:"h-full flex flex-col space-y-6 pb-24 min-h-layout-page",children:[e.jsxs("div",{className:"sticky top-0 z-20 bg-background/80 backdrop-blur-xl border-b border-border py-4 -mx-4 px-4 md:-mx-8 md:px-8 flex flex-col md:flex-row gap-4 justify-between items-center",children:[e.jsxs("div",{className:"flex items-center gap-4 w-full md:w-auto",children:[e.jsx(U,{className:"h-8 w-24 rounded-lg hidden md:block"}),e.jsx(U,{className:"flex-1 md:w-80 h-10 rounded-xl"})]}),e.jsxs("div",{className:"flex items-center gap-3 w-full md:w-auto justify-end",children:[e.jsx(U,{className:"h-10 w-20 rounded-lg"}),e.jsx(U,{className:"h-10 w-24 rounded-lg"})]})]}),e.jsx("div",{className:"w-full max-w-layout-content mx-auto grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6 gap-6",children:Array.from({length:10},(s,r)=>e.jsx(U,{className:"aspect-[4/5] rounded-xl min-h-0"},r))})]})}function cs({viewMode:s,onViewModeChange:r,searchQuery:t,onSearchChange:c,onNewClick:a}){return e.jsxs("div",{className:"sticky top-0 z-20 bg-background/80 backdrop-blur-xl border-b border-border 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-heading-2 font-heading text-foreground hidden md:block",children:"Library"}),e.jsxs("div",{className:"relative flex-1 md:w-80",children:[e.jsx(Re,{className:"absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground"}),e.jsx(M,{placeholder:"Search...",value:t,onChange:d=>c(d.target.value),className:"pl-9 bg-muted/20 border-transparent focus:bg-background focus:ring-1 focus:ring-primary/50 transition-all rounded-xl"})]})]}),e.jsxs("div",{className:"flex items-center gap-3 w-full md:w-auto justify-end",children:[e.jsxs("div",{className:"bg-muted/20 p-1 rounded-lg border border-border flex items-center h-10",children:[e.jsx("button",{type:"button",onClick:()=>r("grid"),className:P("h-8 w-8 flex items-center justify-center rounded-md transition-all",s==="grid"?"bg-background text-primary shadow-sm":"text-muted-foreground hover:text-foreground"),"aria-label":"Grid view",children:e.jsx(Fe,{className:"w-4 h-4"})}),e.jsx("button",{type:"button",onClick:()=>r("list"),className:P("h-8 w-8 flex items-center justify-center rounded-md transition-all",s==="list"?"bg-background text-primary shadow-sm":"text-muted-foreground hover:text-foreground"),"aria-label":"List view",children:e.jsx(ze,{className:"w-4 h-4"})})]}),e.jsxs(T,{onClick:a,className:"shadow-sm transition-all bg-primary text-primary-foreground",children:[e.jsx(Ie,{className:"w-4 h-4 mr-2"})," New"]})]})]})}function ds(s={}){const{initialTracks:r}=s,[t,c]=l.useState("grid"),[a,d]=l.useState(""),[x,v]=l.useState(new Set),[i,h]=Be(),{data:g,isLoading:N,error:b,refetch:j}=$e(1,100),p=r!==void 0?r??[]:g?.tracks??[],D=r!==void 0?!1:N,y=l.useMemo(()=>p.length?p.filter(m=>(m.title??"").toLowerCase().includes(a.toLowerCase())||String(typeof m.artist=="string"?m.artist:m.artist?.name??"").toLowerCase().includes(a.toLowerCase())):[],[p,a]),u=m=>{v(A=>{const k=new Set(A);return k.has(m)?k.delete(m):k.add(m),k})},w=i.get("action")==="upload";return{viewMode:t,setViewMode:c,searchQuery:a,setSearchQuery:d,selectedTracks:x,toggleSelection:u,filteredTracks:y,isLoading:D,error:r!==void 0?null:b??null,refetch:j,isUploadOpen:w,closeUpload:()=>{const m=new URLSearchParams(i);m.delete("action"),h(m)},openUpload:()=>h({action:"upload"})}}function Ss(s={}){const{playTrack:r}=pe(),{viewMode:t,setViewMode:c,searchQuery:a,setSearchQuery:d,selectedTracks:x,toggleSelection:v,filteredTracks:i,isLoading:h,error:g,refetch:N,isUploadOpen:b,closeUpload:j,openUpload:p}=ds(s);return h?e.jsx(ns,{}):g?e.jsx(fe,{error:g,variant:"card",onRetry:N}):e.jsxs(he,{className:"h-full flex flex-col space-y-6 pb-24 min-h-layout-page",children:[e.jsx(cs,{viewMode:t,onViewModeChange:c,searchQuery:a,onSearchChange:d,onNewClick:p}),i.length===0?e.jsx(ts,{onUploadClick:p}):t==="grid"?e.jsx(os,{tracks:i,selectedTracks:x,onToggleSelection:v,onPlayTrack:r}):e.jsx(is,{tracks:i,onPlayTrack:r}),b&&e.jsx(rs,{isOpen:!0,onClose:j})]})}export{Ss as LibraryPage};