Add CopyForLLMButton to copy markdown content for AI tools

Co-authored-by: rahul.chhabria <[email protected]>

Author: cursoragent

src/components/copyForLLMButton.tsx

@@ -0,0 +1,45 @@
+'use client';
+
+import {useState} from 'react';
+import {Clipboard, Check} from 'react-feather';
+
+interface Props {
+  /** Absolute path to the markdown version of this page (e.g. `/docs/page.md`) */
+  markdownPath: string;
+}
+
+export function CopyForLLMButton({markdownPath}: Props) {
+  const [copied, setCopied] = useState(false);
+
+  async function handleClick() {
+    try {
+      // Attempt to fetch the markdown content and copy it
+      const response = await fetch(markdownPath);
+      const text = await response.text();
+      await navigator.clipboard.writeText(text);
+    } catch (err) {
+      // Fallback: copy the markdown url itself
+      await navigator.clipboard.writeText(window.location.origin + markdownPath);
+    } finally {
+      setCopied(true);
+      setTimeout(() => setCopied(false), 1200);
+    }
+  }
+
+  return (
+    <button
+      type="button"
+      onClick={handleClick}
+      title="Copy page content for LLM"
+      className="mr-2 float-right flex items-center gap-1 border rounded px-2 py-1 text-xs hover:bg-[var(--gray-2)]"
+      data-mdast="ignore"
+    >
+      {copied ? (
+        <Check size={14} />
+      ) : (
+        <Clipboard size={14} />
+      )}
+      <span className="whitespace-nowrap">Copy for LLM</span>
+    </button>
+  );
+}

src/components/docPage/index.tsx

@@ -23,6 +23,7 @@ import {PlatformSdkDetail} from '../platformSdkDetail';
 import {Sidebar} from '../sidebar';
 import {SidebarTableOfContents} from '../sidebarTableOfContents';
 import {ReaderDepthTracker} from '../track-reader-depth';
+import {CopyForLLMButton} from '../copyForLLMButton';
 
 type Props = {
   children: ReactNode;
@@ -94,6 +95,7 @@ export function DocPage({
               >
                 <Markdown className="flex p-0 flex-wrap" width={24} height={24} />
               </Link>
+              <CopyForLLMButton markdownPath={`/${pathname}.md`} />
             </div>
             <div>
               <hgroup>