Merge pull request #726 from RhysSullivan/hotfix/source-icons-previous-behavior

Restore source icon favicon lookup

Author: RhysSullivan

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

@@ -3,21 +3,20 @@ import { describe, expect, it } from "@effect/vitest";
 import { sourceFaviconUrl } from "./source-favicon";
 
 describe("SourceFavicon", () => {
-  it("uses the source site's own favicon for public URLs", () => {
+  it("uses the favicon service that handles provider-specific icon locations", () => {
     expect(sourceFaviconUrl("https://api.github.com/graphql", 20)).toBe(
-      "https://github.com/favicon.ico?sz=40",
+      "https://www.google.com/s2/favicons?domain=github.com&sz=40",
     );
   });
 
   it("does not request favicons for local URLs", () => {
     expect(sourceFaviconUrl("http://localhost:3000/private", 20)).toBeNull();
     expect(sourceFaviconUrl("http://127.0.0.1:3000/private", 20)).toBeNull();
-    expect(sourceFaviconUrl("http://api.local/private", 20)).toBeNull();
   });
 
-  it("does not send source URLs to a third-party favicon service", () => {
-    expect(sourceFaviconUrl("https://internal.example.test/private", 20)).not.toContain(
-      "google.com",
+  it("sends only the registrable domain to the favicon service", () => {
+    expect(sourceFaviconUrl("https://api.github.com/private", 20)).toBe(
+      "https://www.google.com/s2/favicons?domain=github.com&sz=40",
     );
   });
 });

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

@@ -3,38 +3,15 @@ import { useState } from "react";
 import { getDomain } from "tldts";
 
 // ---------------------------------------------------------------------------
-// SourceFavicon — renders the source site's own public favicon.
-// Do not fetch third-party favicon services here; source URLs may be private.
+// SourceFavicon — renders a small favicon derived from a source URL.
+// Falls back to a neutral icon if the URL is missing or the image fails to load.
 // ---------------------------------------------------------------------------
 
-const IPV4_PATTERN = /^\d{1,3}(?:\.\d{1,3}){3}$/;
-
-const isIpHostname = (hostname: string): boolean =>
-  IPV4_PATTERN.test(hostname) || hostname.includes(":");
-
 export function sourceFaviconUrl(url: string | undefined, size: number): string | null {
   if (!url) return null;
-  if (!URL.canParse(url)) return null;
-
-  const parsed = new URL(url);
-  if (parsed.protocol !== "https:" && parsed.protocol !== "http:") return null;
-
-  const hostname = parsed.hostname.toLowerCase();
-  if (
-    hostname === "localhost" ||
-    hostname.endsWith(".localhost") ||
-    hostname.endsWith(".local") ||
-    isIpHostname(hostname)
-  ) {
-    return null;
-  }
-
-  const domain = getDomain(hostname);
+  const domain = getDomain(url) ?? (URL.canParse(url) ? getDomain(new URL(url).hostname) : null);
   if (!domain) return null;
-
-  const favicon = new URL(`https://${domain}/favicon.ico`);
-  favicon.searchParams.set("sz", String(size * 2));
-  return favicon.toString();
+  return `https://www.google.com/s2/favicons?domain=${domain}&sz=${size * 2}`;
 }
 
 export function SourceFavicon({ url, size = 16 }: { url?: string; size?: number }) {