Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

🎃 Add a "Share / README badge" section with Add-to-Cursor and Add-to-VS-Code badges

Aperta
#864 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
3/5
Tempo stimato
1-2 giorni
Idoneità per principianti
58/100
Tipo di issue
Funzionalità
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
playwright, typescript

Direzione di ricerca

Start with packages/frontend/src/app/mcp-server/[id]/page.tsx and packages/frontend/src/lib/api.ts to trace the existing install links, server info, and client card; then read the frontend Playwright e2e example named in the issue. Build the helper and share card, covering the auth modes and localhost note, and update the two integration docs. Done means the e2e assertions, lint, and TypeScript check pass, with generated snippets containing no secrets.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

enhancement hacktoberfest help wanted

Part of the October Challenge #846.

Why

Teams that build an MCP server in AnythingMCP want to hand it to colleagues the way public MCP servers do: a badge in an internal README or wiki page that installs the server in one click. The MCP server page already builds Cursor and VS Code deeplinks, but only as buttons inside a modal, and with cursor:// and vscode: URLs. GitHub, GitLab and most wikis strip those schemes from Markdown links, so the button cannot be copied into a README. Smithery, Glama and the official GitHub MCP server README all ship copyable badges for this.

Self-hosted vs Cloud

  • Self-hosted: enabled in Community and Business. The endpoint is ${origin}/mcp/<serverId>. If the page runs on localhost (see apiUrl, page.tsx:98), show a note that the badge only works on this machine and set SERVER_URL/a public hostname first.
  • Cloud (DEPLOYMENT_MODE=cloud): enabled. Cloud runs with MCP_AUTH_MODE=oauth2 (docker-compose.cloud.yml:111), so whoever clicks the badge still has to sign in with an account in that organization. The badge reveals the server URL (and id), never data or credentials.
  • Who can use it: any member who can open the server page, VIEWER included. It is read-only and generated in the browser; no new endpoint. Nothing leaves the caller's organization because the snippet only contains this server's URL and slug.

What to build

  1. Move link building into a pure helper packages/frontend/src/lib/mcp-install-links.ts:
    • cursorInstallUrl({ name, url }) → https://cursor.com/en/install-mcp?name=<enc name>&config=<base64 of {"url": url}>. This https redirector opens the same cursor://anysphere.cursor-deeplink/mcp/install… deeplink and survives Markdown sanitizers.
    • vscodeInstallUrl({ name, url }) → https://vscode.dev/redirect/mcp/install?name=<enc>&config=<enc JSON {"type":"http","url":url}>. Add an insiders variant with https://insiders.vscode.dev/redirect/mcp/install….
    • badgeSnippets(...) → { markdown, html } for each client. Images: Cursor's official https://cursor.com/deeplink/mcp-install-dark.svg / -light.svg; VS Code via shields.io, e.g. https://img.shields.io/badge/VS_Code-Install_Server-0098FF?logo=visualstudiocode&logoColor=white.
    • Replace the inline cursorDeepLink / vscodeDeepLink (page.tsx:356-364) with the helper. The modal buttons may keep the native scheme.
  2. A new card "Share / README badge" on packages/frontend/src/app/mcp-server/[id]/page.tsx, below "Connect your MCP client" (:645): a badge preview, a Dark/Light toggle for the Cursor image, tabs Markdown | HTML, and a Copy button (reuse handleCopy and the codeBlock helper at :378). Show exposesLine() (:398) so people can see which connectors the badge hands out.
  3. Auth notes. Read mcpAuthMode from the public server.info() (src/lib/api.ts:964, served by health.controller.ts:30):
    • oauth2 / both: the URL alone is enough; say "people who click will sign in".
    • legacy (the default for self-hosted, docker-compose.yml:67): the badge installs the URL only; say each user must add their own X-API-Key header, and link to the API key card.
    • none: show a warning that anyone who can reach the URL can call these tools, and do not show the snippet until the user ticks "I understand".
  4. Never put a secret in a link or badge: no API key, no X-API-Key header, no token of any kind. The helper only takes name and url. A unit-level assertion and an e2e assertion both check this.
  5. Docs: a "Share with a badge" subsection under ## Cursor in docs/integrations/claude.md:119 and under ## VS Code Setup in docs/integrations/copilot.md:15.

Where to look

  • packages/frontend/src/app/mcp-server/[id]/page.tsx:270-272 — endpointUrl and slug; :356-364 — the current deeplinks; :440-456 — the Cursor/VS Code modal buttons; :645 — the client card.
  • packages/frontend/src/lib/api.ts:964-976 — server.info() with mcpAuthMode.
  • packages/backend/src/health/health.controller.ts:30-57 — where mcpAuthMode comes from.
  • packages/backend/src/mcp-servers/mcp-servers.controller.ts:107-115 — write permissions (VIEWER can't modify, which this feature doesn't need).
  • packages/frontend/tests/e2e/mcp-server-assignments.spec.ts — Playwright pattern with mocked /api/ routes and a server page.
  • Cursor docs: https://cursor.com/docs/mcp/install-links

Acceptance criteria

  • The card renders Markdown and HTML for Cursor and VS Code; clicking a rendered badge on GitHub opens the client's install prompt (screenshot or GIF in the PR).
  • Generated links use https, are correctly encoded (slugs with spaces/umlauts), and contain only name, type and url.
  • A Playwright test under packages/frontend/tests/e2e/ (npm run test:e2e in packages/frontend) mocks server.info() for oauth2, legacy and none, checks the matching note or warning, and asserts the copied snippet contains no X-API-Key header and no key or token.
  • The localhost note appears when the origin is localhost.
  • npm run lint and npx tsc --noEmit -p tsconfig.json pass in packages/frontend.
  • Docs updated (docs/integrations/claude.md Cursor section, docs/integrations/copilot.md VS Code section).

Out of scope

  • Public pages or a server directory listing; no backend changes.
  • Badges for other clients (Claude, ChatGPT, Windsurf). Add them later if they gain an install URL.
  • Anything under ee/.

Size

M (1–2 days)

How to claim

Comment "I'd like to work on this" and we'll assign you. Rules in #846.

Lingua principale
TypeScript
Stelle
856
Fork
82
Merge medio
6h 49m
PR unite (30g)
152

Preparare l'ambiente

Questo progetto non fornisce container di sviluppo, Dockerfile né guida per i contributori, quindi l'ambiente è a tuo carico: parti dal suo README e consulta la nostra guida al primo contributo per i passaggi generali.

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di HelpCode-ai/anythingmcp

Tutte le issue di HelpCode-ai/anythingmcp

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.