import ComboBoxInput from '@/Components/ComboBoxInput';
import { Company } from '@/types';
import axios from 'axios';
import { useState } from 'react';

interface CompanySelectInputProps {
    value: Company | null;
    onChange: (company: Company | null) => void;
    readOnly?: boolean;
}

export default function CompanySelectInput({
    value,
    onChange,
    readOnly = false,
}: CompanySelectInputProps) {
    const [availableCompanies, setAvailableCompanies] = useState<Company[]>([]);

    const fetchCompanies = async (search: string) => {
        try {
            const response = await axios.get(route('search-companies'), {
                params: { search },
            });
            setAvailableCompanies(response.data);
        } catch (error) {
            console.error('Error fetching items:', error);
        }
    };

    return (
        <ComboBoxInput
            value={value}
            options={availableCompanies}
            readOnly={readOnly}
            renderOption={(company) => company.name}
            onChange={onChange}
            onSearchChange={fetchCompanies}
        />
    );
}