Initial release v1.0.0

2025-12-25 18:58:06 -06:00
commit 021aec7a63
439 changed files with 116588 additions and 0 deletions
--- a/frontend/features/discover/components/DiscoverActionBar.tsx
+++ b/frontend/features/discover/components/DiscoverActionBar.tsx
@@ -0,0 +1,123 @@
+"use client";
+
+import { Play, Pause, RefreshCw, Settings } from "lucide-react";
+import { cn } from "@/utils/cn";
+import { GradientSpinner } from "@/components/ui/GradientSpinner";
+import type { DiscoverPlaylist, DiscoverConfig } from "../types";
+
+interface BatchStatus {
+    active: boolean;
+    status: "downloading" | "scanning" | null;
+    progress?: number;
+    completed?: number;
+    failed?: number;
+    total?: number;
+}
+
+interface DiscoverActionBarProps {
+    playlist: DiscoverPlaylist | null;
+    config: DiscoverConfig | null;
+    isPlaylistPlaying: boolean;
+    isPlaying: boolean;
+    onPlayToggle: () => void;
+    onGenerate: () => void;
+    onToggleSettings: () => void;
+    isGenerating: boolean;
+    batchStatus?: BatchStatus | null;
+}
+
+export function DiscoverActionBar({
+    playlist,
+    config,
+    isPlaylistPlaying,
+    isPlaying,
+    onPlayToggle,
+    onGenerate,
+    onToggleSettings,
+    isGenerating,
+    batchStatus,
+}: DiscoverActionBarProps) {
+    const getStatusText = () => {
+        if (!isGenerating) return null;
+        
+        if (batchStatus?.status === "scanning") {
+            return "Importing tracks...";
+        }
+        
+        if (batchStatus?.total) {
+            return `Downloading ${batchStatus.completed || 0}/${batchStatus.total}`;
+        }
+        
+        return "Starting...";
+    };
+
+    return (
+        <div className="bg-gradient-to-b from-[#1a1a1a]/60 to-transparent px-4 md:px-8 py-4">
+            <div className="flex items-center gap-4">
+                {/* Play Button */}
+                {playlist && playlist.tracks.length > 0 && (
+                    <button
+                        onClick={onPlayToggle}
+                        disabled={isGenerating}
+                        className={cn(
+                            "h-12 w-12 rounded-full flex items-center justify-center shadow-lg transition-all",
+                            isGenerating
+                                ? "bg-[#ecb200]/50 cursor-not-allowed"
+                                : "bg-[#ecb200] hover:bg-[#d4a000] hover:scale-105"
+                        )}
+                    >
+                        {isPlaylistPlaying && isPlaying ? (
+                            <Pause className="w-5 h-5 fill-current text-black" />
+                        ) : (
+                            <Play className="w-5 h-5 fill-current text-black ml-0.5" />
+                        )}
+                    </button>
+                )}
+
+                {/* Generate Button */}
+                <button
+                    onClick={onGenerate}
+                    disabled={isGenerating || !config?.enabled}
+                    className={cn(
+                        "flex items-center gap-2 px-4 py-2 rounded-full text-sm font-medium transition-all",
+                        isGenerating || !config?.enabled
+                            ? "bg-white/5 text-white/50 cursor-not-allowed"
+                            : "bg-purple-600/20 hover:bg-purple-600/30 text-white border border-purple-500/30"
+                    )}
+                >
+                    {isGenerating ? (
+                        <>
+                            <GradientSpinner size="sm" />
+                            <span className="hidden sm:inline">{getStatusText()}</span>
+                            <span className="sm:hidden">
+                                {batchStatus?.completed || 0}/{batchStatus?.total || "?"}
+                            </span>
+                        </>
+                    ) : (
+                        <>
+                            <RefreshCw className="w-4 h-4" />
+                            <span className="hidden sm:inline">
+                                {playlist ? "Regenerate" : "Generate"}
+                            </span>
+                        </>
+                    )}
+                </button>
+
+                {/* Settings Button */}
+                <button
+                    onClick={onToggleSettings}
+                    disabled={isGenerating}
+                    className={cn(
+                        "h-8 w-8 rounded-full flex items-center justify-center transition-all",
+                        isGenerating
+                            ? "text-white/30 cursor-not-allowed"
+                            : "text-white/60 hover:text-white hover:bg-white/10"
+                    )}
+                    title="Settings"
+                >
+                    <Settings className="w-5 h-5" />
+                </button>
+            </div>
+        </div>
+    );
+}