feat: add playlist editing functionality; implement PlaylistEditPage and integrate with playlists service

feat: enhance PlaylistsPage with search, sorting, and playlist creation features; improve UI components and state management

src/components/player/CompactPlayer.tsx

@@ -97,10 +97,10 @@ export function CompactPlayer({ className }: CompactPlayerProps) {
     }
   }, [state.volume, executeAction])
 
-  // Don't show if no current sound
-  if (!state.current_sound) {
-    return null
-  }
+  // // Don't show if no current sound
+  // if (!state.current_sound) {
+  //   return null
+  // }
 
   return (
     <div className={cn("w-full", className)}>
@@ -150,7 +150,7 @@ export function CompactPlayer({ className }: CompactPlayerProps) {
           </div>
           <div className="flex-1 min-w-0">
             <div className="text-sm font-medium truncate">
-              {state.current_sound.name}
+              {state.current_sound?.name || 'No track selected'}
             </div>
             <div className="text-xs text-muted-foreground">
               {state.playlist?.name}

src/components/ui/textarea.tsx

@@ -0,0 +1,18 @@
+import * as React from "react"
+
+import { cn } from "@/lib/utils"
+
+function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
+  return (
+    <textarea
+      data-slot="textarea"
+      className={cn(
+        "border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+export { Textarea }