From c8ae128ac459dbe89f1b490bf51d819e291c69d6 Mon Sep 17 00:00:00 2001
From: jeffvli <jeffvictorli@gmail.com>
Date: Sat, 7 Feb 2026 02:33:31 -0800
Subject: [PATCH] handle imageUrl in drag preview and context menu

---
 .../components/drag-preview/drag-preview.tsx    |  4 +++-
 .../components/context-menu-preview.tsx         | 17 ++---------------
 2 files changed, 5 insertions(+), 16 deletions(-)

diff --git a/src/renderer/components/drag-preview/drag-preview.tsx b/src/renderer/components/drag-preview/drag-preview.tsx
index ba3a5236d..4648dae52 100644
--- a/src/renderer/components/drag-preview/drag-preview.tsx
+++ b/src/renderer/components/drag-preview/drag-preview.tsx
@@ -32,8 +32,10 @@ export const DragPreview = memo(({ data }: DragPreviewProps) => {
     const itemName = firstItem ? getItemName(firstItem) : 'Item';
 
     const itemImage = useItemImageUrl({
-        id: (firstItem as { imageId: string })?.imageId,
+        id: (firstItem as { imageId?: string })?.imageId,
+        imageUrl: (firstItem as { imageUrl?: string })?.imageUrl,
         itemType: data.itemType || LibraryItem.SONG,
+        serverId: (firstItem as { _serverId?: string })?._serverId,
         type: 'table',
     });
 
diff --git a/src/renderer/features/context-menu/components/context-menu-preview.tsx b/src/renderer/features/context-menu/components/context-menu-preview.tsx
index 6bfbd35ab..a2e335b54 100644
--- a/src/renderer/features/context-menu/components/context-menu-preview.tsx
+++ b/src/renderer/features/context-menu/components/context-menu-preview.tsx
@@ -24,29 +24,16 @@ const getItemName = (item: unknown): string => {
     return 'Item';
 };
 
-const getItemImage = (item: unknown): null | string => {
-    if (item && typeof item === 'object') {
-        if ('imageId' in item && typeof item.imageId === 'string') {
-            return item.imageId;
-        }
-
-        if ('imageUrl' in item && typeof item.imageUrl === 'string') {
-            return item.imageUrl;
-        }
-    }
-    return null;
-};
-
 export const ContextMenuPreview = ({ items, itemType }: ContextMenuPreviewProps) => {
     const { t } = useTranslation();
     const itemCount = items.length;
     const firstItem = items[0];
     const itemName = firstItem ? getItemName(firstItem) : 'Item';
-    const itemImage = firstItem ? getItemImage(firstItem) : null;
     const isMultiple = itemCount > 1;
 
     const imageUrl = useItemImageUrl({
         id: (firstItem as { imageId?: string })?.imageId,
+        imageUrl: (firstItem as { imageUrl?: string })?.imageUrl,
         itemType: itemType || LibraryItem.SONG,
         serverId: (firstItem as { _serverId?: string })?._serverId,
         type: 'table',
@@ -61,7 +48,7 @@ export const ContextMenuPreview = ({ items, itemType }: ContextMenuPreviewProps)
             <div className={styles.divider} />
             <div className={styles.preview}>
                 <div className={styles.content}>
-                    {itemImage ? (
+                    {imageUrl ? (
                         <div className={styles.imageContainer}>
                             <img alt={itemName} className={styles.image} src={imageUrl} />
                             <div className={styles.imageOverlay} />