diff --git a/src/components/BookmarkItem.tsx b/src/components/BookmarkItem.tsx index f820663a..9575669e 100644 --- a/src/components/BookmarkItem.tsx +++ b/src/components/BookmarkItem.tsx @@ -37,11 +37,12 @@ export const BookmarkItem: React.FC = ({ bookmark, index, onS const firstUrl = hasUrls ? extractedUrls[0] : null const firstUrlClassification = firstUrl ? classifyUrl(firstUrl) : null - // For kind:30023 articles, extract image tag (per NIP-23) + // For kind:30023 articles, extract image and summary tags (per NIP-23) // Note: We extract directly from tags here since we don't have the full event. // When we have full events, we use getArticleImage() helper (see articleService.ts) const isArticle = bookmark.kind === 30023 const articleImage = isArticle ? bookmark.tags.find(t => t[0] === 'image')?.[1] : undefined + const articleSummary = isArticle ? bookmark.tags.find(t => t[0] === 'summary')?.[1] : undefined // Fetch OG image for large view (hook must be at top level) const instantPreview = firstUrl ? getPreviewImage(firstUrl, firstUrlClassification?.type || '') : null @@ -113,7 +114,8 @@ export const BookmarkItem: React.FC = ({ bookmark, index, onS eventNevent, getAuthorDisplayName, handleReadNow, - articleImage + articleImage, + articleSummary } if (viewMode === 'compact') { diff --git a/src/components/BookmarkViews/CardView.tsx b/src/components/BookmarkViews/CardView.tsx index 1f0eb1e8..c76cce77 100644 --- a/src/components/BookmarkViews/CardView.tsx +++ b/src/components/BookmarkViews/CardView.tsx @@ -21,6 +21,7 @@ interface CardViewProps { getAuthorDisplayName: () => string handleReadNow: (e: React.MouseEvent) => void articleImage?: string + articleSummary?: string } export const CardView: React.FC = ({ @@ -35,7 +36,8 @@ export const CardView: React.FC = ({ eventNevent, getAuthorDisplayName, handleReadNow, - articleImage + articleImage, + articleSummary }) => { const [expanded, setExpanded] = useState(false) const [urlsExpanded, setUrlsExpanded] = useState(false) @@ -122,7 +124,11 @@ export const CardView: React.FC = ({ )} - {bookmark.parsedContent ? ( + {isArticle && articleSummary ? ( +
+ +
+ ) : bookmark.parsedContent ? (
{shouldTruncate && bookmark.content ? diff --git a/src/components/BookmarkViews/CompactView.tsx b/src/components/BookmarkViews/CompactView.tsx index 8a164e0b..88cdf9cb 100644 --- a/src/components/BookmarkViews/CompactView.tsx +++ b/src/components/BookmarkViews/CompactView.tsx @@ -15,6 +15,7 @@ interface CompactViewProps { getIconForUrlType: IconGetter firstUrlClassification: { buttonText: string } | null articleImage?: string + articleSummary?: string } export const CompactView: React.FC = ({ @@ -24,7 +25,8 @@ export const CompactView: React.FC = ({ extractedUrls, onSelectUrl, getIconForUrlType, - firstUrlClassification + firstUrlClassification, + articleSummary }) => { const isArticle = bookmark.kind === 30023 const isWebBookmark = bookmark.kind === 39701 @@ -40,6 +42,11 @@ export const CompactView: React.FC = ({ } } + // For articles, prefer summary; for others, use content + const displayText = isArticle && articleSummary + ? articleSummary + : bookmark.content + return (
= ({ )} - {bookmark.content && ( + {displayText && (
- 60 ? '…' : '')} /> + 60 ? '…' : '')} />
)} {formatDate(bookmark.created_at)} diff --git a/src/components/BookmarkViews/LargeView.tsx b/src/components/BookmarkViews/LargeView.tsx index 14e32a4f..af044ad5 100644 --- a/src/components/BookmarkViews/LargeView.tsx +++ b/src/components/BookmarkViews/LargeView.tsx @@ -18,6 +18,7 @@ interface LargeViewProps { eventNevent?: string getAuthorDisplayName: () => string handleReadNow: (e: React.MouseEvent) => void + articleSummary?: string } export const LargeView: React.FC = ({ @@ -32,7 +33,8 @@ export const LargeView: React.FC = ({ authorNpub, eventNevent, getAuthorDisplayName, - handleReadNow + handleReadNow, + articleSummary }) => { const isArticle = bookmark.kind === 30023 @@ -59,7 +61,11 @@ export const LargeView: React.FC = ({ )}
- {bookmark.content && ( + {isArticle && articleSummary ? ( +
+ +
+ ) : bookmark.content && (