import { Play, Pause, Shuffle, Download, Radio } from "lucide-react";
import { cn } from "@/utils/cn";
import type { Artist } from "../types";
import type { Album } from "../types";
import type { ArtistSource } from "../types";

const LIDIFY_YELLOW = "#ecb200";

interface ArtistActionBarProps {
    artist: Artist;
    albums: Album[];
    source: ArtistSource;
    colors: any;
    onPlayAll: () => void;
    onShuffle: () => void;
    onDownloadAll: () => void;
    onStartRadio?: () => void;
    isPendingDownload: boolean;
    isPlaying?: boolean;
    isPlayingThisArtist?: boolean;
    onPause?: () => void;
}

export function ArtistActionBar({
    artist,
    albums,
    source,
    colors,
    onPlayAll,
    onShuffle,
    onDownloadAll,
    onStartRadio,
    isPendingDownload,
    isPlaying = false,
    isPlayingThisArtist = false,
    onPause,
}: ArtistActionBarProps) {
    const availableAlbums = albums.filter(
        (album) => album.availability !== "unavailable"
    );
    const showDownloadAll = source === "discovery" || availableAlbums.length > 0;
    const showPause = isPlaying && isPlayingThisArtist;
    const showRadio = source === "library" && onStartRadio;

    const handlePlayPauseClick = () => {
        if (showPause && onPause) {
            onPause();
        } else {
            onPlayAll();
        }
    };

    return (
        <div className="flex items-center gap-4">
            {/* Play Button */}
            <button
                onClick={handlePlayPauseClick}
                className="h-12 w-12 rounded-full flex items-center justify-center shadow-lg transition-all hover:scale-105"
                style={{ backgroundColor: LIDIFY_YELLOW }}
            >
                {showPause ? (
                    <Pause className="w-5 h-5 fill-current text-black" />
                ) : (
                    <Play className="w-5 h-5 fill-current text-black ml-0.5" />
                )}
            </button>

            {/* Shuffle Button */}
            <button
                onClick={onShuffle}
                className="h-8 w-8 rounded-full hover:bg-white/10 flex items-center justify-center text-white/60 hover:text-white transition-all"
                title="Shuffle play"
            >
                <Shuffle className="w-5 h-5" />
            </button>

            {/* Radio Button - Only for library artists */}
            {showRadio && (
                <button
                    onClick={onStartRadio}
                    className="h-8 w-8 rounded-full hover:bg-white/10 flex items-center justify-center text-white/60 hover:text-white transition-all"
                    title="Start artist radio"
                >
                    <Radio className="w-5 h-5" />
                </button>
            )}

            {/* Download All Button */}
            {showDownloadAll && (
                <button
                    onClick={onDownloadAll}
                    disabled={isPendingDownload}
                    className={cn(
                        "flex items-center gap-2 px-4 py-2 rounded-full text-sm font-medium transition-all",
                        isPendingDownload
                            ? "bg-white/5 text-white/50 cursor-not-allowed"
                            : "bg-white/5 hover:bg-white/10 text-white/80 hover:text-white"
                    )}
                >
                    <Download className="w-4 h-4" />
                    <span className="hidden sm:inline">
                        {isPendingDownload ? "Downloading..." : "Download All"}
                    </span>
                </button>
            )}
        </div>
    );
}