import * as React from "react";
import Link from "next/link";
import { cn } from "@/lib/utils";
import { Button, buttonVariants } from "@/components/ui/button";
import { LucideIcon, Inbox } from "lucide-react";

interface EmptyStateAction {
  label: string;
  href?: string;
  onClick?: () => void;
  variant?: "default" | "outline" | "secondary" | "ghost";
  icon?: React.ElementType;
}

interface EmptyStateProps {
  icon?: React.ElementType;
  title: string;
  description?: string;
  primaryAction?: EmptyStateAction;
  secondaryAction?: EmptyStateAction;
  className?: string;
  compact?: boolean;
  variant?: string;
}

export function EmptyState({
  icon: Icon = Inbox,
  title,
  description,
  primaryAction,
  secondaryAction,
  className,
  compact = false,
}: EmptyStateProps) {
  return (
    <div
      className={cn(
        "flex flex-col items-center justify-center text-center rounded-md border border-border/80 bg-card/40 transition-all",
        compact ? "py-4 px-3" : "py-6 px-4 sm:px-6",
        className
      )}
    >
      {/* Standard Crisp Icon */}
      <Icon className="size-5 text-muted-foreground mb-2 shrink-0" />

      {/* Title */}
      <h3 className="font-semibold text-xs text-foreground tracking-tight">
        {title}
      </h3>

      {/* Single-line Concise Description */}
      {description && (
        <p className="text-[11px] text-muted-foreground mt-0.5 max-w-sm">
          {description}
        </p>
      )}

      {/* Actions */}
      {(primaryAction || secondaryAction) && (
        <div className="flex flex-wrap items-center justify-center gap-2 mt-3">
          {primaryAction && (
            primaryAction.href ? (
              <Link
                href={primaryAction.href}
                className={cn(
                  buttonVariants({
                    variant: primaryAction.variant || "default",
                    size: "sm",
                  }),
                  "gap-1.5 h-7 px-3 text-xs rounded-md shadow-xs font-medium"
                )}
              >
                {primaryAction.icon && <primaryAction.icon className="size-3.5" />}
                <span>{primaryAction.label}</span>
              </Link>
            ) : (
              <Button
                variant={primaryAction.variant || "default"}
                size="sm"
                onClick={primaryAction.onClick}
                className="gap-1.5 h-7 px-3 text-xs rounded-md shadow-xs font-medium"
              >
                {primaryAction.icon && <primaryAction.icon className="size-3.5" />}
                <span>{primaryAction.label}</span>
              </Button>
            )
          )}

          {secondaryAction && (
            secondaryAction.href ? (
              <Link
                href={secondaryAction.href}
                className={cn(
                  buttonVariants({
                    variant: secondaryAction.variant || "outline",
                    size: "sm",
                  }),
                  "gap-1.5 h-7 px-3 text-xs rounded-md font-medium"
                )}
              >
                {secondaryAction.icon && <secondaryAction.icon className="size-3.5" />}
                <span>{secondaryAction.label}</span>
              </Link>
            ) : (
              <Button
                variant={secondaryAction.variant || "outline"}
                size="sm"
                onClick={secondaryAction.onClick}
                className="gap-1.5 h-7 px-3 text-xs rounded-md font-medium"
              >
                {secondaryAction.icon && <secondaryAction.icon className="size-3.5" />}
                <span>{secondaryAction.label}</span>
              </Button>
            )
          )}
        </div>
      )}
    </div>
  );
}