From a4733c0617433204d6570f5f2a5008b5f9409c7e Mon Sep 17 00:00:00 2001
From: Aman Varshney <amanvarshney.work@gmail.com>
Date: Thu, 2 Apr 2026 20:56:07 +0530
Subject: [PATCH 1/4] fix(site): fix MCP page agent cards, prompt bubbles, and
 CTAs

- Agent cards: add tooltips, copy-to-clipboard, correct deep links for Cursor/VS Code, and proper external links
- Prompt bubbles: make copyable with tooltip feedback
- CTA section: differentiate "Add MCP Server" and "Read Docs" hrefs
- "Want to see your tool listed?": open Tally form modal instead of broken link
---
 .../src/app/mcp/_components/agent-card.tsx    | 88 +++++++++++++------
 .../mcp/_components/mcp-agents-section.tsx    | 73 ++++++++++-----
 .../src/app/mcp/_components/mcp-bubble.tsx    | 48 ++++++----
 .../app/mcp/_components/mcp-cta-section.tsx   | 31 +++----
 apps/site/src/app/mcp/page.tsx                | 55 ++++++------
 5 files changed, 184 insertions(+), 111 deletions(-)

diff --git a/apps/site/src/app/mcp/_components/agent-card.tsx b/apps/site/src/app/mcp/_components/agent-card.tsx
index 376a228fed..d334781f7a 100644
--- a/apps/site/src/app/mcp/_components/agent-card.tsx
+++ b/apps/site/src/app/mcp/_components/agent-card.tsx
@@ -1,45 +1,75 @@
+"use client";
+
 import Image from "next/image";
+import { useState } from "react";
+
+import { Tooltip, TooltipContent, TooltipTrigger } from "@prisma/eclipse";
 
 export function AgentCard({
   logo,
   alt,
   icon,
   href,
+  copyText,
 }: {
   logo: string | null;
   alt: string;
   icon: string | null;
-  href: string;
+  href?: string;
+  copyText?: string;
 }) {
+  const [copied, setCopied] = useState(false);
+
+  const isCopyAction = !!copyText;
+  const isExternalLink = !isCopyAction && href?.startsWith("http");
+
+  const handleClick = (e: React.MouseEvent) => {
+    if (!isCopyAction) return;
+    e.preventDefault();
+    navigator.clipboard.writeText(copyText);
+    setCopied(true);
+    setTimeout(() => setCopied(false), 1500);
+  };
+
+  const Tag = isCopyAction ? "button" : "a";
+  const linkProps = isCopyAction
+    ? { type: "button" as const, onClick: handleClick }
+    : {
+        href,
+        ...(isExternalLink ? { target: "_blank", rel: "noopener noreferrer" } : {}),
+      };
+
   return (
-    <a
-      href={href}
-      title={alt}
-      aria-label={alt}
-      className="group relative flex h-30 w-full max-w-[165px] items-center justify-center rounded-[12px] border border-stroke-neutral bg-background-neutral-weaker shadow-box-low no-underline outline-offset-4 transition-[border-color,background-color,box-shadow] hover:border-stroke-ppg/60 hover:bg-background-default hover:shadow-box-high focus-visible:ring-2 focus-visible:ring-stroke-ppg dark:bg-background-neutral-weaker dark:hover:bg-background-neutral"
-    >
-      {logo ? (
-        <Image
-          src={logo}
-          alt=""
-          width={48}
-          height={48}
-          className="size-12 object-contain brightness-0 opacity-45 transition-opacity group-hover:opacity-65 dark:opacity-55 dark:invert"
-          unoptimized
-        />
-      ) : (
-        <span className="font-mono text-lg text-foreground-neutral-weak">
-          Any AI agent
-        </span>
-      )}
-      {icon ? (
-        <span
-          className="absolute right-1.75 top-1.75 text-foreground-neutral-weaker opacity-50 transition-opacity group-hover:opacity-100"
-          aria-hidden
+    <Tooltip open={copied || undefined}>
+      <TooltipTrigger asChild>
+        <Tag
+          aria-label={alt}
+          className="group relative flex h-30 w-full max-w-[165px] cursor-pointer items-center justify-center rounded-[12px] border border-stroke-neutral bg-background-neutral-weaker shadow-box-low no-underline outline-offset-4 transition-[border-color,background-color,box-shadow] hover:border-stroke-ppg/60 hover:bg-background-default hover:shadow-box-high focus-visible:ring-2 focus-visible:ring-stroke-ppg dark:bg-background-neutral-weaker dark:hover:bg-background-neutral"
+          {...linkProps}
         >
-          <i className={`${icon} text-[16px]`} />
-        </span>
-      ) : null}
-    </a>
+          {logo ? (
+            <Image
+              src={logo}
+              alt=""
+              width={48}
+              height={48}
+              className="size-12 object-contain brightness-0 opacity-45 transition-opacity group-hover:opacity-65 dark:opacity-55 dark:invert dark:group-hover:opacity-80"
+              unoptimized
+            />
+          ) : (
+            <span className="font-mono text-lg text-foreground-neutral-weak">Any AI agent</span>
+          )}
+          {icon ? (
+            <span
+              className="absolute right-1.75 top-1.75 text-foreground-neutral-weaker opacity-50 transition-opacity group-hover:opacity-100"
+              aria-hidden
+            >
+              <i className={`${icon} text-[16px]`} />
+            </span>
+          ) : null}
+        </Tag>
+      </TooltipTrigger>
+      <TooltipContent>{copied ? "Copied!" : alt}</TooltipContent>
+    </Tooltip>
   );
 }
diff --git a/apps/site/src/app/mcp/_components/mcp-agents-section.tsx b/apps/site/src/app/mcp/_components/mcp-agents-section.tsx
index 9cff01c390..6c839a6992 100644
--- a/apps/site/src/app/mcp/_components/mcp-agents-section.tsx
+++ b/apps/site/src/app/mcp/_components/mcp-agents-section.tsx
@@ -1,4 +1,15 @@
-import { Button } from "@prisma/eclipse";
+"use client";
+
+import Script from "next/script";
+
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+  TooltipProvider,
+} from "@prisma/eclipse";
 
 import { AgentCard } from "./agent-card";
 
@@ -6,16 +17,11 @@ export type McpAgent = {
   logo: string | null;
   alt: string;
   icon: string | null;
-  href: string;
+  href?: string;
+  copyText?: string;
 };
 
-export function McpAgentsSection({
-  docsHref,
-  agents,
-}: {
-  docsHref: string;
-  agents: readonly McpAgent[];
-}) {
+export function McpAgentsSection({ agents }: { docsHref: string; agents: readonly McpAgent[] }) {
   return (
     <section className="px-4 py-12 md:px-0">
       <div className="mx-auto flex max-w-[790px] flex-col items-center gap-12 text-center">
@@ -29,19 +35,44 @@ export function McpAgentsSection({
           </p>
         </div>
 
-        <div className="grid w-full max-w-[368px] grid-cols-2 justify-items-center gap-4 min-[400px]:gap-8 md:max-w-[790px] md:grid-cols-4 md:gap-8">
-          {agents.map(({ logo, alt, icon, href }) => (
-            <AgentCard key={alt} logo={logo} alt={alt} icon={icon} href={href} />
-          ))}
-        </div>
+        <TooltipProvider>
+          <div className="grid w-full max-w-[368px] grid-cols-2 justify-items-center gap-4 min-[400px]:gap-8 md:max-w-[790px] md:grid-cols-4 md:gap-8">
+            {agents.map((agent) => (
+              <AgentCard key={agent.alt} {...agent} />
+            ))}
+          </div>
+        </TooltipProvider>
 
-        <Button
-          href={docsHref}
-          variant={"link"}
-          className="text-sm font-semibold text-foreground-ppg underline"
-        >
-          Want to see your tool listed?
-        </Button>
+        <Dialog>
+          <DialogTrigger asChild>
+            <button
+              type="button"
+              className="cursor-pointer text-sm font-semibold text-foreground-ppg underline"
+            >
+              Want to see your tool listed?
+            </button>
+          </DialogTrigger>
+          <DialogContent className="max-w-lg">
+            <DialogHeader>
+              <DialogTitle>Want to see your favorite AI tool listed on prisma.io/mcp?</DialogTitle>
+            </DialogHeader>
+            <iframe
+              data-tally-src="https://tally.so/r/wA1R1N"
+              title="Tool listing request"
+              width="100%"
+              height="400"
+              className="border-0"
+            />
+            <Script
+              src="https://tally.so/widgets/embed.js"
+              onLoad={() => {
+                if (typeof window !== "undefined" && (window as any).Tally) {
+                  (window as any).Tally.loadEmbeds();
+                }
+              }}
+            />
+          </DialogContent>
+        </Dialog>
       </div>
     </section>
   );
diff --git a/apps/site/src/app/mcp/_components/mcp-bubble.tsx b/apps/site/src/app/mcp/_components/mcp-bubble.tsx
index b95d1770f9..564c123c54 100644
--- a/apps/site/src/app/mcp/_components/mcp-bubble.tsx
+++ b/apps/site/src/app/mcp/_components/mcp-bubble.tsx
@@ -1,4 +1,8 @@
-import { useId, type ReactNode } from "react";
+"use client";
+
+import { useId, useState, type ReactNode } from "react";
+
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@prisma/eclipse";
 
 const bubbleShadow = "shadow-box-low dark:shadow-box-high";
 
@@ -8,11 +12,7 @@ export type McpBubbleVariant =
   | "hero-mobile-title"
   | "hero-mobile-description";
 
-export type McpPromptBubbleVariant =
-  | "mobile"
-  | "mobile-tall"
-  | "wide"
-  | "compact";
+export type McpPromptBubbleVariant = "mobile" | "mobile-tall" | "wide" | "compact";
 
 type BubbleConfig = {
   shell: string;
@@ -50,9 +50,7 @@ const promptTextClass =
 
 function BubbleTail({ side }: { side: "left" | "right" }) {
   const positionClass =
-    side === "left"
-      ? "bottom-[-2px] left-[-10.5px]"
-      : "bottom-[-2px] right-[-10.5px] scale-x-[-1]";
+    side === "left" ? "bottom-[-2px] left-[-10.5px]" : "bottom-[-2px] right-[-10.5px] scale-x-[-1]";
   const clipPathId = useId();
 
   return (
@@ -92,14 +90,34 @@ export function McpPromptBubble({
   variant: McpPromptBubbleVariant;
   children: ReactNode;
 }) {
+  const [copied, setCopied] = useState(false);
+
+  const handleCopy = () => {
+    if (typeof children === "string") {
+      navigator.clipboard.writeText(children);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 1500);
+    }
+  };
+
   return (
     <div className="relative w-full">
-      <div
-        className={`relative z-10 flex w-full items-center rounded-[12px] border bg-background-ppg text-background-ppg-reverse-strong transition-colors duration-300 ${promptConfig[variant]} [--mcp-bubble-fill:var(--color-background-ppg)] dark:[--mcp-bubble-fill:var(--color-background-ppg)] [--mcp-bubble-stroke:var(--color-stroke-ppg)] bg-(--mcp-bubble-fill) border-(--mcp-bubble-stroke)`}
-      >
-        <code className={promptTextClass}>{children}</code>
-        <BubbleTail side="right" />
-      </div>
+      <TooltipProvider>
+        <Tooltip open={copied || undefined}>
+          <TooltipTrigger asChild>
+            <button
+              type="button"
+              onClick={handleCopy}
+              aria-label={copied ? "Copied!" : "Copy prompt"}
+              className={`relative z-10 flex w-full cursor-pointer items-center rounded-[12px] border bg-background-ppg text-background-ppg-reverse-strong transition-colors duration-300 ${promptConfig[variant]} [--mcp-bubble-fill:var(--color-background-ppg)] dark:[--mcp-bubble-fill:var(--color-background-ppg)] [--mcp-bubble-stroke:var(--color-stroke-ppg)] bg-(--mcp-bubble-fill) border-(--mcp-bubble-stroke) hover:brightness-110`}
+            >
+              <code className={promptTextClass}>{children}</code>
+              <BubbleTail side="right" />
+            </button>
+          </TooltipTrigger>
+          <TooltipContent>{copied ? "Copied!" : "Copy prompt"}</TooltipContent>
+        </Tooltip>
+      </TooltipProvider>
     </div>
   );
 }
diff --git a/apps/site/src/app/mcp/_components/mcp-cta-section.tsx b/apps/site/src/app/mcp/_components/mcp-cta-section.tsx
index d08379e75c..0d549037eb 100644
--- a/apps/site/src/app/mcp/_components/mcp-cta-section.tsx
+++ b/apps/site/src/app/mcp/_components/mcp-cta-section.tsx
@@ -1,6 +1,12 @@
 import { Button } from "@prisma/eclipse";
 
-export function McpCtaSection({ docsHref }: { docsHref: string }) {
+export function McpCtaSection({
+  docsHref,
+  readDocsHref,
+}: {
+  docsHref: string;
+  readDocsHref: string;
+}) {
   return (
     <section className="bg-radial from-background-ppg/50 from-0% to-background-default to-70% px-4 py-12">
       <div className="mx-auto max-w-360 rounded-2xl bg-[url('/illustrations/homepage/footer_grid.svg')] bg-cover bg-center px-4 py-12">
@@ -11,36 +17,25 @@ export function McpCtaSection({ docsHref }: { docsHref: string }) {
                 Start Building with AI
               </h3>
               <p className="max-w-[463px] text-base leading-6 text-foreground-neutral-weak">
-                Join thousands of developers, and agents, already using Prisma MCP
-                for faster, more intuitive database workflows.
+                Join thousands of developers, and agents, already using Prisma MCP for faster, more
+                intuitive database workflows.
               </p>
             </div>
 
             <div className="flex flex-col items-center gap-4">
               <div className="flex w-full flex-col items-center justify-center gap-4 min-[720px]:flex-row min-[720px]:gap-6">
-                <Button
-                  href={docsHref}
-                  variant={"ppg"}
-                  size={"3xl"}
-                  className="gap-3"
-                >
+                <Button href={docsHref} variant={"ppg"} size={"3xl"} className="gap-3">
                   Add MCP Server
-                  <i
-                    className="fa-regular fa-arrow-right shrink-0 text-[16px]"
-                    aria-hidden
-                  />
+                  <i className="fa-regular fa-arrow-right shrink-0 text-[16px]" aria-hidden />
                 </Button>
                 <Button
-                  href={docsHref}
+                  href={readDocsHref}
                   variant={"default-stronger"}
                   size={"3xl"}
                   className="gap-3"
                 >
                   Read Docs
-                  <i
-                    className="fa-regular fa-book-open shrink-0 text-[16px]"
-                    aria-hidden
-                  />
+                  <i className="fa-regular fa-book-open shrink-0 text-[16px]" aria-hidden />
                 </Button>
               </div>
 
diff --git a/apps/site/src/app/mcp/page.tsx b/apps/site/src/app/mcp/page.tsx
index 2a4c7bfe3a..cd163b493d 100644
--- a/apps/site/src/app/mcp/page.tsx
+++ b/apps/site/src/app/mcp/page.tsx
@@ -1,18 +1,9 @@
 import type { Metadata } from "next";
 
-import {
-  type McpAgent,
-  McpAgentsSection,
-} from "./_components/mcp-agents-section";
-import {
-  type McpCapability,
-  McpCapabilitiesSection,
-} from "./_components/mcp-capabilities-section";
+import { type McpAgent, McpAgentsSection } from "./_components/mcp-agents-section";
+import { type McpCapability, McpCapabilitiesSection } from "./_components/mcp-capabilities-section";
 import { McpCtaSection } from "./_components/mcp-cta-section";
-import {
-  type McpHeroFeature,
-  McpHeroSection,
-} from "./_components/mcp-hero-section";
+import { type McpHeroFeature, McpHeroSection } from "./_components/mcp-hero-section";
 import { McpVideoSection } from "./_components/mcp-video-section";
 
 export const metadata: Metadata = {
@@ -82,19 +73,31 @@ const agents: McpAgent[] = [
     logo: "/mcp/logos/cursor.svg",
     alt: "Add to Cursor",
     icon: "fa-regular fa-copy",
-    href: DOCS_MCP,
+    href: "cursor://anysphere.cursor-deeplink/mcp/install?name=Prisma-Remote&config=eyJjb21tYW5kIjoibnB4IC15IG1jcC1yZW1vdGUgaHR0cHM6Ly9tY3AucHJpc21hLmlvL21jcCJ9",
   },
   {
     logo: "/mcp/logos/vscode.svg",
     alt: "Install in VS Code",
     icon: "fa-regular fa-copy",
-    href: DOCS_MCP,
+    href: "vscode:mcp/install?%7B%22name%22%3A%22prisma-postgres%22%2C%22gallery%22%3Atrue%2C%22url%22%3A%22https%3A%2F%2Fmcp.prisma.io%2Fmcp%22%7D",
   },
   {
     logo: "/mcp/logos/warp.svg",
     alt: "Copy JSON configuration",
     icon: "fa-regular fa-copy",
-    href: DOCS_MCP,
+    copyText: JSON.stringify(
+      {
+        "Prisma-Postgres": {
+          command: "npx",
+          args: ["-y", "mcp-remote", "https://mcp.prisma.io/mcp"],
+          env: {},
+          working_directory: null,
+          start_on_launch: true,
+        },
+      },
+      null,
+      2,
+    ),
   },
   {
     logo: "/mcp/logos/chatgpt.svg",
@@ -106,7 +109,7 @@ const agents: McpAgent[] = [
     logo: "/mcp/logos/claude-code.svg",
     alt: "Copy command to add to Claude Code",
     icon: "fa-regular fa-copy",
-    href: DOCS_MCP,
+    copyText: "claude mcp add --transport http prisma https://mcp.prisma.io/mcp",
   },
   {
     logo: "/mcp/logos/windsurf.svg",
@@ -118,7 +121,8 @@ const agents: McpAgent[] = [
     logo: "/mcp/logos/gemini.svg",
     alt: "Copy command to add to Gemini CLI",
     icon: "fa-regular fa-copy",
-    href: DOCS_MCP,
+    copyText:
+      "gemini mcp add Prisma-Remote npx --args -y mcp-remote https://mcp.prisma.io/mcp --scope user",
   },
   {
     logo: null,
@@ -132,8 +136,7 @@ const capabilities: McpCapability[] = [
   {
     icon: "fa-light fa-database",
     title: "Database Management",
-    description:
-      "Create projects, databases, or clean them up via natural language",
+    description: "Create projects, databases, or clean them up via natural language",
     prompt: "Set up this project with a new database in us-east-1",
     mobileTall: false,
   },
@@ -141,8 +144,7 @@ const capabilities: McpCapability[] = [
     icon: "fa-light fa-magnifying-glass-arrow-right",
     title: "Data Analysis",
     description: "Execute queries and analyze data through conversation",
-    prompt:
-      "Show me all users who signed up this week and their activity levels",
+    prompt: "Show me all users who signed up this week and their activity levels",
     mobileTall: true,
   },
   {
@@ -155,17 +157,14 @@ const capabilities: McpCapability[] = [
   {
     icon: "fa-light fa-folder-gear",
     title: "Database Administration",
-    description:
-      "Handle backups, connection strings, and multi-database workflows",
-    prompt:
-      "Create a new database from the most recent backup to my product db",
+    description: "Handle backups, connection strings, and multi-database workflows",
+    prompt: "Create a new database from the most recent backup to my product db",
     mobileTall: false,
   },
   {
     icon: "fa-light fa-arrow-progress",
     title: "Development Workflow",
-    description:
-      "Integrate database operations seamlessly into coding workflow",
+    description: "Integrate database operations seamlessly into coding workflow",
     prompt: "Open Prisma Studio and show me the data in my users table",
     mobileTall: false,
   },
@@ -179,7 +178,7 @@ export default function McpPage() {
         <McpVideoSection />
         <McpAgentsSection docsHref={DOCS_MCP} agents={agents} />
         <McpCapabilitiesSection capabilities={capabilities} />
-        <McpCtaSection docsHref={DOCS_MCP} />
+        <McpCtaSection docsHref={DOCS_MCP} readDocsHref="/docs/ai" />
       </div>
     </main>
   );

From 34824d22bedfddac33d30a23ac5f2e551d9bbf08 Mon Sep 17 00:00:00 2001
From: Aman Varshney <amanvarshney.work@gmail.com>
Date: Thu, 2 Apr 2026 20:59:02 +0530
Subject: [PATCH 2/4] fix(site): enlarge tally dialog and fix prompt bubble
 text alignment

---
 .../mcp/_components/mcp-agents-section.tsx    |  4 ++--
 .../src/app/mcp/_components/mcp-bubble.tsx    | 19 +++++++++++++++----
 2 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/apps/site/src/app/mcp/_components/mcp-agents-section.tsx b/apps/site/src/app/mcp/_components/mcp-agents-section.tsx
index 6c839a6992..1472fe030a 100644
--- a/apps/site/src/app/mcp/_components/mcp-agents-section.tsx
+++ b/apps/site/src/app/mcp/_components/mcp-agents-section.tsx
@@ -52,7 +52,7 @@ export function McpAgentsSection({ agents }: { docsHref: string; agents: readonl
               Want to see your tool listed?
             </button>
           </DialogTrigger>
-          <DialogContent className="max-w-lg">
+          <DialogContent className="max-w-4xl">
             <DialogHeader>
               <DialogTitle>Want to see your favorite AI tool listed on prisma.io/mcp?</DialogTitle>
             </DialogHeader>
@@ -60,7 +60,7 @@ export function McpAgentsSection({ agents }: { docsHref: string; agents: readonl
               data-tally-src="https://tally.so/r/wA1R1N"
               title="Tool listing request"
               width="100%"
-              height="400"
+              height="600"
               className="border-0"
             />
             <Script
diff --git a/apps/site/src/app/mcp/_components/mcp-bubble.tsx b/apps/site/src/app/mcp/_components/mcp-bubble.tsx
index 564c123c54..2958a2b1b2 100644
--- a/apps/site/src/app/mcp/_components/mcp-bubble.tsx
+++ b/apps/site/src/app/mcp/_components/mcp-bubble.tsx
@@ -2,7 +2,12 @@
 
 import { useId, useState, type ReactNode } from "react";
 
-import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@prisma/eclipse";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from "@prisma/eclipse";
 
 const bubbleShadow = "shadow-box-low dark:shadow-box-high";
 
@@ -12,7 +17,11 @@ export type McpBubbleVariant =
   | "hero-mobile-title"
   | "hero-mobile-description";
 
-export type McpPromptBubbleVariant = "mobile" | "mobile-tall" | "wide" | "compact";
+export type McpPromptBubbleVariant =
+  | "mobile"
+  | "mobile-tall"
+  | "wide"
+  | "compact";
 
 type BubbleConfig = {
   shell: string;
@@ -46,11 +55,13 @@ const promptConfig: Record<McpPromptBubbleVariant, string> = {
 };
 
 const promptTextClass =
-  "inline-block w-full break-words text-pretty font-mono text-[14px] font-normal leading-5 text-background-ppg-reverse-strong dark:text-foreground-ppg-reverse-weak";
+  "inline-block w-full break-words text-pretty text-left font-mono text-[14px] font-normal leading-5 text-background-ppg-reverse-strong dark:text-foreground-ppg-reverse-weak";
 
 function BubbleTail({ side }: { side: "left" | "right" }) {
   const positionClass =
-    side === "left" ? "bottom-[-2px] left-[-10.5px]" : "bottom-[-2px] right-[-10.5px] scale-x-[-1]";
+    side === "left"
+      ? "bottom-[-2px] left-[-10.5px]"
+      : "bottom-[-2px] right-[-10.5px] scale-x-[-1]";
   const clipPathId = useId();
 
   return (

From b0958e13b6facaa1a359fe7cf228069ef37d38b8 Mon Sep 17 00:00:00 2001
From: Aman Varshney <amanvarshney.work@gmail.com>
Date: Thu, 2 Apr 2026 21:02:13 +0530
Subject: [PATCH 3/4] fix(site): make Cursor and VS Code cards copy to
 clipboard instead of navigating

---
 apps/site/src/app/mcp/page.tsx | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/apps/site/src/app/mcp/page.tsx b/apps/site/src/app/mcp/page.tsx
index cd163b493d..b9f3d457fa 100644
--- a/apps/site/src/app/mcp/page.tsx
+++ b/apps/site/src/app/mcp/page.tsx
@@ -73,13 +73,15 @@ const agents: McpAgent[] = [
     logo: "/mcp/logos/cursor.svg",
     alt: "Add to Cursor",
     icon: "fa-regular fa-copy",
-    href: "cursor://anysphere.cursor-deeplink/mcp/install?name=Prisma-Remote&config=eyJjb21tYW5kIjoibnB4IC15IG1jcC1yZW1vdGUgaHR0cHM6Ly9tY3AucHJpc21hLmlvL21jcCJ9",
+    copyText:
+      "cursor://anysphere.cursor-deeplink/mcp/install?name=Prisma-Remote&config=eyJjb21tYW5kIjoibnB4IC15IG1jcC1yZW1vdGUgaHR0cHM6Ly9tY3AucHJpc21hLmlvL21jcCJ9",
   },
   {
     logo: "/mcp/logos/vscode.svg",
     alt: "Install in VS Code",
     icon: "fa-regular fa-copy",
-    href: "vscode:mcp/install?%7B%22name%22%3A%22prisma-postgres%22%2C%22gallery%22%3Atrue%2C%22url%22%3A%22https%3A%2F%2Fmcp.prisma.io%2Fmcp%22%7D",
+    copyText:
+      "vscode:mcp/install?%7B%22name%22%3A%22prisma-postgres%22%2C%22gallery%22%3Atrue%2C%22url%22%3A%22https%3A%2F%2Fmcp.prisma.io%2Fmcp%22%7D",
   },
   {
     logo: "/mcp/logos/warp.svg",

From 3f1515b5b2a31ba5dda9cf350826e9f43ec7c8a3 Mon Sep 17 00:00:00 2001
From: Aman Varshney <amanvarshney.work@gmail.com>
Date: Thu, 2 Apr 2026 21:05:06 +0530
Subject: [PATCH 4/4] fix(site): use absolute URL for Read Docs CTA

---
 apps/site/src/app/mcp/page.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/site/src/app/mcp/page.tsx b/apps/site/src/app/mcp/page.tsx
index b9f3d457fa..8a759b7b33 100644
--- a/apps/site/src/app/mcp/page.tsx
+++ b/apps/site/src/app/mcp/page.tsx
@@ -180,7 +180,7 @@ export default function McpPage() {
         <McpVideoSection />
         <McpAgentsSection docsHref={DOCS_MCP} agents={agents} />
         <McpCapabilitiesSection capabilities={capabilities} />
-        <McpCtaSection docsHref={DOCS_MCP} readDocsHref="/docs/ai" />
+        <McpCtaSection docsHref={DOCS_MCP} readDocsHref="https://www.prisma.io/docs/ai" />
       </div>
     </main>
   );