DX-3239: restore the Agent Setup hero and product card without npx upstash

docs.json

@@ -2616,7 +2616,7 @@
     {
       "title": "Copy prompt",
       "description": "Paste it into Claude Code, Cursor or any agent.",
-      "copy": "Set up Upstash in my coding agent using the official Upstash instructions, and run the commands yourself instead of asking me to. Run `npx -y upstash setup --yes` with the flag for the agent you are (`--claude`, `--codex`, `--cursor`, `--gemini`, `--vscode`, `--copilot` or `--opencode`). It installs the Upstash plugin where your agent supports plugins, and otherwise adds the remote MCP server https://mcp.upstash.com/mcp plus the Upstash skills (https://upstash.com/docs/agent-resources/skills); the MCP server authenticates over OAuth on first use. If you are not one of those agents, install the skills with `npx -y skills add upstash/skills --global` and add the remote MCP server to your MCP config; see https://upstash.com/docs/agent-resources/clients for the exact location. When done, tell me what was installed and whether I need to restart or reload (in Claude Code, `/reload-plugins`)."
+      "copy": "Set up Upstash in my coding agent using the official Upstash instructions, and run the commands yourself instead of asking me to.\n\n1. Run `npx -y upstash setup --yes` with the flag for the agent you are (`--claude`, `--codex`, `--cursor`, `--gemini`, `--vscode`, `--copilot` or `--opencode`). It installs the Upstash plugin where your agent supports plugins, and otherwise adds the remote MCP server https://mcp.upstash.com/mcp (OAuth on first use) and the Upstash skills.\n2. For any other agent, install the skills with `npx -y skills add upstash/skills --global` and add https://mcp.upstash.com/mcp to your MCP config (see https://upstash.com/docs/agent-resources/clients).\n3. Tell me what was installed and whether I need to restart or reload (in Claude Code, `/reload-plugins`).\n\nThe skills cover:\n\n- SDKs for Redis, Ratelimit, QStash, Workflow, Vector, Search, Blob and Box\n- The `upstash` CLI\n- Running work in Box cloud sandboxes\n\nIf I need a Redis database before I have an account, POST https://upstash.com/start-redis for a free one with no signup (it lasts 3 days unless I claim it).\n\nFor anything else, read the docs at https://upstash.com/docs/introduction (every page is listed in https://upstash.com/docs/llms.txt)."
     },
     {
       "title": "Copy remote MCP URL",

introduction.mdx

@@ -8,21 +8,26 @@ import { Hero, PromptToolIcons, SectionHead, ProductGrid, UtilityGrid, Community
 
 <div className="u-wrap">
   <Hero>
-    <div className="u-command">
-      <span className="u-command__text"><span className="u-command__dollar">$</span> npx upstash</span>
-      <div className="u-command__copy">
-
-```bash
-npx upstash
-```
-
-      </div>
-      <a className="u-command__link" href="/agent-resources/overview">Agent Setup</a>
-    </div>
     <div className="u-prompt-action">
       <PromptToolIcons />
       <Prompt actions={["copy"]}>
-        Set up Upstash in my coding agent using the official Upstash instructions, and run the commands yourself instead of asking me to. Run `npx -y upstash setup --yes` with the flag for the agent you are (`--claude`, `--codex`, `--cursor`, `--gemini`, `--vscode`, `--copilot` or `--opencode`). It installs the Upstash plugin where your agent supports plugins, and otherwise adds the remote MCP server https://mcp.upstash.com/mcp plus the Upstash skills (https://upstash.com/docs/agent-resources/skills); the MCP server authenticates over OAuth on first use. If you are not one of those agents, install the skills with `npx -y skills add upstash/skills --global` and add the remote MCP server to your MCP config; see https://upstash.com/docs/agent-resources/clients for the exact location. When done, tell me what was installed and whether I need to restart or reload (in Claude Code, `/reload-plugins`).
+
+Set up Upstash in my coding agent using the official Upstash instructions, and run the commands yourself instead of asking me to.
+
+1. Run `npx -y upstash setup --yes` with the flag for the agent you are (`--claude`, `--codex`, `--cursor`, `--gemini`, `--vscode`, `--copilot` or `--opencode`). It installs the Upstash plugin where your agent supports plugins, and otherwise adds the remote MCP server https://mcp.upstash.com/mcp (OAuth on first use) and the Upstash skills.
+2. For any other agent, install the skills with `npx -y skills add upstash/skills --global` and add https://mcp.upstash.com/mcp to your MCP config (see https://upstash.com/docs/agent-resources/clients).
+3. Tell me what was installed and whether I need to restart or reload (in Claude Code, `/reload-plugins`).
+
+The skills cover:
+
+- SDKs for Redis, Ratelimit, QStash, Workflow, Vector, Search, Blob and Box
+- The `upstash` CLI
+- Running work in Box cloud sandboxes
+
+If I need a Redis database before I have an account, POST https://upstash.com/start-redis for a free one with no signup (it lasts 3 days unless I claim it).
+
+For anything else, read the docs at https://upstash.com/docs/introduction (every page is listed in https://upstash.com/docs/llms.txt).
+
       </Prompt>
     </div>
   </Hero>

llms-full.txt

@@ -22110,21 +22110,26 @@ import { Hero, PromptToolIcons, SectionHead, ProductGrid, UtilityGrid, Community
 
 <div className="u-wrap">
   <Hero>
-    <div className="u-command">
-      <span className="u-command__text"><span className="u-command__dollar">$</span> npx upstash</span>
-      <div className="u-command__copy">
-
-```bash
-npx upstash
-```
-
-      </div>
-      <a className="u-command__link" href="/agent-resources/overview">Agent Setup</a>
-    </div>
     <div className="u-prompt-action">
       <PromptToolIcons />
       <Prompt actions={["copy"]}>
-        Set up Upstash in my coding agent using the official Upstash instructions, and run the commands yourself instead of asking me to. Run `npx -y upstash setup --yes` with the flag for the agent you are (`--claude`, `--codex`, `--cursor`, `--gemini`, `--vscode`, `--copilot` or `--opencode`). It installs the Upstash plugin where your agent supports plugins, and otherwise adds the remote MCP server https://mcp.upstash.com/mcp plus the Upstash skills (https://upstash.com/docs/agent-resources/skills); the MCP server authenticates over OAuth on first use. If you are not one of those agents, install the skills with `npx -y skills add upstash/skills --global` and add the remote MCP server to your MCP config; see https://upstash.com/docs/agent-resources/clients for the exact location. When done, tell me what was installed and whether I need to restart or reload (in Claude Code, `/reload-plugins`).
+
+Set up Upstash in my coding agent using the official Upstash instructions, and run the commands yourself instead of asking me to.
+
+1. Run `npx -y upstash setup --yes` with the flag for the agent you are (`--claude`, `--codex`, `--cursor`, `--gemini`, `--vscode`, `--copilot` or `--opencode`). It installs the Upstash plugin where your agent supports plugins, and otherwise adds the remote MCP server https://mcp.upstash.com/mcp (OAuth on first use) and the Upstash skills.
+2. For any other agent, install the skills with `npx -y skills add upstash/skills --global` and add https://mcp.upstash.com/mcp to your MCP config (see https://upstash.com/docs/agent-resources/clients).
+3. Tell me what was installed and whether I need to restart or reload (in Claude Code, `/reload-plugins`).
+
+The skills cover:
+
+* SDKs for Redis, Ratelimit, QStash, Workflow, Vector, Search, Blob and Box
+* The `upstash` CLI
+* Running work in Box cloud sandboxes
+
+If I need a Redis database before I have an account, POST https://upstash.com/start-redis for a free one with no signup (it lasts 3 days unless I claim it).
+
+For anything else, read the docs at https://upstash.com/docs/introduction (every page is listed in https://upstash.com/docs/llms.txt).
+
       </Prompt>
     </div>
   </Hero>

snippets/agent-setup.jsx

@@ -1,26 +1,28 @@
-// "Building with an AI coding agent?" card for product landing pages: `npx upstash`
-// installs the Upstash MCP server and skills, with links to both pages.
-// Usage: <AgentSetup product="Redis" /> (`product` is accepted for existing pages; the command covers every product).
+// "Set up your coding agent" card for product landing pages. Links to /agent-resources/overview.
+// Usage: <AgentSetup product="Redis" />
 // Everything lives inside the exported component: Mintlify does not expose non-exported top-level consts to snippet components.
 
-export const AgentSetup = () => (
-  <div className="u-card u-card--static u-agent-setup">
-    <div className="u-card__icon u-card__icon--muted">
-      <svg aria-hidden="true" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
-        <path d="M12 8V4H8" />
-        <rect width="16" height="12" x="4" y="8" rx="2" />
-        <path d="M2 14h2" />
-        <path d="M20 14h2" />
-        <path d="M15 13v2" />
-        <path d="M9 13v2" />
-      </svg>
-    </div>
-    <div className="u-card__body">
-      <div className="u-card__title">Building with an AI coding agent?</div>
-      <div className="u-card__desc">
-        Run <code>npx upstash</code> to install the Upstash <a href="/agent-resources/mcp">MCP server</a> and{" "}
-        <a href="/agent-resources/skills">skills</a> in Claude Code, Cursor, Codex, and other agents.
+export const AgentSetup = ({ product }) => {
+  const desc = product
+    ? `Connect the Upstash MCP server and the ${product} skill to Claude Code, Cursor, Codex, and other agents.`
+    : "Connect the Upstash MCP server and skills to Claude Code, Cursor, Codex, and other agents.";
+
+  return (
+    <a className="u-card u-agent-setup" href="/agent-resources/overview">
+      <div className="u-card__icon u-card__icon--muted">
+        <svg aria-hidden="true" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+          <path d="M12 8V4H8" />
+          <rect width="16" height="12" x="4" y="8" rx="2" />
+          <path d="M2 14h2" />
+          <path d="M20 14h2" />
+          <path d="M15 13v2" />
+          <path d="M9 13v2" />
+        </svg>
+      </div>
+      <div className="u-card__body">
+        <div className="u-card__title">Building with an AI coding agent?</div>
+        <div className="u-card__desc">{desc}</div>
       </div>
-    </div>
-  </div>
-);
+    </a>
+  );
+};

snippets/landing.jsx

@@ -1,18 +1,16 @@
-// Hero for the docs home. The actions passed as children are the `npx upstash`
-// command box (a real code block, so the renderer's own copy button handles the
-// click) and the setup prompt; the hint under them says what the command does.
 export const Hero = ({ children }) => (
   <div className="u-hero">
     <h1>Build with Upstash</h1>
     <p>
       Serverless data, messaging, and AI infrastructure for developers. Scale to
       zero, pay per request.
     </p>
-    <div className="u-actions">{children}</div>
-    <p className="u-hero__hint">
-      Run it in your terminal to add the Upstash MCP server and skills to Claude Code, Codex, Cursor, and
-      other agents.
-    </p>
+    <div className="u-actions">
+      <a className="u-action u-action--primary" href="/agent-resources/overview">
+        Agent Setup
+      </a>
+      {children}
+    </div>
   </div>
 );
 

style.css

@@ -171,88 +171,6 @@ html[data-current-path="/introduction"] #content-area {
 .dark .u-action--primary:hover {
   background: #e4e4e7;
 }
-/* `npx upstash` command box, after Context7's: "$ npx upstash  [copy] | Agent Setup".
-   The text is plain markup; the copy button is a real fenced code block with
-   everything but its copy chip hidden, so the renderer's own button (and its
-   copied state) does the copying. Docs7 renders .code-block > .code-surface >
-   .relative > (.code-chip + .code-scroll). */
-.u-command {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.75rem;
-  height: 2.625rem;
-  padding: 0 1.125rem 0 1.125rem;
-  border: 1px solid #e5e5e5;
-  border-radius: 2.5rem;
-  background: #fafafa;
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
-}
-.dark .u-command {
-  border-color: rgba(255, 255, 255, 0.16);
-  background: rgba(255, 255, 255, 0.06);
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
-}
-/* Only the code block's copy button shows; the command text above is ours. */
-.u-command__copy,
-.u-command__copy > * {
-  margin: 0 !important;
-}
-.u-command__copy .code-block,
-.u-command__copy .code-surface {
-  margin: 0 !important;
-  padding: 0 !important;
-  border: 0 !important;
-  background: transparent !important;
-  box-shadow: none !important;
-}
-.u-command__copy .code-scroll,
-.u-command__copy pre {
-  display: none !important;
-}
-.u-command__copy .code-chip {
-  position: static !important;
-  background: transparent !important;
-  backdrop-filter: none !important;
-}
-.u-command__text {
-  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
-  font-size: 0.9375rem;
-  color: #262626;
-  white-space: nowrap;
-}
-.dark .u-command__text {
-  color: #f4f4f5;
-}
-.u-command__dollar {
-  color: #10b981;
-}
-.u-command__link {
-  padding-left: 0.75rem;
-  border-left: 1px solid #e5e5e5;
-  font-size: 0.9375rem;
-  line-height: 1.25rem;
-  color: #262626 !important;
-  text-decoration: underline;
-  text-underline-offset: 0.3rem;
-  text-decoration-color: rgba(0, 0, 0, 0.3);
-  white-space: nowrap;
-}
-.u-command__link:hover {
-  text-decoration-color: currentColor;
-}
-.dark .u-command__link {
-  border-left-color: rgba(255, 255, 255, 0.16);
-  color: #f4f4f5 !important;
-  text-decoration-color: rgba(255, 255, 255, 0.4);
-}
-.u-hero p.u-hero__hint {
-  margin-top: 0.75rem;
-  font-size: 0.875rem;
-  color: #8a8a8a;
-}
-.dark .u-hero p.u-hero__hint {
-  color: #8b8b8b;
-}
 .u-prompt-action .prompt {
   position: absolute;
   inset: 0;