simsite/frontend/src/components/thermique/SimulationHistory.jsx

export default function SimulationHistory({ simulations, selectedId, onSelect, onDelete }) {
    if (!simulations || simulations.length === 0) {
        return (
            <div className="simulation-history">
                <h3>Historique</h3>
                <p className="no-simulations">Aucune simulation</p>
            </div>
        );
    }
    
    const formatDate = (dateStr) => {
        const date = new Date(dateStr);
        return date.toLocaleDateString('fr-FR', { 
            day: '2-digit', 
            month: '2-digit',
            hour: '2-digit',
            minute: '2-digit'
        });
    };
    
    return (
        <div className="simulation-history">
            <h3>Historique ({simulations.length})</h3>
            <ul className="simulation-list">
                {simulations.map(sim => (
                    <li 
                        key={sim.id}
                        className={`simulation-item ${selectedId === sim.id ? 'selected' : ''}`}
                        onClick={() => onSelect(sim)}
                    >
                        <div className="sim-header">
                            <span className="sim-name">{sim.name}</span>
                            <span className={`status status-${sim.status}`}>
                                {sim.status}
                            </span>
                        </div>
                        <div className="sim-details">
                            <span>α={sim.thermal_diffusivity}</span>
                            <span>t={sim.time_end}s</span>
                            <span>{formatDate(sim.created_at)}</span>
                        </div>
                        <button 
                            className="delete-btn"
                            onClick={(e) => {
                                e.stopPropagation();
                                if (confirm('Supprimer cette simulation ?')) {
                                    onDelete(sim.id);
                                }
                            }}
                        >
                            ×
                        </button>
                    </li>
                ))}
            </ul>
        </div>
    );
}