Adding a hotkey to jump to the currently playing song (only works without pagination) (#2024)

src/i18n/locales/en.json

@@ -877,6 +877,7 @@
         "hotkey_listPlayLast": "List play last",
         "hotkey_listPlayNext": "List play next",
         "hotkey_listPlayNow": "List play now",
+        "hotkey_listShowPlayingSong": "Show playing song in list",
         "hotkey_navigateHome": "Navigate to home",
         "hotkey_playbackNext": "Next track",
         "hotkey_playbackPause": "Pause",

src/renderer/components/item-list/helpers/use-list-hotkeys.ts

@@ -16,11 +16,13 @@ export const useListHotkeys = ({
     focused,
     internalState,
     itemType,
+    onShowPlayingSong,
 }: {
     controls: ItemControls;
     focused: boolean;
     internalState: ItemListStateActions;
     itemType: LibraryItem;
+    onShowPlayingSong?: () => void;
 }) => {
     const { bindings } = useHotkeySettings();
     const playButtonBehavior = usePlayButtonBehavior();
@@ -119,5 +121,11 @@ export const useListHotkeys = ({
                 }
             },
         ],
+        [
+            bindings.listShowPlayingSong.hotkey,
+            () => {
+                onShowPlayingSong?.();
+            },
+        ],
     ]);
 };

src/renderer/components/item-list/item-table-list/item-table-list.tsx

@@ -66,6 +66,7 @@ import {
     ItemTableListColumnConfig,
 } from '/@/renderer/components/item-list/types';
 import { PlayerContext, usePlayer } from '/@/renderer/features/player/context/player-context';
+import { usePlayerStore } from '/@/renderer/store';
 import { animationProps } from '/@/shared/components/animations/animation-props';
 import { useFocusWithin } from '/@/shared/hooks/use-focus-within';
 import { useMergedRef } from '/@/shared/hooks/use-merged-ref';
@@ -1596,11 +1597,22 @@ const BaseItemTableList = ({
         ],
     );
 
+    const onShowPlayingSong = useCallback(() => {
+        const targetId = usePlayerStore.getState().getCurrentSong()?.id;
+        if (!targetId) return;
+        const index =
+            getItemIndex?.(targetId) ??
+            data.findIndex((item) => (item as null | { id?: string })?.id === targetId);
+        if (index === undefined || index < 0) return;
+        handleRef.current?.scrollToIndex(index, { align: 'center', behavior: 'auto' });
+    }, [data, getItemIndex]);
+
     useListHotkeys({
         controls,
         focused,
         internalState,
         itemType,
+        onShowPlayingSong,
     });
 
     const tableConfigValue = useMemo<ItemTableListConfig>(

src/renderer/features/settings/components/hotkeys/hotkey-manager-settings.tsx

@@ -60,6 +60,7 @@ const BINDINGS_MAP: Record<BindingActions, string> = {
         context: 'listPlayNext',
     }),
     listPlayNow: i18n.t('setting.hotkey', { context: 'listPlayNow' }),
+    listShowPlayingSong: i18n.t('setting.hotkey', { context: 'listShowPlayingSong' }),
     localSearch: i18n.t('setting.hotkey', { context: 'localSearch' }),
     navigateHome: i18n.t('setting.hotkey', {
         context: 'navigateHome',

src/renderer/store/settings.store.ts

@@ -160,6 +160,7 @@ const BindingActionsSchema = z.enum([
     'listPlayNext',
     'listPlayLast',
     'listNavigateToPage',
+    'listShowPlayingSong',
 ]);
 
 const DiscordDisplayTypeSchema = z.enum(['artist', 'feishin', 'song']);
@@ -763,6 +764,7 @@ export enum BindingActions {
     LIST_PLAY_LAST = 'listPlayLast',
     LIST_PLAY_NEXT = 'listPlayNext',
     LIST_PLAY_NOW = 'listPlayNow',
+    LIST_SHOW_PLAYING_SONG = 'listShowPlayingSong',
     LOCAL_SEARCH = 'localSearch',
     MUTE = 'volumeMute',
     NAVIGATE_HOME = 'navigateHome',
@@ -1217,6 +1219,7 @@ const initialState: SettingsState = {
             listPlayLast: { allowGlobal: false, hotkey: '', isGlobal: false },
             listPlayNext: { allowGlobal: false, hotkey: '', isGlobal: false },
             listPlayNow: { allowGlobal: false, hotkey: '', isGlobal: false },
+            listShowPlayingSong: { allowGlobal: false, hotkey: 'mod+l', isGlobal: false },
             localSearch: { allowGlobal: false, hotkey: 'mod+f', isGlobal: false },
             navigateHome: { allowGlobal: false, hotkey: '', isGlobal: false },
             next: { allowGlobal: true, hotkey: '', isGlobal: false },