diff --git a/CHANGELOG.md b/CHANGELOG.md index e03b3220..ff1817b3 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -127,6 +127,13 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ## Fixed +### Context menu "Play Now" and resize behaviour + +**By [@Psychotoxical](https://github.com/Psychotoxical), PR [#1174](https://github.com/Psychotoxical/psysonic/pull/1174)**, reported by [@peri4ko](https://github.com/peri4ko) + +* On the Playlists page, right-clicking a playlist and choosing "Play Now" only opened the playlist instead of playing it. It now starts playback. +* Resizing the window while a context menu was open could leave the menu stranded and drifting off-screen. The context menu now closes when the window is resized. + ### Artist header showing the plain image instead of the external background **By [@Psychotoxical](https://github.com/Psychotoxical), PR [#1172](https://github.com/Psychotoxical/psysonic/pull/1172)** diff --git a/src/components/ContextMenu.tsx b/src/components/ContextMenu.tsx index d4de40bd..d0ca337c 100644 --- a/src/components/ContextMenu.tsx +++ b/src/components/ContextMenu.tsx @@ -132,6 +132,18 @@ export default function ContextMenu() { } }, [contextMenu.isOpen, contextMenu.x, contextMenu.y]); + // Close on any window resize. The menu is absolutely positioned at fixed + // coordinates, so a resize would otherwise leave it stranded and drifting + // off-screen. Whether a resize closed the menu was inconsistent across + // setups (it stayed open on some Windows and Linux environments); always + // closing it here makes the behaviour the same everywhere. + useEffect(() => { + if (!contextMenu.isOpen) return; + const onResize = () => closeContextMenu(); + window.addEventListener('resize', onResize); + return () => window.removeEventListener('resize', onResize); + }, [contextMenu.isOpen, closeContextMenu]); + useEffect(() => { if (contextMenu.isOpen) { previousFocusRef.current = document.activeElement as HTMLElement | null; diff --git a/src/components/contextMenu/PlaylistContextItems.tsx b/src/components/contextMenu/PlaylistContextItems.tsx index 190ec290..fa233200 100644 --- a/src/components/contextMenu/PlaylistContextItems.tsx +++ b/src/components/contextMenu/PlaylistContextItems.tsx @@ -1,6 +1,5 @@ import { useTranslation } from 'react-i18next'; import { Play, ChevronRight, FolderTree, ListMusic, Trash2 } from 'lucide-react'; -import { useNavigate } from 'react-router-dom'; import type { SubsonicPlaylist } from '../../api/subsonicTypes'; import { usePlaylistStore } from '../../store/playlistStore'; import { MultiPlaylistToPlaylistSubmenu, SinglePlaylistToPlaylistSubmenu } from './PlaylistToPlaylistSubmenus'; @@ -16,7 +15,6 @@ export default function PlaylistContextItems(props: ContextMenuItemsProps) { offlinePolicy, } = props; const { t } = useTranslation(); - const navigate = useNavigate(); return ( <> @@ -24,7 +22,14 @@ export default function PlaylistContextItems(props: ContextMenuItemsProps) { const playlist = item as SubsonicPlaylist; return ( <> -