import React, { useState } from 'react';
import { Download } from 'lucide-react';
import { Button } from '@/components/ui/button';
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuTrigger,
} from '@/components/ui/dropdown-menu';

import { useToast } from '@/hooks/useToast';
import { TokenStorage } from '@/services/tokenStorage';
import { logger } from '@/utils/logger';

interface ExportPlaylistButtonProps {
  // FE-TYPE-001: IDs are strings (UUIDs), not numbers
  playlistId: string;
  playlistTitle?: string;
}

/**
 * ExportPlaylistButton - Bouton pour exporter une playlist en différents formats
 * T0493: Create Playlist Export Feature
 */
export const ExportPlaylistButton: React.FC<ExportPlaylistButtonProps> = ({
  playlistId,
  playlistTitle = 'playlist',
}) => {
  const [isExporting, setIsExporting] = useState(false);
  const { success: showSuccess, error: showError } = useToast();

  const handleExport = async (format: 'json' | 'csv') => {
    setIsExporting(true);
    try {
      const url = `/api/v1/playlists/${playlistId}/export/${format}`;

      // Récupérer le token d'authentification
      const token = TokenStorage.getAccessToken();
      if (!token) {
        showError('Vous devez être connecté pour exporter une playlist');
        return;
      }

      // Faire la requête pour télécharger le fichier
      const response = await fetch(url, {
        method: 'GET',
        headers: {
          Authorization: `Bearer ${token}`,
        },
      });

      if (!response.ok) {
        if (response.status === 403) {
          throw new Error(
            "Vous n'avez pas la permission d'exporter cette playlist",
          );
        }
        if (response.status === 404) {
          throw new Error('Playlist non trouvée');
        }
        throw new Error("Erreur lors de l'export");
      }

      // Récupérer le blob
      const blob = await response.blob();

      // Créer un lien de téléchargement
      const downloadUrl = window.URL.createObjectURL(blob);
      const link = document.createElement('a');
      link.href = downloadUrl;

      // Déterminer le nom du fichier depuis le header Content-Disposition ou utiliser un nom par défaut
      const contentDisposition = response.headers.get('Content-Disposition');
      let filename = `${playlistTitle}_${new Date().toISOString().split('T')[0]}.${format}`;
      if (contentDisposition) {
        const filenameMatch = contentDisposition.match(/filename="?(.+)"?/);
        if (filenameMatch) {
          filename = filenameMatch[1];
        }
      }

      link.download = filename;
      document.body.appendChild(link);
      link.click();
      document.body.removeChild(link);
      window.URL.revokeObjectURL(downloadUrl);

      showSuccess(
        `La playlist a été exportée en format ${format.toUpperCase()}`,
      );
    } catch (error) {
      logger.error('Export error:', { error });
      showError(
        error instanceof Error
          ? error.message
          : "Une erreur est survenue lors de l'export",
      );
    } finally {
      setIsExporting(false);
    }
  };

  return (
    <DropdownMenu>
      <DropdownMenuTrigger asChild>
        <Button
          variant="outline"
          size="sm"
          disabled={isExporting}
          className="gap-2"
        >
          <Download className="h-4 w-4" />
          {isExporting ? 'Export...' : 'Exporter'}
        </Button>
      </DropdownMenuTrigger>
      <DropdownMenuContent align="end">
        <DropdownMenuItem
          onClick={() => handleExport('json')}
          disabled={isExporting}
        >
          Exporter en JSON
        </DropdownMenuItem>
        <DropdownMenuItem
          onClick={() => handleExport('csv')}
          disabled={isExporting}
        >
          Exporter en CSV
        </DropdownMenuItem>
      </DropdownMenuContent>
    </DropdownMenu>
  );
};
