Skip to content

Commit 090adb8

Browse files
torresmateonearestnaborsvfanelle
authored
updated cursor MCP instructions (#598)
* updated cursor MCP instructions * Update app/en/home/mcp-clients/cursor/page.mdx Co-authored-by: RL "Nearest" Nabors <[email protected]> * Update app/en/home/mcp-clients/cursor/page.mdx Co-authored-by: vfanelle <[email protected]> * used the guide overview component for this guide * Balacing the prereqs and outcomes when they appear alone together --------- Co-authored-by: RL "Nearest" Nabors <[email protected]> Co-authored-by: vfanelle <[email protected]> Co-authored-by: Rachel Lee Nabors <[email protected]>
1 parent 91f17c7 commit 090adb8

File tree

2 files changed

+100
-43
lines changed

2 files changed

+100
-43
lines changed

‎app/_components/guide-overview.tsx‎

Lines changed: 87 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -34,37 +34,22 @@ export function GuideOverview({ children, className }: GuideOverviewProps) {
3434
className
3535
)}
3636
>
37-
{/* Outcomes section (full width) */}
38-
{outcomes && (
39-
<div className="mb-6">
40-
<h2 className="mb-3 font-semibold text-card-foreground text-xl">
41-
Outcomes
42-
</h2>
43-
<div className="text-muted-foreground">
44-
{React.isValidElement(outcomes) &&
45-
(outcomes.props as { children: React.ReactNode }).children}
46-
</div>
47-
</div>
48-
)}
49-
50-
{/* Two column layout - You will Learn (2/3) and Prerequisites (1/3) */}
51-
<div className="grid gap-6 md:grid-cols-3">
52-
{/* You will Learn column - takes 2/3 of width */}
53-
{youWillLearn && (
54-
<div className="md:col-span-2">
55-
<h3 className="mb-3 font-medium text-card-foreground text-lg">
56-
You will Learn
57-
</h3>
58-
<div className="space-y-2 text-muted-foreground text-sm">
59-
{React.isValidElement(youWillLearn) &&
60-
(youWillLearn.props as { children: React.ReactNode }).children}
37+
{/* When only Outcomes and Prerequisites exist, show them side by side */}
38+
{outcomes && prerequisites && !youWillLearn && (
39+
<div className="grid gap-6 md:grid-cols-2">
40+
{/* Outcomes column */}
41+
<div>
42+
<h2 className="mb-3 font-semibold text-card-foreground text-xl">
43+
Outcomes
44+
</h2>
45+
<div className="text-muted-foreground">
46+
{React.isValidElement(outcomes) &&
47+
(outcomes.props as { children: React.ReactNode }).children}
6148
</div>
6249
</div>
63-
)}
6450

65-
{/* Prerequisites column - takes 1/3 of width */}
66-
{prerequisites && (
67-
<div className="md:col-span-1">
51+
{/* Prerequisites column */}
52+
<div>
6853
<h3 className="mb-3 font-medium text-card-foreground text-lg">
6954
Prerequisites
7055
</h3>
@@ -73,8 +58,80 @@ export function GuideOverview({ children, className }: GuideOverviewProps) {
7358
(prerequisites.props as { children: React.ReactNode }).children}
7459
</div>
7560
</div>
76-
)}
77-
</div>
61+
</div>
62+
)}
63+
64+
{/* When YouWillLearn exists, use the original layout */}
65+
{youWillLearn && (
66+
<>
67+
{/* Outcomes section (full width) */}
68+
{outcomes && (
69+
<div className="mb-6">
70+
<h2 className="mb-3 font-semibold text-card-foreground text-xl">
71+
Outcomes
72+
</h2>
73+
<div className="text-muted-foreground">
74+
{React.isValidElement(outcomes) &&
75+
(outcomes.props as { children: React.ReactNode }).children}
76+
</div>
77+
</div>
78+
)}
79+
80+
{/* Two column layout - You will Learn (2/3) and Prerequisites (1/3) */}
81+
<div className="grid gap-6 md:grid-cols-3">
82+
{/* You will Learn column - takes 2/3 of width */}
83+
<div className="md:col-span-2">
84+
<h3 className="mb-3 font-medium text-card-foreground text-lg">
85+
You will Learn
86+
</h3>
87+
<div className="space-y-2 text-muted-foreground text-sm">
88+
{React.isValidElement(youWillLearn) &&
89+
(youWillLearn.props as { children: React.ReactNode })
90+
.children}
91+
</div>
92+
</div>
93+
94+
{/* Prerequisites column - takes 1/3 of width */}
95+
{prerequisites && (
96+
<div className="md:col-span-1">
97+
<h3 className="mb-3 font-medium text-card-foreground text-lg">
98+
Prerequisites
99+
</h3>
100+
<div className="space-y-2 text-muted-foreground text-sm">
101+
{React.isValidElement(prerequisites) &&
102+
(prerequisites.props as { children: React.ReactNode })
103+
.children}
104+
</div>
105+
</div>
106+
)}
107+
</div>
108+
</>
109+
)}
110+
111+
{/* Fallback for edge cases - only outcomes, only prerequisites, etc. */}
112+
{outcomes && !prerequisites && !youWillLearn && (
113+
<div>
114+
<h2 className="mb-3 font-semibold text-card-foreground text-xl">
115+
Outcomes
116+
</h2>
117+
<div className="text-muted-foreground">
118+
{React.isValidElement(outcomes) &&
119+
(outcomes.props as { children: React.ReactNode }).children}
120+
</div>
121+
</div>
122+
)}
123+
124+
{!outcomes && prerequisites && !youWillLearn && (
125+
<div>
126+
<h3 className="mb-3 font-medium text-card-foreground text-lg">
127+
Prerequisites
128+
</h3>
129+
<div className="space-y-2 text-muted-foreground text-sm">
130+
{React.isValidElement(prerequisites) &&
131+
(prerequisites.props as { children: React.ReactNode }).children}
132+
</div>
133+
</div>
134+
)}
78135
</div>
79136
);
80137
}

‎app/en/home/mcp-clients/cursor/page.mdx‎

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,31 @@
11
import { Steps, Callout } from "nextra/components";
22
import { SignupLink } from "@/app/_components/analytics";
33

4-
54
# Use Arcade in Cursor
65

7-
In this guide, you'll learn how to connect Cursor to an Arcade MCP Gateway.
6+
<GuideOverview>
7+
<GuideOverview.Outcomes>
8+
9+
Connect Cursor to an Arcade MCP Gateway.
810

9-
<Steps>
11+
</GuideOverview.Outcomes>
1012

11-
### Prerequisites
13+
<GuideOverview.Prerequisites>
1214

1315
1. Create an <SignupLink linkLocation="docs:claude-desktop-client">Arcade account</SignupLink>
1416
2. Get an [Arcade API key](/home/api-keys)
1517
3. Create an [Arcade MCP Gateway](/home/mcp-gateways) and select the tools you want to use
1618

19+
</GuideOverview.Prerequisites>
20+
21+
</GuideOverview>
22+
1723
### Set up Cursor
1824

19-
3. Download and open [Cursor](https://cursor.com/download)
20-
4. Open the command palette and select **Open MCP Settings...**
21-
5. Choose **HTTP**
22-
6. Paste the URL of your MCP Gateway
23-
7. Give your MCP server a name, like `mcp-arcade`
24-
8. Add the API key as the bearer token within the `Authorization` header, and the email address that you used to sign up for the Arcade account as the `Arcade-User-ID` header
25+
1. Open the Command Palette (`Cmd + Shift + P` on macOS, `Ctrl + Shift + P` on Windows/Linux) and select **Open MCP Settings**
26+
1. Click on the "New MCP Server" button
2527

26-
Cursor will update your `settings.json` file with the following
28+
Cursor will open the MCP settings file, and you can add a new entry to the `mcpServers` object:
2729

2830
```json
2931
{
@@ -44,5 +46,3 @@ Cursor will update your `settings.json` file with the following
4446
1. Open the chat pane (typically command-l)
4547
1. Make sure you are in **Agent** mode
4648
1. Ask the agent to use a tool!
47-
48-
</Steps>

0 commit comments

Comments
 (0)