supermemory/apps/web/components
Dhravya 3487666481
feat(web): add MCP connector directory (#1461)
<!-- VORFLUX_AGENT_PR_BODY_BEGIN -->
Adds the full 654-entry MCP directory without bundling records into client JavaScript, with explicit capability status and connector branding that degrades safely when no authoritative logo is available.

## Changes

- Lazy-load and validate the searchable, filterable, progressively rendered MCP catalog.
- Render same-origin proxied provider icons for 543 entries, with a reviewed domain allowlist and deterministic fallback marks for 111 unresolved or unbranded entries.
- Record OAuth discovery capability separately from end-to-end support; all directory setup actions remain suppressed until their authentication flow is verified.
- Add a reproducible OAuth metadata probe with HTTPS/private-network protections, stable URL keys, authorization-server scanning, and catalog fingerprint validation.
- Add Google Drive branding for the curated built-in connector.

## Testing

- **Passed:** Deterministic generation and catalog assertions.
  ```bash
  PATH="$HOME/.bun/bin:$PATH" python3 apps/web/scripts/generate-mcp-directory.py --output
  cmp apps/web/public/mcp-directory.json
  ```
  Verified 654 entries, 254 DCR discoveries, 27 preregistered OAuth discoveries, 373 unclassified entries, and zero directory setup actions.
- **Passed:** Stale OAuth metadata fingerprint is rejected by the generator.
- **Passed:** Touched-file Biome checks and `git diff --check`.
- **Passed:** Icon proxy returned 200 for an allowlisted domain and 400 for an unknown valid-looking domain.
- **Passed:** Authenticated desktop/mobile browser inspection and conservative capability labels.
- **Passed:** Public preview returned HTTP 200 and rendered the real app. Authentication cookies do not transfer to the public hostname, so the public screenshot shows login.
- **Partial:** Repository-wide TypeScript checks remain blocked by unrelated existing errors outside the touched MCP files.
- **Partial:** 111 entries intentionally retain deterministic fallback marks; endpoint-derived domains may not always be the canonical brand logo.
- **Blocked:** Google rejected the local HTTP OAuth callback, so live Google Drive consent, callback, persistence, tool discovery, disconnect, and reconnect were not completed.

Public preview: https://ar8ruchhbi65.preview.us1.vorflux.com/configure/tools

---
**Attached Images**

*[288.csv]*

*[mcp-directory-final.json]*

![mcp-directory-branding-desktop.png](https://api.us1.vorflux.com/assets/artifacts/c3VwZXJtZW1vcnk6Zjo4MDA0.3_UzR_OP9Jk228FYbrAPTXyqybRBlqwn5Uv4tksf_Y0.png)

![mcp-directory-branding-mobile.png](https://api.us1.vorflux.com/assets/artifacts/c3VwZXJtZW1vcnk6Zjo4MDA1.b5G6nsOBVm2s6DlEFWFiMFCcULAkV0MCCGZ8XVsA5js.png)

![mcp-directory-public-preview.png](https://api.us1.vorflux.com/assets/artifacts/c3VwZXJtZW1vcnk6Zjo4MDA2.ZrBAeBi62JX1xavAtaDLQ0fuixgBjN7x1NrqIxtdmKw.png)
<!-- VORFLUX_AGENT_PR_BODY_END -->

---
**Session Details**
- Session: [View Session](https://supermemory.us1.vorflux.com/agent-sessions/1cd0aab9-2a45-4818-aa13-f9bfe032ddba)
- Requested by: Dhravya Shah (dhravya@supermemory.com)
- Address comments on this PR. Add `(aside)` to your comment to have me ignore it.

<!-- CURSOR_SUMMARY -->
---

> [!NOTE]
> **Medium Risk**
> Changes how users pick MCP URLs and auth (OAuth vs API key) before hitting existing connect endpoints; no new backend auth logic in this diff, but misconfiguration or trusting bad URLs remains a user-risk surface.
>
> **Overview**
> Adds a **browseable MCP directory** on the Company Brain connectors page: the catalog is **not bundled in JS**—it loads from static **`/mcp-directory.json`** only after the user opens the directory (with validation, caching, and abort handling).
>
> The new **`McpDirectoryBrowser`** supports search, category/availability filters, and progressive “show more” rendering. Supported remote entries route into the existing custom MCP flow via **Set up**, which pre-fills name/URL and opens the connector dialog with context-specific copy.
>
> The custom connector dialog now uses an explicit **OAuth vs API key** toggle; API key fields only appear for API-key mode, and directory-backed connections get **stable slugs** (`-dir-` suffix) so names display cleanly on connected cards. **Middleware** excludes `mcp-directory.json` from the auth matcher so the asset can be fetched publicly.
>
> <sup>Reviewed by [Cursor Bugbot](https://cursor.com/bugbot) for commit 8b59bae84a. Bugbot is set up for automated code reviews on this repo. Configure [here](https://www.cursor.com/dashboard/bugbot).</sup>
<!-- /CURSOR_SUMMARY -->
2026-08-20 22:58:39 +00:00
..
add-document feat(web): support discount code checkout (#1523) 2026-08-16 13:43:53 -07:00
brain-home feat(web): take a card before the Company Brain trial starts (#1459) 2026-08-13 06:58:47 +00:00
chat Upgrade Nova model picker to current runtime models (#1404) 2026-08-13 17:08:50 +05:30
directory feat(web): add MCP connector directory (#1461) 2026-08-20 22:58:39 +00:00
document-cards Support HTML file uploads in Nova (#1076) 2026-06-10 06:09:20 +00:00
document-modal fix(web): match YouTube URLs by hostname instead of substring (#1182) 2026-07-10 16:20:18 -07:00
integrations Fix integrations layout and mobile promo responsiveness (#1481) 2026-08-17 18:47:36 +00:00
mcp-modal MCP Revamp (#1120) (#1380) 2026-07-30 17:08:51 -07:00
memory-graph memory graph loader (#1072) 2026-06-09 17:39:35 +00:00
nova fix(web): org plan badges via org-summaries and refresh Nova chat empty state (#968) 2026-05-18 23:44:09 +00:00
onboarding add responsivness in share graph, bookmark section, navigation controls (#940) 2026-05-15 08:37:01 -07:00
onboarding-brain fix(brain): keep the confirmed company domain after checkout return (#1536) 2026-08-18 23:13:12 +00:00
settings feat(web): add MCP connector directory (#1461) 2026-08-20 22:58:39 +00:00
text-editor Improve quick note editor interactions & fix filter chips responsiveness (#989) 2026-05-23 11:54:17 -07:00
add-space-modal.tsx feat(spaces): per-space entity context + edit-space modal (#1078) 2026-06-12 20:51:37 +00:00
animated-gradient-background.tsx feat: major iteration on the app (#896) 2026-05-02 23:58:58 +00:00
app-experience.tsx feat(web): Slack disconnect UI and connect-error toasts (#1375) 2026-07-31 07:11:26 +00:00
bottom-nav.tsx feat(settings): settings modal overhaul (#1069) 2026-06-09 12:07:47 +05:30
brain-connector-icons.tsx feat(web): add MCP connector directory (#1461) 2026-08-20 22:58:39 +00:00
brain-trial-pill.tsx feat(web): company brain trial visibility + setup timeline (#1384) 2026-08-02 07:46:05 +00:00
company-brain-header.tsx feat(web): add memory button to company brain navbar (#1468) 2026-08-13 22:04:01 -07:00
company-brain-promo.tsx Fix integrations layout and mobile promo responsiveness (#1481) 2026-08-17 18:47:36 +00:00
configure-view.tsx feat(web): automation connection warnings and calmer automations page (#1396) 2026-08-10 00:02:50 +00:00
connect-ai-modal.tsx MCP Revamp (#1120) (#1380) 2026-07-30 17:08:51 -07:00
dashboard-view.tsx feat(web): take a card before the Company Brain trial starts (#1459) 2026-08-13 06:58:47 +00:00
digests-view.tsx add weekly digests, log, and opt out options (#1107) 2026-06-18 01:06:40 +00:00
document-icon.tsx fix(web): match YouTube URLs by hostname instead of substring (#1182) 2026-07-10 16:20:18 -07:00
documents-command-palette.tsx feat(settings): settings modal overhaul (#1069) 2026-06-09 12:07:47 +05:30
edit-space-modal.tsx feat(spaces): per-space entity context + edit-space modal (#1078) 2026-06-12 20:51:37 +00:00
ensure-workspace.tsx feat(brain): add /brain Slack-first onboarding entry (#1310) 2026-07-21 21:19:54 +00:00
error-boundary.tsx error boundaries 2026-02-12 16:41:12 -08:00
feedback-modal.tsx chore: improve the codebase with react doctor (#917) 2026-05-09 19:12:01 +00:00
fullscreen-note-modal.tsx Revert "Improve quick note editor interactions & fix filter chips responsiveness" (#987) 2026-05-21 22:42:01 +05:30
granola-connect-modal.tsx feat/granola connector (#1007) 2026-06-03 15:19:49 +00:00
graph-layout-view.tsx Improve memory graph (#973) 2026-06-05 15:48:41 -07:00
header.tsx feat(web): add memory button to company brain navbar (#1468) 2026-08-13 22:04:01 -07:00
highlights-card.tsx fix(web): keep highlights card active index in range on refresh (#1334) 2026-08-12 20:55:01 +05:30
initial-header.tsx fix(web): restore Nova onboarding analytics events (#1023) 2026-05-29 19:54:13 +00:00
integration-icons.tsx chore: improve the codebase with react doctor (#917) 2026-05-09 19:12:01 +00:00
integrations-view.tsx feat(web): add MCP connector directory (#1461) 2026-08-20 22:58:39 +00:00
login-tools-panel.tsx Show the orbit animation on the login panel (#1168) 2026-06-27 10:55:37 -07:00
memories-grid.tsx Add OpenCode to Agents spaces (#1354) 2026-07-24 08:51:19 -07:00
orbit-memory.tsx Show the orbit animation on the login panel (#1168) 2026-06-27 10:55:37 -07:00
org-plan-badge.tsx feat(billing): add Max plan to nova with cancel/resume flow (#1024) 2026-05-31 19:10:17 +00:00
pwa-install-prompt.tsx feat(web): pwa prompt 'Add to Home Screen' opens share menu (#963) 2026-05-18 05:32:04 +00:00
query-client.tsx chore: remove the new folder and fix imports (#740) 2026-02-16 14:30:29 -07:00
quick-note-card.tsx Improve quick note editor interactions & fix filter chips responsiveness (#989) 2026-05-23 11:54:17 -07:00
remove-connection-dialog.tsx chore: improve the codebase with react doctor (#917) 2026-05-09 19:12:01 +00:00
review-memories-card.tsx review suggestions option for inferred memories (#1138) 2026-07-04 20:57:33 +00:00
review-memories-modal.tsx review suggestions option for inferred memories (#1138) 2026-07-04 20:57:33 +00:00
select-spaces-modal.tsx Remove paid plugin UI (#1403) 2026-08-15 18:41:46 +05:30
share-modal.tsx fix(web): use organization branding in Company Brain shares (#1360) 2026-07-25 03:46:17 +00:00
slack-connect-card.tsx feat(web): take a card before the Company Brain trial starts (#1459) 2026-08-13 06:58:47 +00:00
space-folder-icon.tsx feat(web): mobile UX for dashboard, nav, and spaces (#1000) 2026-05-25 16:09:34 +05:30
space-glyph.tsx feat(web): mobile UX for dashboard, nav, and spaces (#1000) 2026-05-25 16:09:34 +05:30
space-profile-modal.tsx add org level context and space level profile (#1002) 2026-05-26 10:17:56 -07:00
space-profile-panel.tsx feat(spaces): per-space entity context + edit-space modal (#1078) 2026-06-12 20:51:37 +00:00
space-selector.tsx Add shared Agents memory workspace (#1290) 2026-07-23 12:18:44 -07:00
spinner.tsx feat: mobile responsive, lint formats, toast, render issue fix (#688) 2026-01-21 03:11:53 +00:00
superloader.tsx Grok 4.3, web sources UX, and mobile polish (#1064) 2026-06-08 12:34:15 +05:30
timeline-view.tsx fix(web): match YouTube URLs by hostname instead of substring (#1182) 2026-07-10 16:20:18 -07:00
trial-setup-banner.tsx feat(web): take a card before the Company Brain trial starts (#1459) 2026-08-13 06:58:47 +00:00
user-profile-menu.tsx feat(web): surface Company Brain to personal-brain users (#1370) 2026-07-28 04:25:04 +00:00
utils.ts fix(web): match YouTube URLs by hostname instead of substring (#1182) 2026-07-10 16:20:18 -07:00