/**
 * List component for Closed Requests with loading and empty states
 */

import { ClosedRequest } from '../types/closedRequests.types';
import { ClosedRequestCard } from './ClosedRequestCard';

interface ClosedRequestsListProps {
  requests: ClosedRequest[];
  loading: boolean;
  onViewRequest?: (requestId: string, requestTitle?: string) => void;
}

export function ClosedRequestsList({ requests, loading, onViewRequest }: ClosedRequestsListProps) {
  if (loading && requests.length === 0) {
    return (
      <div className="space-y-4" data-testid="closed-requests-list-loading">
        {[...Array(3)].map((_, i) => (
          <div key={i} className="h-32 bg-gray-100 animate-pulse rounded-lg" />
        ))}
      </div>
    );
  }

  if (requests.length === 0) {
    return null; // Empty state is handled by parent
  }

  return (
    <div className="space-y-4" data-testid="closed-requests-list">
      {requests.map((request) => (
        <ClosedRequestCard
          key={request.id}
          request={request}
          onViewRequest={onViewRequest}
        />
      ))}
    </div>
  );
}

