import { Button } from "@/components/ui/button";
import { Search, Users } from "lucide-react";
import { cn } from "@/lib/utils";

interface EmptyStateProps {
  variant: "none" | "filters" | "related";
  onClearFilters?: () => void;
  className?: string;
}

export function WorksEmptyState({
  variant,
  onClearFilters,
  className,
}: EmptyStateProps) {
  if (variant === "related") {
    return (
      <div
        className={cn(
          "text-center py-12 bg-navy/5 dark:bg-navy/10 rounded-lg",
          className
        )}
      >
        <Users className="h-12 w-12 text-navy/30 dark:text-cream/30 mx-auto mb-4" />
        <p className="text-navy/70 dark:text-cream/70">
          No related authors found.
        </p>
      </div>
    );
  }
  if (variant === "filters") {
    return (
      <div
        className={cn(
          "text-center py-12 bg-navy/5 dark:bg-navy/10 rounded-lg",
          className
        )}
      >
        <div className="flex flex-col items-center">
          <Search className="h-12 w-12 text-navy/30 dark:text-cream/30 mb-4" />
          <h3 className="text-lg font-medium text-navy dark:text-cream mb-2">
            No works found
          </h3>
          <p className="text-navy/70 dark:text-cream/70 max-w-md mb-6">
            We couldn't find any works matching your current filters.
          </p>
          {onClearFilters && (
            <Button variant="outline" onClick={onClearFilters}>
              Clear Filters
            </Button>
          )}
        </div>
      </div>
    );
  }
  return (
    <div
      className={cn(
        "text-center py-12 bg-navy/5 dark:bg-navy/10 rounded-lg",
        className
      )}
    >
      <p className="text-navy/70 dark:text-cream/70">
        No works found for this author.
      </p>
    </div>
  );
}
