vanja/feishin
1
0
Fork 0
mirror of https://github.com/jeffvli/feishin.git synced 2026-05-07 04:20:12 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix image on context menu preview

Browse Source
This commit is contained in:
jeffvli
2025-12-27 14:25:57 -08:00
parent a7c2a92f16
commit 856400048b
12 changed files with 57 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/components/item-image/item-image.tsx
+34 -3
View File
@@ -2,7 +2,12 @@ import { memo, useMemo } from 'react';
import z from 'zod';
import { api } from '/@/renderer/api';
import { GeneralSettingsSchema, useCurrentServerId, useSettingsStore } from '/@/renderer/store';
import {
GeneralSettingsSchema,
useAuthStore,
useCurrentServerId,
useSettingsStore,
} from '/@/renderer/store';
import { BaseImage, ImageProps } from '/@/shared/components/image/image';
import { LibraryItem } from '/@/shared/types/domain-types';
@@ -27,6 +32,7 @@ interface UseItemImageUrlProps {
id?: string;
imageUrl?: null | string;
itemType: LibraryItem;
serverId?: string;
size?: number;
type?: keyof z.infer<typeof GeneralSettingsSchema>['imageRes'];
}
@@ -49,9 +55,34 @@ export const useItemImageUrl = (args: UseItemImageUrlProps) => {
return (
api.controller.getImageUrl({
apiClientProps: { serverId },
apiClientProps: { serverId: args.serverId || serverId },
query: { id, itemType, size: size ?? sizeByType },
}) || undefined
);
}, [id, imageUrl, itemType, serverId, size, sizeByType]);
}, [args.serverId, id, imageUrl, itemType, serverId, size, sizeByType]);
};
export function getItemImageUrl(args: UseItemImageUrlProps) {
const { id, imageUrl, itemType, size, type } = args;
const authStore = useAuthStore.getState();
const currentServerId = authStore.currentServer?.id;
const serverId = (args.serverId || currentServerId) as string;
const imageRes = useSettingsStore.getState().general.imageRes;
const sizeByType: number | undefined = type ? imageRes[type] : undefined;
if (imageUrl) {
return imageUrl;
}
if (!id) {
return undefined;
}
return (
api.controller.getImageUrl({
apiClientProps: { serverId },
query: { id, itemType, size: size ?? sizeByType },
}) || undefined
);
}
src/shared/components/context-menu/context-menu-preview.module.css → src/renderer/features/context-menu/components/context-menu-preview.module.css
View File
src/shared/components/context-menu/context-menu-preview.tsx → src/renderer/features/context-menu/components/context-menu-preview.tsx
+14 -4
View File
@@ -1,8 +1,8 @@
import { memo } from 'react';
import { useTranslation } from 'react-i18next';
import styles from './context-menu-preview.module.css';
import { useItemImageUrl } from '/@/renderer/components/item-image/item-image';
import { Icon } from '/@/shared/components/icon/icon';
import { Text } from '/@/shared/components/text/text';
import { LibraryItem } from '/@/shared/types/domain-types';
@@ -26,6 +26,10 @@ const getItemName = (item: unknown): string => {
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;
}
@@ -33,7 +37,7 @@ const getItemImage = (item: unknown): null | string => {
return null;
};
export const ContextMenuPreview = memo(({ items, itemType }: ContextMenuPreviewProps) => {
export const ContextMenuPreview = ({ items, itemType }: ContextMenuPreviewProps) => {
const { t } = useTranslation();
const itemCount = items.length;
const firstItem = items[0];
@@ -41,6 +45,12 @@ export const ContextMenuPreview = memo(({ items, itemType }: ContextMenuPreviewP
const itemImage = firstItem ? getItemImage(firstItem) : null;
const isMultiple = itemCount > 1;
const imageUrl = useItemImageUrl({
id: (firstItem as { imageId?: string })?.imageId,
itemType: itemType || LibraryItem.SONG,
type: 'table',
});
if (itemCount === 0) {
return null;
}
@@ -52,7 +62,7 @@ export const ContextMenuPreview = memo(({ items, itemType }: ContextMenuPreviewP
<div className={styles.content}>
{itemImage ? (
<div className={styles.imageContainer}>
<img alt={itemName} className={styles.image} src={itemImage} />
<img alt={itemName} className={styles.image} src={imageUrl} />
<div className={styles.imageOverlay} />
</div>
) : (
@@ -85,6 +95,6 @@ export const ContextMenuPreview = memo(({ items, itemType }: ContextMenuPreviewP
</div>
</div>
);
});
};
ContextMenuPreview.displayName = 'ContextMenuPreview';
src/renderer/features/context-menu/menus/album-artist-context-menu.tsx
+1 -1
View File
@@ -9,8 +9,8 @@ import { PlayArtistRadioAction } from '/@/renderer/features/context-menu/actions
import { SetFavoriteAction } from '/@/renderer/features/context-menu/actions/set-favorite-action';
import { SetRatingAction } from '/@/renderer/features/context-menu/actions/set-rating-action';
import { ShareAction } from '/@/renderer/features/context-menu/actions/share-action';
import { ContextMenuPreview } from '/@/renderer/features/context-menu/components/context-menu-preview';
import { ContextMenu } from '/@/shared/components/context-menu/context-menu';
import { ContextMenuPreview } from '/@/shared/components/context-menu/context-menu-preview';
import { AlbumArtist, LibraryItem } from '/@/shared/types/domain-types';
interface AlbumArtistContextMenuProps {
src/renderer/features/context-menu/menus/album-context-menu.tsx
+1 -1
View File
@@ -8,8 +8,8 @@ import { PlayAction } from '/@/renderer/features/context-menu/actions/play-actio
import { SetFavoriteAction } from '/@/renderer/features/context-menu/actions/set-favorite-action';
import { SetRatingAction } from '/@/renderer/features/context-menu/actions/set-rating-action';
import { ShareAction } from '/@/renderer/features/context-menu/actions/share-action';
import { ContextMenuPreview } from '/@/renderer/features/context-menu/components/context-menu-preview';
import { ContextMenu } from '/@/shared/components/context-menu/context-menu';
import { ContextMenuPreview } from '/@/shared/components/context-menu/context-menu-preview';
import { Album, LibraryItem } from '/@/shared/types/domain-types';
interface AlbumContextMenuProps {
src/renderer/features/context-menu/menus/artist-context-menu.tsx
+1 -1
View File
@@ -9,8 +9,8 @@ import { PlayArtistRadioAction } from '/@/renderer/features/context-menu/actions
import { SetFavoriteAction } from '/@/renderer/features/context-menu/actions/set-favorite-action';
import { SetRatingAction } from '/@/renderer/features/context-menu/actions/set-rating-action';
import { ShareAction } from '/@/renderer/features/context-menu/actions/share-action';
import { ContextMenuPreview } from '/@/renderer/features/context-menu/components/context-menu-preview';
import { ContextMenu } from '/@/shared/components/context-menu/context-menu';
import { ContextMenuPreview } from '/@/shared/components/context-menu/context-menu-preview';
import { Artist, LibraryItem } from '/@/shared/types/domain-types';
interface ArtistContextMenuProps {
src/renderer/features/context-menu/menus/folder-context-menu.tsx
+1 -1
View File
@@ -4,8 +4,8 @@ import { AddToPlaylistAction } from '/@/renderer/features/context-menu/actions/a
import { DownloadAction } from '/@/renderer/features/context-menu/actions/download-action';
import { PlayAction } from '/@/renderer/features/context-menu/actions/play-action';
import { ShareAction } from '/@/renderer/features/context-menu/actions/share-action';
import { ContextMenuPreview } from '/@/renderer/features/context-menu/components/context-menu-preview';
import { ContextMenu } from '/@/shared/components/context-menu/context-menu';
import { ContextMenuPreview } from '/@/shared/components/context-menu/context-menu-preview';
import { Folder, LibraryItem } from '/@/shared/types/domain-types';
interface FolderContextMenuProps {
src/renderer/features/context-menu/menus/genre-context-menu.tsx
+1 -1
View File
@@ -2,8 +2,8 @@ import { useMemo } from 'react';
import { AddToPlaylistAction } from '/@/renderer/features/context-menu/actions/add-to-playlist-action';
import { PlayAction } from '/@/renderer/features/context-menu/actions/play-action';
import { ContextMenuPreview } from '/@/renderer/features/context-menu/components/context-menu-preview';
import { ContextMenu } from '/@/shared/components/context-menu/context-menu';
import { ContextMenuPreview } from '/@/shared/components/context-menu/context-menu-preview';
import { Genre, LibraryItem } from '/@/shared/types/domain-types';
interface GenreContextMenuProps {
src/renderer/features/context-menu/menus/playlist-context-menu.tsx
+1 -1
View File
@@ -5,9 +5,9 @@ import { DeletePlaylistAction } from '/@/renderer/features/context-menu/actions/
import { EditPlaylistAction } from '/@/renderer/features/context-menu/actions/edit-playlist-action';
import { GetInfoAction } from '/@/renderer/features/context-menu/actions/get-info-action';
import { PlayAction } from '/@/renderer/features/context-menu/actions/play-action';
import { ContextMenuPreview } from '/@/renderer/features/context-menu/components/context-menu-preview';
import { usePermissions } from '/@/renderer/store';
import { ContextMenu } from '/@/shared/components/context-menu/context-menu';
import { ContextMenuPreview } from '/@/shared/components/context-menu/context-menu-preview';
import { LibraryItem, Playlist } from '/@/shared/types/domain-types';
interface PlaylistContextMenuProps {
src/renderer/features/context-menu/menus/playlist-song-context-menu.tsx
+1 -1
View File
@@ -10,8 +10,8 @@ import { RemoveFromPlaylistAction } from '/@/renderer/features/context-menu/acti
import { SetFavoriteAction } from '/@/renderer/features/context-menu/actions/set-favorite-action';
import { SetRatingAction } from '/@/renderer/features/context-menu/actions/set-rating-action';
import { ShareAction } from '/@/renderer/features/context-menu/actions/share-action';
import { ContextMenuPreview } from '/@/renderer/features/context-menu/components/context-menu-preview';
import { ContextMenu } from '/@/shared/components/context-menu/context-menu';
import { ContextMenuPreview } from '/@/shared/components/context-menu/context-menu-preview';
import { LibraryItem, Song } from '/@/shared/types/domain-types';
interface PlaylistSongContextMenuProps {
src/renderer/features/context-menu/menus/queue-context-menu.tsx
+1 -1
View File
@@ -11,8 +11,8 @@ import { SetFavoriteAction } from '/@/renderer/features/context-menu/actions/set
import { SetRatingAction } from '/@/renderer/features/context-menu/actions/set-rating-action';
import { ShareAction } from '/@/renderer/features/context-menu/actions/share-action';
import { ShuffleItemsAction } from '/@/renderer/features/context-menu/actions/shuffle-items-action';
import { ContextMenuPreview } from '/@/renderer/features/context-menu/components/context-menu-preview';
import { ContextMenu } from '/@/shared/components/context-menu/context-menu';
import { ContextMenuPreview } from '/@/shared/components/context-menu/context-menu-preview';
import { LibraryItem, QueueSong } from '/@/shared/types/domain-types';
interface QueueContextMenuProps {
src/renderer/features/context-menu/menus/song-context-menu.tsx
+1 -1
View File
@@ -9,8 +9,8 @@ import { PlayTrackRadioAction } from '/@/renderer/features/context-menu/actions/
import { SetFavoriteAction } from '/@/renderer/features/context-menu/actions/set-favorite-action';
import { SetRatingAction } from '/@/renderer/features/context-menu/actions/set-rating-action';
import { ShareAction } from '/@/renderer/features/context-menu/actions/share-action';
import { ContextMenuPreview } from '/@/renderer/features/context-menu/components/context-menu-preview';
import { ContextMenu } from '/@/shared/components/context-menu/context-menu';
import { ContextMenuPreview } from '/@/shared/components/context-menu/context-menu-preview';
import { LibraryItem, Song } from '/@/shared/types/domain-types';
interface SongContextMenuProps {