feat: Message copy button (#171)

* Add copy button * Fix copy button not copying the entire message * fix style * remove prewrap --------- Co-authored-by: Mckay Wrigley <mckaywrigley@gmail.com>
2023-03-26 00:28:08 -04:00
parent fffb729b34
commit 14fe29c03a
2 changed files with 84 additions and 37 deletions
@@ -0,0 +1,24 @@
+import { IconCheck, IconCopy } from "@tabler/icons-react";
+import { FC } from "react";
+
+type Props = {
+  messagedCopied: boolean;
+  copyOnClick: () => void;
+};
+
+export const CopyButton: FC<Props> = ({ messagedCopied, copyOnClick }) => (
+  <button className={`absolute ${window.innerWidth < 640 ? "right-3 bottom-1" : "right-[-20px] top-[26px] m-0"}`}>
+    {messagedCopied ? (
+      <IconCheck
+        size={20}
+        className="text-green-500 dark:text-green-400"
+      />
+    ) : (
+      <IconCopy
+        size={20}
+        className="text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-300"
+        onClick={copyOnClick}
+      />
+    )}
+  </button>
+);