diff --git a/app/src/components/CopiableCode.tsx b/app/src/components/CopiableCode.tsx
index 8215b78..1c4d136 100644
--- a/app/src/components/CopiableCode.tsx
+++ b/app/src/components/CopiableCode.tsx
@@ -1,17 +1,14 @@
 import { HStack, Icon, IconButton, Tooltip, Text } from "@chakra-ui/react";
-import { useCallback, useState } from "react";
+import { useState } from "react";
 import { MdContentCopy } from "react-icons/md";
+import { useHandledAsyncCallback } from "~/utils/hooks";
 
 const CopiableCode = ({ code }: { code: string }) => {
   const [copied, setCopied] = useState(false);
 
-  const copyToClipboard = useCallback(() => {
-    const onCopy = async () => {
-      console.log("copied!");
-      await navigator.clipboard.writeText(code);
-      setCopied(true);
-    };
-    void onCopy();
+  const [copyToClipboard] = useHandledAsyncCallback(async () => {
+    await navigator.clipboard.writeText(code);
+    setCopied(true);
   }, [code]);
   return (
     <HStack