2 lines
7.4 KiB
JavaScript
2 lines
7.4 KiB
JavaScript
|
import{a as x,j as e}from"./vendor-react-YMhRUmcb.js";import{m as f,B as m,k as C,C as Q}from"./index-D2uzyr9g.js";import{I as T}from"./input-DL1WY4HG.js";import{X as g,az as $,aE as A,ax as D,T as I,V as E,Y as j,J as _,$ as M}from"./vendor-icons-DINCNwpk.js";import"./vendor-fFnFILYR.js";import"./vendor-router-DX94Iu-2.js";import"./vendor-tanstack-CoFNL2zy.js";import"./vendor-utils-4BWoYre8.js";const U=({onClose:o,onSave:i})=>{const{addToast:u}=f(),[n,h]=x.useState(""),[a,d]=x.useState(!1),b=()=>{if(!n){u("Please name your playlist","error");return}i(n,a),o()};return e.jsxs("div",{className:"fixed inset-0 z-[100] flex items-center justify-center p-4",children:[e.jsx("div",{className:"absolute inset-0 bg-kodo-void/90 backdrop-blur-sm",onClick:o}),e.jsxs("div",{className:"relative w-full max-w-md bg-kodo-graphite border border-kodo-steel rounded-xl shadow-2xl animate-scaleIn",children:[e.jsxs("div",{className:"p-4 border-b border-kodo-steel bg-kodo-ink flex justify-between items-center",children:[e.jsx("h3",{className:"font-bold text-white",children:"Save Queue as Playlist"}),e.jsx("button",{onClick:o,children:e.jsx(g,{className:"w-5 h-5 text-kodo-content-dim hover:text-white"})})]}),e.jsxs("div",{className:"p-6 space-y-4",children:[e.jsx(T,{label:"Playlist Name",value:n,onChange:r=>h(r.target.value),autoFocus:!0,placeholder:"My Queue Session"}),e.jsxs("div",{className:"flex items-center justify-between p-4 bg-kodo-ink rounded border border-kodo-steel cursor-pointer hover:border-kodo-steel",onClick:()=>d(!a),children:[e.jsxs("div",{className:"flex items-center gap-4",children:[a?e.jsx($,{className:"w-5 h-5 text-kodo-steel"}):e.jsx(A,{className:"w-5 h-5 text-kodo-gold"}),e.jsxs("div",{children:[e.jsx("div",{className:"text-sm font-bold text-white",children:a?"Public Playlist":"Private Playlist"}),e.jsx("div",{className:"text-xs text-kodo-content-dim",children:a?"Visible on your profile":"Only visible to you"})]})]}),e.jsx("div",{className:`w-10 h-5 rounded-full relative transition-colors ${a?"bg-kodo-cyan":"bg-kodo-steel"}`,children:e.jsx("div",{className:`absolute top-1 w-3 h-3 bg-white rounded-full transition-all ${a?"left-6":"left-1"}`})})]})]}),e.jsxs("div",{className:"p-4 border-t border-kodo-steel bg-kodo-ink flex justify-end gap-4",children:[e.jsx(m,{variant:"ghost",onClick:o,children:"Cancel"}),e.jsx(m,{variant:"primary",onClick:b,children:"Save Playlist"})]})]})]})},q=()=>{const{queue:o,currentTrack:i,reorderQueue:u,removeFromQueue:n,clearQueue:h,playTrack:a,isPlaying:d,togglePlay:b,autoplay:r,toggleAutoplay:k}=C(),{addToast:N}=f(),[y,p]=x.useState(!1),[c,v]=x.useState(null),w=(s,t)=>{v(t),s.dataTransfer.effectAllowed="move";const l=document.createElement("div");l.style.opacity="0",document.body.appendChild(l),s.dataTransfer.setDragImage(l,0,0),setTimeout(()=>document.body.removeChild(l),0)},P=(s,t)=>{s.preventDefault(),!(c===null||c===t)&&(u(c,t),v(t))},S=(s,t)=>{N(`Queue saved as "${s}"`,"success")};return e.jsxs("div",{className:"max-w-4xl mx-auto space-y-6 animate-fadeIn pb-20",children:[e.jsxs("div",{className:"flex flex-col md:flex-row justify-between items-end border-b border-kodo-steel/50 pb-6 gap-4",children:[e.jsxs("div",{children:[e.jsx("h1",{className:"text-3xl font-display font-bold text-white mb-2",children:"PLAY QUEUE"}),e.jsxs("p",{className:"text-kodo-content-dim font-mono text-sm",children:[o.length," tracks upcoming"]})]}),e.jsxs("div",{className:"flex gap-4",children:[e.jsx(m,{variant:"ghost",onClick:()=>p(!0),icon:e.jsx(D,{className:"w-4 h-4"}),children:"Save Queue"}),e.jsx(m,{variant:"ghost",className:"text-kodo-red hover:bg-kodo-red/10",onClick:h,icon:e.jsx(I,{className:"w-4 h-4"}),children:"Clear"})]})]}),i&&e.jsxs("div",{children:[e.jsx("h3",{className:"text-xs font-bold text-kodo-content-dim uppercase tracking-widest mb-3",children:"Now Playing"}),e.jsxs(Q,{variant:"glass",className:"flex items-center gap-4 p-4 border-l-4 border-l-kodo-cyan",children:[e.jsxs("div",{className:"relative w-16 h-16 rounded overflow-hidden flex-shrink-0 group cursor-pointer",onClick:b,children:[e.jsx("img",{s
|