export const useCopyable = (
  valueOrCallback:
    | string
    | Ref<string>
    | (() => PromiseLike<string>)
    | (() => PromiseLike<void>),
) => {
  const icon = ref("i-heroicons-clipboard-document");
  const label = ref("Copy");

  const toast = useToast();

  const copy = async () => {
    try {
      if (typeof valueOrCallback === "function") {
        await valueOrCallback();
      } else {
        const value = unref(valueOrCallback);
        await navigator.clipboard.writeText(value);
      }
    } catch {
      toast.add({
        title: "Failed to copy to clipboard",
        color: "error",
        icon: "i-lucide-circle-x",
      });
      return;
    }

    icon.value = "i-heroicons-clipboard-document-check";
    label.value = "Copied!";

    setTimeout(() => {
      icon.value = "i-heroicons-clipboard-document";
      label.value = "Copy";
    }, 3000);
  };

  return { icon, copy, label };
};