feat(web): add prefab MCP connector presets

jsourcebot · jsourcebot · commit 358aa11e6dd1 · 2026-05-30T15:10:37.000-07:00
diff --git a/packages/web/src/app/(app)/settings/workspaceAskAgent/prefabConnectorPopover.tsx b/packages/web/src/app/(app)/settings/workspaceAskAgent/prefabConnectorPopover.tsx
@@ -1,13 +1,14 @@
 'use client';
 
+// @techdebt : this seems to be an unused copy
+
 import { useMemo, useState } from "react";
 import {
     Command,
     CommandGroup,
     CommandInput,
     CommandItem,
     CommandList,
-    CommandSeparator,
 } from "@/components/ui/command";
 import { Button } from "@/components/ui/button";
 import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
@@ -110,8 +111,7 @@ export function PrefabConnectorPopover({
                                 </div>
                             )}
                         </CommandGroup>
-                        <CommandSeparator />
-                        <CommandGroup>
+                        <CommandGroup className="sticky bottom-0 z-10 border-t bg-popover">
                             <CommandItem
                                 value="Custom URL"
                                 onSelect={handleSelectCustomUrl}
diff --git a/packages/web/src/ee/features/chat/mcp/components/prefabConnectorPopover.tsx b/packages/web/src/ee/features/chat/mcp/components/prefabConnectorPopover.tsx
@@ -7,7 +7,6 @@ import {
     CommandInput,
     CommandItem,
     CommandList,
-    CommandSeparator,
 } from "@/components/ui/command";
 import { Button } from "@/components/ui/button";
 import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
@@ -110,8 +109,7 @@ export function PrefabConnectorPopover({
                                 </div>
                             )}
                         </CommandGroup>
-                        <CommandSeparator />
-                        <CommandGroup>
+                        <CommandGroup className="sticky bottom-0 z-10 border-t bg-popover">
                             <CommandItem
                                 value="Custom URL"
                                 onSelect={handleSelectCustomUrl}
diff --git a/packages/web/src/ee/features/chat/mcp/prefabMcpServers.test.ts b/packages/web/src/ee/features/chat/mcp/prefabMcpServers.test.ts
@@ -13,16 +13,46 @@ describe('prefab MCP servers', () => {
                 name: 'Atlassian',
                 serverUrl: 'https://mcp.atlassian.com/v1/mcp/authv2',
             },
+            {
+                id: 'betterstack',
+                name: 'Better Stack',
+                serverUrl: 'https://mcp.betterstack.com',
+            },
+            {
+                id: 'circleback',
+                name: 'Circleback',
+                serverUrl: 'https://circleback.ai/api/mcp',
+            },
+            {
+                id: 'github',
+                name: 'GitHub',
+                serverUrl: 'https://api.githubcopilot.com/mcp/',
+            },
+            {
+                id: 'gitlab',
+                name: 'GitLab',
+                serverUrl: 'https://gitlab.com/api/v4/mcp',
+            },
             {
                 id: 'linear',
                 name: 'Linear',
                 serverUrl: 'https://mcp.linear.app/mcp',
             },
+            {
+                id: 'notion',
+                name: 'Notion',
+                serverUrl: 'https://mcp.notion.com/mcp',
+            },
             {
                 id: 'posthog',
                 name: 'PostHog',
                 serverUrl: 'https://mcp.posthog.com/mcp',
             },
+            {
+                id: 'sentry',
+                name: 'Sentry',
+                serverUrl: 'https://mcp.sentry.dev/mcp',
+            },
             {
                 id: 'slack',
                 name: 'Slack',
@@ -40,13 +70,39 @@ describe('prefab MCP servers', () => {
     test('hides already configured prefab servers after URL normalization', () => {
         const availableServers = getAvailablePrefabMcpServers(['https://mcp.slack.com/mcp/']);
 
-        expect(availableServers.map((server) => server.id)).toEqual(['atlassian', 'linear', 'posthog']);
+        expect(availableServers.map((server) => server.id)).toEqual([
+            'atlassian',
+            'betterstack',
+            'circleback',
+            'github',
+            'gitlab',
+            'linear',
+            'notion',
+            'posthog',
+            'sentry',
+        ]);
     });
 
     test('hides the Atlassian prefab entry when the shared endpoint is configured', () => {
         const availableServers = getAvailablePrefabMcpServers(['https://mcp.atlassian.com/v1/mcp/authv2/']);
 
-        expect(availableServers.map((server) => server.id)).toEqual(['linear', 'posthog', 'slack']);
+        expect(availableServers.map((server) => server.id)).toEqual([
+            'betterstack',
+            'circleback',
+            'github',
+            'gitlab',
+            'linear',
+            'notion',
+            'posthog',
+            'sentry',
+            'slack',
+        ]);
+    });
+
+    test('hides the GitHub prefab entry when the trailing slash is omitted', () => {
+        const availableServers = getAvailablePrefabMcpServers(['https://api.githubcopilot.com/mcp']);
+
+        expect(availableServers.map((server) => server.id)).not.toContain('github');
     });
 
     test('normalizes server URLs for duplicate comparisons', () => {
diff --git a/packages/web/src/ee/features/chat/mcp/prefabMcpServers.ts b/packages/web/src/ee/features/chat/mcp/prefabMcpServers.ts
@@ -16,16 +16,46 @@ const prefabMcpServers = [
         name: "Atlassian",
         serverUrl: "https://mcp.atlassian.com/v1/mcp/authv2",
     },
+    {
+        id: "betterstack",
+        name: "Better Stack",
+        serverUrl: "https://mcp.betterstack.com",
+    },
+    {
+        id: "circleback",
+        name: "Circleback",
+        serverUrl: "https://circleback.ai/api/mcp",
+    },
+    {
+        id: "github",
+        name: "GitHub",
+        serverUrl: "https://api.githubcopilot.com/mcp/",
+    },
+    {
+        id: "gitlab",
+        name: "GitLab",
+        serverUrl: "https://gitlab.com/api/v4/mcp",
+    },
     {
         id: "linear",
         name: "Linear",
         serverUrl: "https://mcp.linear.app/mcp",
     },
+    {
+        id: "notion",
+        name: "Notion",
+        serverUrl: "https://mcp.notion.com/mcp",
+    },
     {
         id: "posthog",
         name: "PostHog",
         serverUrl: "https://mcp.posthog.com/mcp",
     },
+    {
+        id: "sentry",
+        name: "Sentry",
+        serverUrl: "https://mcp.sentry.dev/mcp",
+    },
     {
         id: "slack",
         name: "Slack",
diff --git a/packages/web/src/ee/features/chat/mcp/utils.test.ts b/packages/web/src/ee/features/chat/mcp/utils.test.ts
@@ -44,6 +44,15 @@ describe('getMcpFaviconUrl', () => {
         expect(getMcpFaviconUrl('https://mcp.atlassian.com/v1/mcp/authv2', 'Atlassian')).toMatch(/^data:image\/svg\+xml,/);
     });
 
+    test('returns known vendor favicon URLs for prefab servers with non-canonical MCP domains', () => {
+        expect(getMcpFaviconUrl('https://mcp.betterstack.com', 'Better Stack')).toBe('https://betterstack.com/favicon.ico');
+        expect(getMcpFaviconUrl('https://mcp.notion.com/mcp', 'Notion')).toBe('https://www.notion.com/front-static/favicon.ico');
+    });
+
+    test('returns a local GitHub icon for the GitHub prefab server', () => {
+        expect(getMcpFaviconUrl('https://api.githubcopilot.com/mcp/', 'GitHub')).toMatch(/^data:image\/svg\+xml,/);
+    });
+
     test('returns undefined for a malformed server URL', () => {
         expect(getMcpFaviconUrl('not a url')).toBeUndefined();
     });
diff --git a/packages/web/src/ee/features/chat/mcp/utils.ts b/packages/web/src/ee/features/chat/mcp/utils.ts
@@ -6,10 +6,12 @@
  * to key favicon maps. Must be kept consistent everywhere — collisions on
  * this value are prevented at server-creation time.
  */
+// @techdebt : duplicated in ee and non-ee
 export function sanitizeMcpServerName(name: string): string {
     return name.toLowerCase().replace(/[^a-z0-9]/g, '_');
 }
 
+// @techdebt : duplicated in ee and non-ee
 export function pluralize(count: number, singular: string, plural = `${singular}s`) {
     return count === 1 ? singular : plural;
 }
@@ -20,13 +22,15 @@ const compactNumberFormatter = new Intl.NumberFormat(undefined, {
     maximumFractionDigits: 1,
 });
 
+// @techdebt : duplicated in ee and non-ee
 export function formatCount(count: number) {
     if (count >= 10_000) {
         return compactNumberFormatter.format(count);
     }
     return standardNumberFormatter.format(count);
 }
 
+// @techdebt : duplicated in ee and non-ee
 export function formatUsageSharePercent(percent: number) {
     if (percent <= 0) {
         return "0%";
@@ -60,10 +64,19 @@ const atlassianIconSvg = `<svg width="48" height="48" viewBox="0 0 48 48" fill="
 </defs>
 </svg>`;
 
+const githubIconSvg = `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="16" cy="16" r="16" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M16 0C7.16 0 0 7.16 0 16C0 23.08 4.58 29.06 10.94 31.18C11.74 31.32 12.04 30.84 12.04 30.42C12.04 30.04 12.02 28.78 12.02 27.44C8 28.18 6.96 26.46 6.64 25.56C6.46 25.1 5.68 23.68 5 23.3C4.44 23 3.64 22.26 4.98 22.24C6.24 22.22 7.14 23.4 7.44 23.88C8.88 26.3 11.18 25.62 12.1 25.2C12.24 24.16 12.66 23.46 13.12 23.06C9.56 22.66 5.84 21.28 5.84 15.16C5.84 13.42 6.46 11.98 7.48 10.86C7.32 10.46 6.76 8.82 7.64 6.62C7.64 6.62 8.98 6.2 12.04 8.26C13.32 7.9 14.68 7.72 16.04 7.72C17.4 7.72 18.76 7.9 20.04 8.26C23.1 6.18 24.44 6.62 24.44 6.62C25.32 8.82 24.76 10.46 24.6 10.86C25.62 11.98 26.24 13.4 26.24 15.16C26.24 21.3 22.5 22.66 18.94 23.06C19.52 23.56 20.02 24.52 20.02 26.02C20.02 28.16 20 29.88 20 30.42C20 30.84 20.3 31.34 21.1 31.18C27.42 29.06 32 23.06 32 16C32 7.16 24.84 0 16 0V0Z" fill="#24292E"/>
+</svg>`;
+
 const knownMcpFaviconUrlsBySanitizedName: Record<string, string> = {
     atlassian: createMcpIconDataUri(atlassianIconSvg),
+    better_stack: "https://betterstack.com/favicon.ico",
+    github: createMcpIconDataUri(githubIconSvg),
+    notion: "https://www.notion.com/front-static/favicon.ico",
 };
 
+// @techdebt : duplicated in ee and non-ee
 export function getMcpFaviconUrl(serverUrl: string, serverName?: string): string | undefined {
     if (serverName) {
         const knownFaviconUrl = knownMcpFaviconUrlsBySanitizedName[sanitizeMcpServerName(serverName)];
diff --git a/packages/web/src/features/chat/mcp/utils.test.ts b/packages/web/src/features/chat/mcp/utils.test.ts
@@ -44,6 +44,15 @@ describe('getMcpFaviconUrl', () => {
         expect(getMcpFaviconUrl('https://mcp.atlassian.com/v1/mcp/authv2', 'Atlassian')).toMatch(/^data:image\/svg\+xml,/);
     });
 
+    test('returns known vendor favicon URLs for prefab servers with non-canonical MCP domains', () => {
+        expect(getMcpFaviconUrl('https://mcp.betterstack.com', 'Better Stack')).toBe('https://betterstack.com/favicon.ico');
+        expect(getMcpFaviconUrl('https://mcp.notion.com/mcp', 'Notion')).toBe('https://www.notion.com/front-static/favicon.ico');
+    });
+
+    test('returns a local GitHub icon for the GitHub prefab server', () => {
+        expect(getMcpFaviconUrl('https://api.githubcopilot.com/mcp/', 'GitHub')).toMatch(/^data:image\/svg\+xml,/);
+    });
+
     test('returns undefined for a malformed server URL', () => {
         expect(getMcpFaviconUrl('not a url')).toBeUndefined();
     });
diff --git a/packages/web/src/features/chat/mcp/utils.ts b/packages/web/src/features/chat/mcp/utils.ts
@@ -6,10 +6,12 @@
  * to key favicon maps. Must be kept consistent everywhere — collisions on
  * this value are prevented at server-creation time.
  */
+// @techdebt : duplicated in ee and non-ee
 export function sanitizeMcpServerName(name: string): string {
     return name.toLowerCase().replace(/[^a-z0-9]/g, '_');
 }
 
+// @techdebt : duplicated in ee and non-ee
 export function pluralize(count: number, singular: string, plural = `${singular}s`) {
     return count === 1 ? singular : plural;
 }
@@ -20,13 +22,15 @@ const compactNumberFormatter = new Intl.NumberFormat(undefined, {
     maximumFractionDigits: 1,
 });
 
+// @techdebt : duplicated in ee and non-ee
 export function formatCount(count: number) {
     if (count >= 10_000) {
         return compactNumberFormatter.format(count);
     }
     return standardNumberFormatter.format(count);
 }
 
+// @techdebt : duplicated in ee and non-ee
 export function formatUsageSharePercent(percent: number) {
     if (percent <= 0) {
         return "0%";
@@ -60,10 +64,19 @@ const atlassianIconSvg = `<svg width="48" height="48" viewBox="0 0 48 48" fill="
 </defs>
 </svg>`;
 
+const githubIconSvg = `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="16" cy="16" r="16" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M16 0C7.16 0 0 7.16 0 16C0 23.08 4.58 29.06 10.94 31.18C11.74 31.32 12.04 30.84 12.04 30.42C12.04 30.04 12.02 28.78 12.02 27.44C8 28.18 6.96 26.46 6.64 25.56C6.46 25.1 5.68 23.68 5 23.3C4.44 23 3.64 22.26 4.98 22.24C6.24 22.22 7.14 23.4 7.44 23.88C8.88 26.3 11.18 25.62 12.1 25.2C12.24 24.16 12.66 23.46 13.12 23.06C9.56 22.66 5.84 21.28 5.84 15.16C5.84 13.42 6.46 11.98 7.48 10.86C7.32 10.46 6.76 8.82 7.64 6.62C7.64 6.62 8.98 6.2 12.04 8.26C13.32 7.9 14.68 7.72 16.04 7.72C17.4 7.72 18.76 7.9 20.04 8.26C23.1 6.18 24.44 6.62 24.44 6.62C25.32 8.82 24.76 10.46 24.6 10.86C25.62 11.98 26.24 13.4 26.24 15.16C26.24 21.3 22.5 22.66 18.94 23.06C19.52 23.56 20.02 24.52 20.02 26.02C20.02 28.16 20 29.88 20 30.42C20 30.84 20.3 31.34 21.1 31.18C27.42 29.06 32 23.06 32 16C32 7.16 24.84 0 16 0V0Z" fill="#24292E"/>
+</svg>`;
+
 const knownMcpFaviconUrlsBySanitizedName: Record<string, string> = {
     atlassian: createMcpIconDataUri(atlassianIconSvg),
+    better_stack: "https://betterstack.com/favicon.ico",
+    github: createMcpIconDataUri(githubIconSvg),
+    notion: "https://www.notion.com/front-static/favicon.ico",
 };
 
+// @techdebt : duplicated in ee and non-ee
 export function getMcpFaviconUrl(serverUrl: string, serverName?: string): string | undefined {
     if (serverName) {
         const knownFaviconUrl = knownMcpFaviconUrlsBySanitizedName[sanitizeMcpServerName(serverName)];
