import { Loader2 } from "lucide-react";

import { EmptyState } from "@/components/shared/empty-state";
import { ErrorState } from "@/components/shared/error-state";

interface StatePanelProps {
  title: string;
  description: string;
  actionLabel?: string;
  onAction?: () => void;
}

export function EmptyStatePanel(props: StatePanelProps) {
  return <EmptyState {...props} />;
}

export function ErrorStatePanel(props: StatePanelProps) {
  return <ErrorState {...props} />;
}

interface InlineLoadingPanelProps {
  label?: string;
}

export function InlineLoadingPanel({ label = "Processing media..." }: InlineLoadingPanelProps) {
  return (
    <div className="inline-flex items-center gap-2 rounded-lg border border-white/10 bg-white/5 px-3 py-2 text-sm text-slate-300">
      <Loader2 className="size-4 animate-spin" />
      {label}
    </div>
  );
}
