import { Trophy, Sparkles, LucideIcon } from 'lucide-react';
import { Card } from '@/ui/Card';
import { EmptyState as UiEmptyState } from '@/ui/EmptyState';
import React from 'react';

interface EmptyStateProps {
  title: string;
  description: string;
  icon?: LucideIcon;
  actionIcon?: LucideIcon;
  actionLabel?: string;
  onAction?: () => void;
  children?: React.ReactNode;
}

export function EmptyState({
  title,
  description,
  icon = Trophy,
  actionIcon = Sparkles,
  actionLabel,
  onAction,
  children,
}: EmptyStateProps) {
  return (
    <Card>
      <UiEmptyState
        title={title}
        description={description}
        icon={icon}
        action={actionLabel && onAction ? {
          label: actionLabel,
          onClick: onAction,
          icon: actionIcon,
        } : undefined}
        variant="minimal"
      >
        {children}
      </UiEmptyState>
    </Card>
  );
}