From f7b1fb12d893e0e4cf45f45d7cf787e29b6d5bb3 Mon Sep 17 00:00:00 2001
From: npub1223z34hd7vtwc6qj4s7flsxkj644nlre2nthu7lrrmkumhu3xddsrx9r6w
 <52a228d6edf316ec6812ac3c9fc0d696ab59fc7954d77e7be31eedcddf91335b@buzz.block.builderlab.xyz>
Date: Wed, 29 Jul 2026 14:14:57 -0700
Subject: [PATCH] fix(desktop): label image previews by domain

Co-authored-by: Taylor Ho <taylorkmho@gmail.com>
Signed-off-by: Taylor Ho <taylorkmho@gmail.com>
---
 .../src/shared/ui/link-preview-attachment.tsx    | 16 ++++++++++++++--
 desktop/tests/e2e/messaging.spec.ts              |  3 +++
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/desktop/src/shared/ui/link-preview-attachment.tsx b/desktop/src/shared/ui/link-preview-attachment.tsx
index 136a02ab3..8f789dec7 100644
--- a/desktop/src/shared/ui/link-preview-attachment.tsx
+++ b/desktop/src/shared/ui/link-preview-attachment.tsx
@@ -112,6 +112,14 @@ function LinkPreviewLogo({ preview }: { preview: ResolvedLinkPreview }) {
   }
 }
 
+function getHostname(preview: ResolvedLinkPreview): string {
+  try {
+    return new URL(preview.href).hostname.replace(/^www\./, "");
+  } catch {
+    return preview.provider;
+  }
+}
+
 export function LinkPreviewAttachment({
   className,
   onRemove,
@@ -123,6 +131,7 @@ export function LinkPreviewAttachment({
 }) {
   const reserveImage = preview.imageState !== "none";
   const showImage = preview.imageState === "image";
+  const hostname = getHostname(preview);
 
   return (
     <div className={cn("relative w-[22.5rem] max-w-full shrink-0", className)}>
@@ -161,8 +170,11 @@ export function LinkPreviewAttachment({
           </AttachmentMedia>
         )}
         <AttachmentContent className={reserveImage ? "px-3 py-2.5" : undefined}>
-          <div className="truncate text-xs font-medium leading-4 text-muted-foreground">
-            {preview.provider}
+          <div
+            className="truncate text-xs font-normal leading-4 text-muted-foreground"
+            data-link-preview-hostname=""
+          >
+            {reserveImage ? hostname : preview.provider}
           </div>
           <AttachmentTitle
             className={
diff --git a/desktop/tests/e2e/messaging.spec.ts b/desktop/tests/e2e/messaging.spec.ts
index 560159938..b0b56a043 100644
--- a/desktop/tests/e2e/messaging.spec.ts
+++ b/desktop/tests/e2e/messaging.spec.ts
@@ -372,6 +372,9 @@ test("link preview image geometry stays stable while loading", async ({
     expect(pending.titleHeight).toBe(20);
     expect(loaded.titleHeight).toBe(20);
     expect(loaded.descriptionHeight).toBe(16);
+    await expect(card.locator("[data-link-preview-hostname]")).toHaveText(
+      "github.com",
+    );
     expect(pending.imageBottomInset).toBeCloseTo(1, 1);
     expect(pending.imageLeftInset).toBeCloseTo(1, 1);
     expect(pending.imageTopInset).toBeCloseTo(1, 1);