// ToolsRegistry - Component for displaying tool registry with available/unavailable tools
import React from 'react';
import Card from '../Card';
import ToolCard from './ToolCard';

function ToolsRegistry({ tools, selectedTool, onToolSelect, onRefresh }) {
  const available = tools.filter(t => t.available);
  const unavailable = tools.filter(t => !t.available);

  return (
    <Card title={`Tool Registry (${available.length}/${tools.length} available)`}>
      <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
        {available.map(t => (
          <ToolCard 
            key={t.name} 
            tool={t} 
            isSelected={selectedTool === t.name}
            onSelect={onToolSelect}
            onRefresh={onRefresh}
          />
        ))}
        {unavailable.map(t => (
          <ToolCard 
            key={t.name} 
            tool={t} 
            isSelected={selectedTool === t.name}
            onSelect={onToolSelect}
            onRefresh={onRefresh}
          />
        ))}
      </div>
    </Card>
  );
}

export default ToolsRegistry;
