import React from 'react';

interface EmptyStateProps {
  icon?: string;
  title?: string;
  message?: string;
  action?: (() => void) | null;
  actionLabel?: string;
  className?: string;
}

function EmptyState({ 
  icon = '📊', 
  title, 
  message, 
  action = null, 
  actionLabel = 'Try Again',
  className = ''
}: EmptyStateProps) {
  return (
    <div className={`empty-state ${className}`}>
      <div className="empty-state-icon" role="img" aria-hidden="true">
        {icon}
      </div>
      {title && (
        <h3 className="empty-state-title">{title}</h3>
      )}
      {message && (
        <p className="empty-state-message">{message}</p>
      )}
      {action && (
        <button 
          className="empty-state-action"
          onClick={action}
          type="button"
        >
          {actionLabel}
        </button>
      )}
    </div>
  );
}

export default EmptyState;
