diff --git a/frontend/app/components/Kai/components/ChatMsg.tsx b/frontend/app/components/Kai/components/ChatMsg.tsx
index cd5289a35..db9e249cc 100644
--- a/frontend/app/components/Kai/components/ChatMsg.tsx
+++ b/frontend/app/components/Kai/components/ChatMsg.tsx
@@ -102,7 +102,7 @@ export function ChatMsg({
             <IconButton tooltip="Dislike this answer" onClick={() => onFeedback('dislike', messageId)}>
               <ThumbsDown size={16} />
             </IconButton>
-            <CopyButton content={() => bodyRef.current?.innerHTML} isIcon format={'text/html'} />
+            <CopyButton getHtml={() => bodyRef.current?.innerHTML} content={text} isIcon format={'text/html'} />
             <IconButton processing={isProcessing} tooltip="Export as PDF" onClick={onExport}>
               <FileDown size={16} />
             </IconButton>
diff --git a/frontend/app/components/ui/CopyButton/CopyButton.js b/frontend/app/components/ui/CopyButton/CopyButton.tsx
similarity index 80%
rename from frontend/app/components/ui/CopyButton/CopyButton.js
rename to frontend/app/components/ui/CopyButton/CopyButton.tsx
index 52652ae2f..f82375914 100644
--- a/frontend/app/components/ui/CopyButton/CopyButton.js
+++ b/frontend/app/components/ui/CopyButton/CopyButton.tsx
@@ -3,15 +3,27 @@ import copy from 'copy-to-clipboard';
 import { Button, Tooltip } from 'antd';
 import { ClipboardCopy, ClipboardCheck } from 'lucide-react';
 
+interface Props {
+  content: string;
+  getHtml?: () => any;
+  variant?: 'text' | 'primary' | 'ghost' | 'link' | 'default';
+  className?: string;
+  btnText?: string;
+  size?: 'small' | 'middle' | 'large';
+  isIcon?: boolean;
+  format?: string;
+}
+
 function CopyButton({
   content,
+  getHtml,
   variant = 'text',
   className = 'capitalize mt-2 font-medium text-neutral-400',
   btnText = 'copy',
   size = 'small',
   isIcon = false,
   format = 'text/plain',
-}) {
+}: Props) {
   const [copied, setCopied] = useState(false);
 
   const reset = () => {
@@ -21,8 +33,8 @@ function CopyButton({
   }
   const copyHandler = () => {
     setCopied(true);
-    const contentIsGetter = typeof content === 'function'
-    const textContent = contentIsGetter ? content() : content;
+    const contentIsGetter = !!getHtml
+    const textContent = contentIsGetter ? getHtml() : content;
     const isHttps = window.location.protocol === 'https:';
     if (!isHttps) {
       copy(textContent);
diff --git a/frontend/app/components/ui/CopyButton/index.js b/frontend/app/components/ui/CopyButton/index.ts
similarity index 100%
rename from frontend/app/components/ui/CopyButton/index.js
rename to frontend/app/components/ui/CopyButton/index.ts