import { Button } from '@/components/ui/button';
import {
    DropdownMenu,
    DropdownMenuContent,
    DropdownMenuItem,
    DropdownMenuLabel,
    DropdownMenuRadioGroup,
    DropdownMenuRadioItem,
    DropdownMenuSeparator,
    DropdownMenuSub,
    DropdownMenuSubContent,
    DropdownMenuSubTrigger,
    DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
import { Bluetooth, Printer, Unplug, Usb } from 'lucide-react';

interface PrinterSettingsProps {
    isConnected: boolean;
    name: string | null;
    paperSize: string;
    onConnectBluetooth: () => void;
    onConnectUsb: () => void;
    onDisconnect: () => void;
    onPaperSizeChange: (size: any) => void;
}

export function PrinterSettings({
    isConnected,
    name,
    paperSize,
    onConnectBluetooth,
    onConnectUsb,
    onDisconnect,
    onPaperSizeChange
}: PrinterSettingsProps) {
    return (
        <DropdownMenu>
            <DropdownMenuTrigger asChild>
                <Button variant={isConnected ? "outline" : "secondary"} className="gap-2">
                    <Printer className="size-4" />
                    {isConnected ? name : 'Hubungkan Printer'}
                    {isConnected && <div className="size-2 rounded-full bg-green-500 animate-pulse" />}
                </Button>
            </DropdownMenuTrigger>
            <DropdownMenuContent align="end" className="w-56">
                <DropdownMenuLabel>Koneksi Printer</DropdownMenuLabel>
                <DropdownMenuSeparator />
                {isConnected ? (
                    <>
                        <DropdownMenuSub>
                            <DropdownMenuSubTrigger>
                                Ukuran Kertas: {paperSize}mm
                            </DropdownMenuSubTrigger>
                            <DropdownMenuSubContent>
                                <DropdownMenuRadioGroup value={paperSize} onValueChange={onPaperSizeChange}>
                                    <DropdownMenuRadioItem value="58">58mm</DropdownMenuRadioItem>
                                    <DropdownMenuRadioItem value="80">80mm</DropdownMenuRadioItem>
                                </DropdownMenuRadioGroup>
                            </DropdownMenuSubContent>
                        </DropdownMenuSub>
                        <DropdownMenuSeparator />
                        <DropdownMenuItem onClick={onDisconnect} variant="destructive">
                            <Unplug className="mr-2 size-4" />
                            Putus Koneksi
                        </DropdownMenuItem>
                    </>
                ) : (
                    <>
                        <DropdownMenuItem onClick={onConnectBluetooth}>
                            <Bluetooth className="mr-2 size-4" />
                            Bluetooth
                        </DropdownMenuItem>
                        <DropdownMenuItem onClick={onConnectUsb}>
                            <Usb className="mr-2 size-4" />
                            USB
                        </DropdownMenuItem>
                    </>
                )}
            </DropdownMenuContent>
        </DropdownMenu>
    );
}
