/**
 * Log Export Buttons
 * Enterprise Logging System — Admin Dashboard
 *
 * CSV / Excel / JSON export buttons (Super Admin). Downloads are
 * triggered through the browser via a Blob URL from the backend.
 */

'use client';

import { useState } from 'react';
import { loggingService } from '@/services/logging.service';
import type { LogTypeName, LogExportFormat } from '@/types/logging.types';

interface LogExportButtonsProps {
  type: LogTypeName;
  from?: string;
  to?: string;
}

export function LogExportButtons({ type, from, to }: LogExportButtonsProps) {
  const [exporting, setExporting] = useState<LogExportFormat | null>(null);
  const [error, setError] = useState<string | null>(null);

  const handleExport = async (format: LogExportFormat) => {
    setExporting(format);
    setError(null);
    try {
      await loggingService.exportLogs(type, format, from, to, 10000);
    } catch (err: any) {
      setError(err?.response?.data?.message ?? err?.message ?? 'Export failed');
    } finally {
      setExporting(null);
    }
  };

  const baseClass =
    'inline-flex items-center gap-1 rounded-lg border border-white/10 px-3 py-2 text-xs font-medium text-slate-200 hover:bg-white/5 disabled:opacity-50';

  return (
    <div className="flex items-center gap-2">
      <button
        className={baseClass}
        onClick={() => handleExport('csv')}
        disabled={exporting !== null}
      >
        {exporting === 'csv' ? 'Exporting...' : 'CSV'}
      </button>
      <button
        className={baseClass}
        onClick={() => handleExport('excel')}
        disabled={exporting !== null}
      >
        {exporting === 'excel' ? 'Exporting...' : 'Excel'}
      </button>
      <button
        className={baseClass}
        onClick={() => handleExport('json')}
        disabled={exporting !== null}
      >
        {exporting === 'json' ? 'Exporting...' : 'JSON'}
      </button>
      {error && <span className="text-xs text-rose-400">{error}</span>}
    </div>
  );
}