Match preset icons on exact tokens only

Author: RhysSullivan

packages/react/src/components/integration-favicon.test.tsx

@@ -273,6 +273,27 @@ describe("IntegrationFavicon", () => {
     ).toBe("https://example.com/spotify.png");
   });
 
+  it("does not match a different brand sharing a word fragment (ClickHouse Cloud vs Cloudflare)", () => {
+    expect(
+      integrationPresetIconUrl({ id: "clickhouse", kind: "mcp", name: "ClickHouse Cloud" }, [
+        {
+          key: "mcp",
+          label: "MCP",
+          add: () => null,
+          edit: () => null,
+          presets: [
+            {
+              id: "cloudflare",
+              name: "Cloudflare",
+              summary: "Workers, KV, D1, R2, and DNS management via MCP.",
+              icon: "https://integrations.sh/logo/cloudflare.com",
+            },
+          ],
+        },
+      ]),
+    ).toBeNull();
+  });
+
   it("infers favicon URLs from migrated host-shaped MCP names and slugs", () => {
     expect(integrationInferredUrl({ id: "mcp_posthog_com", name: "mcp.posthog.com" })).toBe(
       "https://mcp.posthog.com",

packages/react/src/components/integration-favicon.tsx

@@ -129,12 +129,12 @@ export function integrationInferredUrl(integration: {
   return null;
 }
 
+// Exact equality only: substring containment matched unrelated brands that
+// merely share a fragment ("ClickHouse Cloud" ⊂ "Cloudflare" via "cloud"). A
+// missed match is recoverable (the cascade falls through to the domain-derived
+// integrations.sh favicon); a wrong-brand icon is not.
 const tokenMatches = (integrationValue: string, presetValue: string): boolean =>
-  presetValue.length > 0 &&
-  integrationValue.length > 0 &&
-  (integrationValue === presetValue ||
-    integrationValue.includes(presetValue) ||
-    presetValue.includes(integrationValue));
+  presetValue.length > 0 && integrationValue === presetValue;
 
 export function integrationPresetIconUrl(
   integration: {