mirror of
https://github.com/antebudimir/feishin.git
synced 2026-01-02 10:53:33 +00:00
Add hotkey controls to relevant pages
This commit is contained in:
parent
d7f24262fd
commit
4c98afb613
6 changed files with 155 additions and 37 deletions
|
|
@ -1,5 +1,6 @@
|
|||
import { MouseEvent } from 'react';
|
||||
import { Flex, Group } from '@mantine/core';
|
||||
import { useHotkeys } from '@mantine/hooks';
|
||||
import { HiOutlineQueueList } from 'react-icons/hi2';
|
||||
import {
|
||||
RiVolumeUpFill,
|
||||
|
|
@ -12,6 +13,7 @@ import {
|
|||
useAppStoreActions,
|
||||
useCurrentServer,
|
||||
useCurrentSong,
|
||||
useHotkeySettings,
|
||||
useMuted,
|
||||
useSidebarStore,
|
||||
useVolume,
|
||||
|
|
@ -30,7 +32,9 @@ export const RightControls = () => {
|
|||
const currentSong = useCurrentSong();
|
||||
const { setSideBar } = useAppStoreActions();
|
||||
const { rightExpanded: isQueueExpanded } = useSidebarStore();
|
||||
const { handleVolumeSlider, handleVolumeWheel, handleMute } = useRightControls();
|
||||
const { bindings } = useHotkeySettings();
|
||||
const { handleVolumeSlider, handleVolumeWheel, handleMute, handleVolumeDown, handleVolumeUp } =
|
||||
useRightControls();
|
||||
|
||||
const updateRatingMutation = useSetRating({});
|
||||
const addToFavoritesMutation = useCreateFavorite({});
|
||||
|
|
@ -94,9 +98,20 @@ export const RightControls = () => {
|
|||
}
|
||||
};
|
||||
|
||||
const handleToggleQueue = () => {
|
||||
setSideBar({ rightExpanded: !isQueueExpanded });
|
||||
};
|
||||
|
||||
const isSongDefined = Boolean(currentSong?.id);
|
||||
const showRating = isSongDefined && server?.type === ServerType.NAVIDROME;
|
||||
|
||||
useHotkeys([
|
||||
[bindings.volumeDown.isGlobal ? '' : bindings.volumeDown.hotkey, handleVolumeDown],
|
||||
[bindings.volumeUp.isGlobal ? '' : bindings.volumeUp.hotkey, handleVolumeUp],
|
||||
[bindings.volumeMute.isGlobal ? '' : bindings.volumeMute.hotkey, handleMute],
|
||||
[bindings.toggleQueue.isGlobal ? '' : bindings.toggleQueue.hotkey, handleToggleQueue],
|
||||
]);
|
||||
|
||||
return (
|
||||
<Flex
|
||||
align="flex-end"
|
||||
|
|
@ -147,7 +162,7 @@ export const RightControls = () => {
|
|||
icon={<HiOutlineQueueList size="1.1rem" />}
|
||||
tooltip={{ label: 'View queue', openDelay: 500 }}
|
||||
variant="secondary"
|
||||
onClick={() => setSideBar({ rightExpanded: !isQueueExpanded })}
|
||||
onClick={handleToggleQueue}
|
||||
/>
|
||||
<Group
|
||||
noWrap
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue