"use client";
import React from "react";
import { Button, ButtonProps } from "./ui/button";
import { cn } from "@/lib/utils";
import { Copy } from "lucide-react";
import { toast } from "sonner";

function CopyToClip({
  text,
  children,
  buttonProps,
  targetName,
}: {
  text: string;
  children?: React.ReactNode;
  buttonProps?: ButtonProps;
  targetName?: string;
}) {
  const handleClick = () => {
    navigator.clipboard.writeText(text);
    toast.success(`${targetName ?? "Text"} in die Zwischenablage kopiert`);
  };

  return (
    <Button
      size={"icon"}
      onClick={handleClick}
      variant="outline"
      className={cn(
        "size-max gap-1 bg-muted p-1 text-muted-foreground",
        buttonProps?.className,
      )}
      {...buttonProps}
    >
      {children ?? (
        <>
          <Copy className="size-4" />
        </>
      )}
    </Button>
  );
}

export default CopyToClip;
