diff --git a/src/renderer/features/now-playing/components/play-queue.tsx b/src/renderer/features/now-playing/components/play-queue.tsx index 31120d998..3be248fc8 100644 --- a/src/renderer/features/now-playing/components/play-queue.tsx +++ b/src/renderer/features/now-playing/components/play-queue.tsx @@ -11,17 +11,12 @@ import { } from '/@/renderer/components/item-list/item-table-list/item-table-list'; import { ItemTableListColumn } from '/@/renderer/components/item-list/item-table-list/item-table-list-column'; import { ItemListHandle } from '/@/renderer/components/item-list/types'; -import { eventEmitter } from '/@/renderer/events/event-emitter'; -import { UserFavoriteEventPayload, UserRatingEventPayload } from '/@/renderer/events/events'; import { useIsPlayerFetching, usePlayer } from '/@/renderer/features/player/context/player-context'; import { searchLibraryItems } from '/@/renderer/features/shared/utils'; import { useDragDrop } from '/@/renderer/hooks/use-drag-drop'; import { subscribeCurrentTrack, subscribePlayerQueue, - updateQueueFavorites, - updateQueueRatings, - useCurrentServerId, useListSettings, usePlayerActions, usePlayerQueueType, @@ -49,7 +44,6 @@ export const PlayQueue = forwardRef(({ listKey, sear const mergedRef = useMergedRef(ref, tableRef); const { getQueue } = usePlayerActions(); const queueType = usePlayerQueueType(); - const serverId = useCurrentServerId(); const [debouncedSearchTerm] = useDebouncedValue(searchTerm, 200); @@ -111,33 +105,6 @@ export const PlayQueue = forwardRef(({ listKey, sear }; }, [getQueue, queueType, tableRef]); - // Listen to favorite and rating events to update queue songs - useEffect(() => { - const handleFavorite = (payload: UserFavoriteEventPayload) => { - if (payload.itemType !== LibraryItem.SONG || payload.serverId !== serverId) { - return; - } - - updateQueueFavorites(payload.id, payload.favorite); - }; - - const handleRating = (payload: UserRatingEventPayload) => { - if (payload.itemType !== LibraryItem.SONG || payload.serverId !== serverId) { - return; - } - - updateQueueRatings(payload.id, payload.rating); - }; - - eventEmitter.on('USER_FAVORITE', handleFavorite); - eventEmitter.on('USER_RATING', handleRating); - - return () => { - eventEmitter.off('USER_FAVORITE', handleFavorite); - eventEmitter.off('USER_RATING', handleRating); - }; - }, [serverId]); - const filteredData: QueueSong[] = useMemo(() => { if (debouncedSearchTerm) { const searched = searchLibraryItems(data, debouncedSearchTerm, LibraryItem.SONG); diff --git a/src/renderer/features/player/components/audio-players.tsx b/src/renderer/features/player/components/audio-players.tsx index 5858b3a07..95ab0fb96 100644 --- a/src/renderer/features/player/components/audio-players.tsx +++ b/src/renderer/features/player/components/audio-players.tsx @@ -1,10 +1,48 @@ +import { useEffect } from 'react'; + +import { eventEmitter } from '/@/renderer/events/event-emitter'; +import { UserFavoriteEventPayload, UserRatingEventPayload } from '/@/renderer/events/events'; import { MpvPlayer } from '/@/renderer/features/player/audio-player/mpv-player'; import { WebPlayer } from '/@/renderer/features/player/audio-player/web-player'; -import { usePlaybackType } from '/@/renderer/store'; +import { + updateQueueFavorites, + updateQueueRatings, + useCurrentServerId, + usePlaybackType, +} from '/@/renderer/store'; +import { LibraryItem } from '/@/shared/types/domain-types'; import { PlayerType } from '/@/shared/types/types'; export const AudioPlayers = () => { const playbackType = usePlaybackType(); + const serverId = useCurrentServerId(); + + // Listen to favorite and rating events to update queue songs + useEffect(() => { + const handleFavorite = (payload: UserFavoriteEventPayload) => { + if (payload.itemType !== LibraryItem.SONG || payload.serverId !== serverId) { + return; + } + + updateQueueFavorites(payload.id, payload.favorite); + }; + + const handleRating = (payload: UserRatingEventPayload) => { + if (payload.itemType !== LibraryItem.SONG || payload.serverId !== serverId) { + return; + } + + updateQueueRatings(payload.id, payload.rating); + }; + + eventEmitter.on('USER_FAVORITE', handleFavorite); + eventEmitter.on('USER_RATING', handleRating); + + return () => { + eventEmitter.off('USER_FAVORITE', handleFavorite); + eventEmitter.off('USER_RATING', handleRating); + }; + }, [serverId]); return ( <>