antebudimir/feishin
1
0
Fork 0
mirror of https://github.com/antebudimir/feishin.git synced 2025-12-31 10:03:33 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

feat: add context menu on left controls and sidebar image

Browse source
This commit is contained in:
Maxime LAFARIE 2025-09-09 23:38:39 +02:00
parent c36735575f
commit 65ecdc7666
2 changed files with 38 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/renderer/features/player/components/left-controls.tsx
View file

@ -46,6 +46,11 @@ export const LeftControls = () => {
);
const handleToggleFullScreenPlayer = (e?: KeyboardEvent | MouseEvent<HTMLDivElement>) => {
// don't toggle if right click
if (e && 'button' in e && e.button === 2) {
return;
}
e?.stopPropagation();
setFullScreenPlayerStore({ expanded: !isFullScreenPlayerExpanded });
};
@ -55,6 +60,15 @@ export const LeftControls = () => {
setSideBar({ image: true });
};
const handleToggleContextMenu = (e: MouseEvent<HTMLDivElement>) => {
e.preventDefault();
e.stopPropagation();
if (isSongDefined && !isFullScreenPlayerExpanded) {
handleGeneralContextMenu(e, [currentSong!]);
}
};
const stopPropagation = (e?: MouseEvent) => e?.stopPropagation();
useHotkeys([
@ -79,6 +93,7 @@ export const LeftControls = () => {
initial={{ opacity: 0, x: -50 }}
key="playerbar-image"
onClick={handleToggleFullScreenPlayer}
onContextMenu={handleToggleContextMenu}
role="button"
transition={{ duration: 0.2, ease: 'easeIn' }}
>
@ -127,6 +142,7 @@ export const LeftControls = () => {
component={Link}
fw={500}
isLink
onContextMenu={handleToggleContextMenu} // Ajout du clic droit
overflow="hidden"
to={AppRoute.NOW_PLAYING}
>

25
src/renderer/features/sidebar/components/sidebar.tsx
View file

@ -1,11 +1,13 @@
import clsx from 'clsx';
import { AnimatePresence, motion } from 'motion/react';
import { CSSProperties, useMemo } from 'react';
import { CSSProperties, MouseEvent, useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { useLocation } from 'react-router-dom';
import styles from './sidebar.module.css';
import { SONG_CONTEXT_MENU_ITEMS } from '/@/renderer/features/context-menu/context-menu-items';
import { useHandleGeneralContextMenu } from '/@/renderer/features/context-menu/hooks/use-handle-context-menu';
import { ActionBar } from '/@/renderer/features/sidebar/components/action-bar';
import { SidebarIcon } from '/@/renderer/features/sidebar/components/sidebar-icon';
import { SidebarItem } from '/@/renderer/features/sidebar/components/sidebar-item';
@ -31,6 +33,7 @@ import { Group } from '/@/shared/components/group/group';
import { ScrollArea } from '/@/shared/components/scroll-area/scroll-area';
import { Text } from '/@/shared/components/text/text';
import { Tooltip } from '/@/shared/components/tooltip/tooltip';
import { LibraryItem } from '/@/shared/types/domain-types';
import { Platform } from '/@/shared/types/types';
export const Sidebar = () => {
@ -39,7 +42,7 @@ export const Sidebar = () => {
const sidebar = useSidebarStore();
const { setSideBar } = useAppStoreActions();
const { sidebarPlaylistList } = useGeneralSettings();
const imageUrl = useCurrentSong()?.imageUrl;
const currentSong = useCurrentSong();
const translatedSidebarItemMap = useMemo(
() => ({
@ -56,12 +59,13 @@ export const Sidebar = () => {
}),
[t],
);
const upsizedImageUrl = imageUrl
const upsizedImageUrl = currentSong?.imageUrl
?.replace(/size=\d+/, 'size=450')
.replace(/width=\d+/, 'width=450')
.replace(/height=\d+/, 'height=450');
const showImage = sidebar.image;
const isSongDefined = Boolean(currentSong?.id);
const setFullScreenPlayerStore = useSetFullScreenPlayerStore();
const { expanded: isFullScreenPlayerExpanded } = useFullScreenPlayerStore();
@ -69,6 +73,20 @@ export const Sidebar = () => {
setFullScreenPlayerStore({ expanded: !isFullScreenPlayerExpanded });
};
const handleGeneralContextMenu = useHandleGeneralContextMenu(
LibraryItem.SONG,
SONG_CONTEXT_MENU_ITEMS,
);
const handleToggleContextMenu = (e: MouseEvent<HTMLDivElement>) => {
e.preventDefault();
e.stopPropagation();
if (isSongDefined && !isFullScreenPlayerExpanded) {
handleGeneralContextMenu(e, [currentSong!]);
}
};
const { sidebarItems } = useGeneralSettings();
const { windowBarStyle } = useWindowSettings();
@ -167,6 +185,7 @@ export const Sidebar = () => {
initial={{ opacity: 0, y: 200 }}
key="sidebar-image"
onClick={expandFullScreenPlayer}
onContextMenu={handleToggleContextMenu}
role="button"
style={
{