import * as React from "react";
import { Button } from "@/components/ui/button";
import { Loader2 } from "lucide-react";
import { cn } from "@/lib/utils";

export type FancyButtonProps = React.ComponentProps<typeof Button> & {
  loading?: boolean;
};

export function FancyButton({
  loading,
  className,
  children,
  ...props
}: FancyButtonProps) {
  return (
    <Button
      className={cn("relative", className)}
      disabled={loading || props.disabled}
      {...props}
    >
      {loading ? <Loader2 className="mr-2 h-4 w-4 animate-spin" /> : null}
      {children}
    </Button>
  );
}