import React from 'react';
import { open } from '@tauri-apps/plugin-dialog';

interface FileSelectorProps {
  label: string;
  onFileSelect: (path: string) => void;
  accept: string[];
}

export const FileSelector: React.FC<FileSelectorProps> = ({ label, onFileSelect, accept }) => {
  const handleClick = async () => {
    try {
      const selected = await open({
        multiple: false,
        filters: [{
          name: 'Files',
          extensions: accept
        }]
      });
      
      if (selected && !Array.isArray(selected)) {
        onFileSelect(selected);
      }
    } catch (err) {
      console.error('Error selecting file:', err);
    }
  };

  return (
    <button 
      onClick={handleClick}
      className="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600 transition-colors"
    >
      {label}
    </button>
  );
};
