import { Plus, Zap } from "lucide-react";

type EmptyStateProps = {
  title: string;
  copy: string;
  actionLabel?: string;
  onAction?: () => void;
};

export function EmptyState({ title, copy, actionLabel, onAction }: EmptyStateProps) {
  return (
    <div className="empty-state">
      <div className="empty-state-icon">
        <Zap size={22} aria-hidden="true" />
      </div>
      <h3 className="empty-state-title">{title}</h3>
      <p className="empty-state-copy mt-2 max-w-sm">{copy}</p>
      {actionLabel && onAction && (
        <button className="primary-button mt-4" type="button" onClick={onAction}>
          <Plus size={17} aria-hidden="true" />
          {actionLabel}
        </button>
      )}
    </div>
  );
}