From 59a1106bc02023ecf2aa80736efb59f6989e4936 Mon Sep 17 00:00:00 2001
From: devin distefano <devin.distefano@smartcontract.com>
Date: Mon, 16 Mar 2026 17:37:15 -0500
Subject: [PATCH 1/2] ai badge, implementation on copy button

---
 src/components/AiBadge/AiBadge.module.css     | 21 ++++++++++++++
 src/components/AiBadge/AiBadge.tsx            | 29 +++++++++++++++++++
 .../CopyPageLink/CopyPageLink.tsx             |  2 ++
 3 files changed, 52 insertions(+)
 create mode 100644 src/components/AiBadge/AiBadge.module.css
 create mode 100644 src/components/AiBadge/AiBadge.tsx

diff --git a/src/components/AiBadge/AiBadge.module.css b/src/components/AiBadge/AiBadge.module.css
new file mode 100644
index 00000000000..7e23f513a49
--- /dev/null
+++ b/src/components/AiBadge/AiBadge.module.css
@@ -0,0 +1,21 @@
+.badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 3px;
+  padding: 2px 5px;
+  background-color: var(--blue-600, #375bd2);
+  border-radius: 4px;
+  font-size: 10px;
+  font-weight: 700;
+  color: #fff;
+  letter-spacing: 0.4px;
+  line-height: 1;
+  flex-shrink: 0;
+  vertical-align: middle;
+  user-select: none;
+}
+
+.sparkle {
+  flex-shrink: 0;
+  opacity: 0.9;
+}
diff --git a/src/components/AiBadge/AiBadge.tsx b/src/components/AiBadge/AiBadge.tsx
new file mode 100644
index 00000000000..d91bd03fb50
--- /dev/null
+++ b/src/components/AiBadge/AiBadge.tsx
@@ -0,0 +1,29 @@
+import styles from "./AiBadge.module.css"
+
+interface AiBadgeProps {
+  className?: string
+}
+
+export function AiBadge({ className }: AiBadgeProps) {
+  return (
+    <span className={`${styles.badge} ${className || ""}`} aria-label="Includes AI features">
+      <svg
+        className={styles.sparkle}
+        width="8"
+        height="8"
+        viewBox="0 0 16 16"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        aria-hidden="true"
+      >
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M12.06 2.06L13 0L13.94 2.06L16 3L13.94 3.94L13 6L12.06 3.94L10 3L12.06 2.06ZM4.47 7.47L6.5 3L8.53 7.47L13 9.5L8.53 11.53L6.5 16L4.47 11.53L0 9.5L4.47 7.47Z"
+          fill="currentColor"
+        />
+      </svg>
+      AI
+    </span>
+  )
+}
diff --git a/src/components/RightSidebar/CopyPageLink/CopyPageLink.tsx b/src/components/RightSidebar/CopyPageLink/CopyPageLink.tsx
index b699145392c..46206fd6292 100644
--- a/src/components/RightSidebar/CopyPageLink/CopyPageLink.tsx
+++ b/src/components/RightSidebar/CopyPageLink/CopyPageLink.tsx
@@ -8,6 +8,7 @@ import { extractPageContent, copyToClipboard } from "./contentExtractor.js"
 import { MarkdownPreviewModal } from "./MarkdownPreviewModal.js"
 import type { CopyPageLinkProps, CopyAction } from "./types.js"
 import styles from "./CopyPageLink.module.css"
+import { AiBadge } from "../../AiBadge/AiBadge.js"
 
 export function CopyPageLink({ className }: CopyPageLinkProps) {
   const [isDropdownOpen, setIsDropdownOpen] = useState(false)
@@ -199,6 +200,7 @@ Please ask me to paste it now. After I paste, please:
             />
           </svg>
           <span className={styles.triggerText}>{copiedAction === "copy" ? "Copied!" : "Copy page"}</span>
+          {!copiedAction && <AiBadge />}
           <svg className={styles.arrow} width="12" height="12" viewBox="0 0 12 12" fill="none">
             <path
               d="M2.5 4.5L6 8L9.5 4.5"

From 5eeec03f48dbed2ae64e466de734ee480f6b29db Mon Sep 17 00:00:00 2001
From: devin distefano <devin.distefano@smartcontract.com>
Date: Mon, 16 Mar 2026 18:00:58 -0500
Subject: [PATCH 2/2] move badge to header + rename header

---
 .../RightSidebar/CopyPageLink/CopyPageLink.module.css         | 4 +++-
 src/components/RightSidebar/CopyPageLink/CopyPageLink.tsx     | 4 +---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/RightSidebar/CopyPageLink/CopyPageLink.module.css b/src/components/RightSidebar/CopyPageLink/CopyPageLink.module.css
index 4e04dbfdb63..2057a94b3a6 100644
--- a/src/components/RightSidebar/CopyPageLink/CopyPageLink.module.css
+++ b/src/components/RightSidebar/CopyPageLink/CopyPageLink.module.css
@@ -9,7 +9,9 @@
 }
 
 .label {
-  display: block;
+  display: flex;
+  align-items: center;
+  gap: 6px;
   font-size: 0.75rem;
   font-weight: 500;
   color: var(--gray-600, #4b5563);
diff --git a/src/components/RightSidebar/CopyPageLink/CopyPageLink.tsx b/src/components/RightSidebar/CopyPageLink/CopyPageLink.tsx
index 46206fd6292..07c679fcbb8 100644
--- a/src/components/RightSidebar/CopyPageLink/CopyPageLink.tsx
+++ b/src/components/RightSidebar/CopyPageLink/CopyPageLink.tsx
@@ -9,7 +9,6 @@ import { MarkdownPreviewModal } from "./MarkdownPreviewModal.js"
 import type { CopyPageLinkProps, CopyAction } from "./types.js"
 import styles from "./CopyPageLink.module.css"
 import { AiBadge } from "../../AiBadge/AiBadge.js"
-
 export function CopyPageLink({ className }: CopyPageLinkProps) {
   const [isDropdownOpen, setIsDropdownOpen] = useState(false)
   const [isModalOpen, setIsModalOpen] = useState(false)
@@ -170,7 +169,7 @@ Please ask me to paste it now. After I paste, please:
     <>
       <div className={`${styles.container} ${className || ""}`}>
         <label className={styles.label} htmlFor="copy-page-trigger">
-          Copy Page
+          Use with LLMs <AiBadge />
         </label>
         <button
           id="copy-page-trigger"
@@ -200,7 +199,6 @@ Please ask me to paste it now. After I paste, please:
             />
           </svg>
           <span className={styles.triggerText}>{copiedAction === "copy" ? "Copied!" : "Copy page"}</span>
-          {!copiedAction && <AiBadge />}
           <svg className={styles.arrow} width="12" height="12" viewBox="0 0 12 12" fill="none">
             <path
               d="M2.5 4.5L6 8L9.5 4.5"