diff --git a/src/renderer/events/events.ts b/src/renderer/events/events.ts index 251270fb2..29d745b68 100644 --- a/src/renderer/events/events.ts +++ b/src/renderer/events/events.ts @@ -1,6 +1,11 @@ import { LibraryItem, Song } from '/@/shared/types/domain-types'; +export type AutoDJQueueAddedEventPayload = { + songCount: number; +}; + export type EventMap = { + AUTODJ_QUEUE_ADDED: AutoDJQueueAddedEventPayload; ITEM_LIST_REFRESH: ItemListRefreshEventPayload; ITEM_LIST_UPDATE_ITEM: ItemListUpdateItemEventPayload; MEDIA_NEXT: MediaNextEventPayload; diff --git a/src/renderer/features/now-playing/components/play-queue.tsx b/src/renderer/features/now-playing/components/play-queue.tsx index a11446ef7..c7494cb17 100644 --- a/src/renderer/features/now-playing/components/play-queue.tsx +++ b/src/renderer/features/now-playing/components/play-queue.tsx @@ -11,16 +11,20 @@ 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 { 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 { + isShuffleEnabled, + mapShuffledToQueueIndex, subscribeCurrentTrack, subscribePlayerQueue, useListSettings, usePlayerActions, usePlayerQueueType, usePlayerSong, + usePlayerStore, useSettingsStore, } from '/@/renderer/store'; import { Flex } from '/@/shared/components/flex/flex'; @@ -101,11 +105,35 @@ export const PlayQueue = forwardRef(({ listKey, sear } }); + const handleAutoDJQueueAdded = () => { + if (followCurrentSong) { + const state = usePlayerStore.getState(); + let index = state.player.index; + + if (isShuffleEnabled(state)) { + index = mapShuffledToQueueIndex(index, state.queue.shuffled); + } + + if (index !== -1) { + // Use setTimeout to ensure the DOM has updated with the new queue items + setTimeout(() => { + tableRef.current?.scrollToIndex(index, { + align: 'center', + behavior: 'auto', + }); + }, 0); + } + } + }; + + eventEmitter.on('AUTODJ_QUEUE_ADDED', handleAutoDJQueueAdded); + setQueue(); return () => { unsub(); unsubCurrentTrack(); + eventEmitter.off('AUTODJ_QUEUE_ADDED', handleAutoDJQueueAdded); }; }, [getQueue, queueType, tableRef, followCurrentSong]); diff --git a/src/renderer/features/player/hooks/use-auto-dj.ts b/src/renderer/features/player/hooks/use-auto-dj.ts index 6db619a83..8b00df7ab 100644 --- a/src/renderer/features/player/hooks/use-auto-dj.ts +++ b/src/renderer/features/player/hooks/use-auto-dj.ts @@ -2,6 +2,7 @@ import { useQueryClient } from '@tanstack/react-query'; import { useEffect } from 'react'; import { queryKeys } from '/@/renderer/api/query-keys'; +import { eventEmitter } from '/@/renderer/events/event-emitter'; import { useIsPlayerFetching, usePlayer } from '/@/renderer/features/player/context/player-context'; import { songsQueries } from '/@/renderer/features/songs/api/songs-api'; import { @@ -198,6 +199,11 @@ export const useAutoDJ = () => { // Add to the end of the queue player.addToQueueByData(songsToAdd, Play.LAST); + + // Emit event to trigger queue follow + eventEmitter.emit('AUTODJ_QUEUE_ADDED', { + songCount: songsToAdd.length, + }); } catch (error) { logFn.error(logMsg[LogCategory.PLAYER].autoPlayFailed, { category: LogCategory.PLAYER,