@linktr.ee/messaging-react 1.38.0-rc-1777583423 → 1.38.0

package/dist/index.js

@@ -1,4 +1,4 @@
-import { b as e, c as t, C as i, d as n, e as o, f as r, F as g, g as M, L as m, M as l, h as u, i as c, j as h, P as d, k as v, r as C, l as L, u as P, m as k, n as p, o as A } from "./index-jnKl3mQ0.js";
+import { b as e, c as t, C as i, d as n, e as o, f as r, F as g, g as M, L as m, M as l, h as u, i as c, j as h, P as d, k as v, r as C, l as L, u as P, m as k, n as p, o as A } from "./index-B_4pciGp.js";
 export {
   e as ActionButton,
   t as Avatar,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@linktr.ee/messaging-react",
-  "version": "1.38.0-rc-1777583423",
+  "version": "1.38.0",
   "description": "React messaging components built on messaging-core for web applications",
   "type": "module",
   "main": "dist/index.js",

package/src/components/AttachmentCard/index.tsx

@@ -70,15 +70,17 @@ const AttachmentCard: React.FC<AttachmentCardProps> = ({
       {thumbnail}
 
       <div className="px-4 pb-3 pt-3">
-        <p
-          className={classNames('mb-0.5 truncate text-base font-medium', {
-            'text-black': !isDark,
-            'text-white/30': isDark && titleDimmed,
-            'text-white': isDark && !titleDimmed,
-          })}
-        >
-          {displayTitle}
-        </p>
+        {displayTitle.trim() !== '' && (
+          <p
+            className={classNames('mb-0.5 truncate text-base font-medium', {
+              'text-black': !isDark,
+              'text-white/30': isDark && titleDimmed,
+              'text-white': isDark && !titleDimmed,
+            })}
+          >
+            {displayTitle}
+          </p>
+        )}
 
         <div className="flex flex-wrap items-center gap-1">
           {renderTypeIcon(mimeType, {

package/src/components/MediaMessage/MediaMessage.test.tsx

@@ -4,7 +4,7 @@ import { describe, expect, it, vi } from 'vitest'
 
 import { renderWithProviders, screen, fireEvent } from '../../test/utils'
 
-import { MediaMessage } from '.'
+import { MediaMessage, resolveLinkAttachment } from '.'
 
 vi.mock('../Avatar', () => ({
   Avatar: ({ id }: { id: string }) => (
@@ -310,6 +310,25 @@ describe('MediaMessage', () => {
     expect(screen.getByRole('button', { name: 'Download' })).toBeInTheDocument()
   })
 
+  it('does not show literal placeholder title for sent image without title', () => {
+    renderWithProviders(
+      <MediaMessage
+        isMyMessage={true}
+        message={msg({
+          attachments: [
+            {
+              type: 'image',
+              image_url: 'https://cdn.example.com/photo.jpg',
+              mime_type: 'image/jpeg',
+            },
+          ],
+        })}
+      />
+    )
+
+    expect(screen.queryByText('Attachment title')).not.toBeInTheDocument()
+  })
+
   it('does not show Download button for sent (Creator) image attachment', () => {
     renderWithProviders(
       <MediaMessage
@@ -452,6 +471,20 @@ describe('MediaMessage', () => {
     expect(screen.queryByRole('button', { name: 'Download' })).not.toBeInTheDocument()
   })
 
+  it('resolveLinkAttachment ignores empty-string og_scrape_url without asset_url', () => {
+    const message = msg({
+      attachments: [
+        {
+          type: 'image',
+          image_url: 'https://cdn.example.com/photo.jpg',
+          mime_type: 'image/jpeg',
+          og_scrape_url: '',
+        },
+      ],
+    })
+    expect(resolveLinkAttachment(message)).toBeUndefined()
+  })
+
   it('Download button triggers fetch and uses fallback on failure', async () => {
     const fetchSpy = vi.spyOn(global, 'fetch').mockRejectedValue(new Error('fail'))
     const openSpy = vi.spyOn(window, 'open').mockReturnValue({

package/src/components/MediaMessage/index.tsx

@@ -45,10 +45,12 @@ const LinkCard: React.FC<{
   isMyMessage: boolean
 }> = ({ attachment, isMyMessage }) => {
   const { title, text, image_url, og_scrape_url, title_link } = attachment
-  const url = og_scrape_url ?? title_link
+  const rawUrl = og_scrape_url ?? title_link
+  const url =
+    typeof rawUrl === 'string' && rawUrl.trim() !== '' ? rawUrl : undefined
 
-  return (
-    <a href={url} target="_blank" rel="noopener noreferrer" className="block no-underline">
+  const body = (
+    <React.Fragment>
       <div className="p-2">
         {image_url ? (
           <img
@@ -79,15 +81,25 @@ const LinkCard: React.FC<{
           </p>
         )}
       </div>
-    </a>
+    </React.Fragment>
   )
+
+  if (url) {
+    return (
+      <a href={url} target="_blank" rel="noopener noreferrer" className="block no-underline">
+        {body}
+      </a>
+    )
+  }
+
+  return <div className="block">{body}</div>
 }
 
 export function resolveLinkAttachment(
   message: LocalMessage
 ): Attachment | undefined {
   return message.attachments?.find(
-    (a) => a.type === 'link' || (a.og_scrape_url != null && !a.asset_url)
+    (a) => a.type === 'link' || (!!a.og_scrape_url && !a.asset_url)
   )
 }
 
@@ -216,6 +228,7 @@ const Creator: React.FC<MediaMessageResolved> = ({
     <AttachmentCard
       variant="dark"
       title={title}
+      placeholderTitle=""
       mimeType={resolvedType}
       detail={detail}
       thumbnail={