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

Merge pull request #1122 from jeffvli/properly-handle-context-menu-close

Browse source 
fix(context menu): Properly handle click outside, and show initial rating
This commit is contained in:
Jeff 2025-09-10 20:39:31 -07:00 • committed by GitHub
commit 479aa2e22d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 21 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

36
src/renderer/features/context-menu/context-menu-provider.tsx
View file

@ -103,19 +103,7 @@ export const ContextMenuProvider = ({ children }: ContextMenuProviderProps) => {
const { t } = useTranslation(); const { t } = useTranslation();
const [opened, setOpened] = useState(false); const [opened, setOpened] = useState(false);
const [contextMenuRef, setContextMenuRef] = useState<HTMLDivElement | null>(null); const clickOutsideRef = useClickOutside(() => setOpened(false), ['mousedown', 'touchstart']);
const [ratingsRef, setRatingsRef] = useState<HTMLDivElement | null>(null);
const [rating, setRating] = useState<number>(0);
useEffect(() => {
setRating(0);
}, [opened]);
const clickOutsideRef = useClickOutside(
() => setOpened(false),
['mousedown', 'touchstart'],
[contextMenuRef, ratingsRef],
);
const viewport = useViewportSize(); const viewport = useViewportSize();
const server = useCurrentServer(); const server = useCurrentServer();
@ -132,6 +120,24 @@ export const ContextMenuProvider = ({ children }: ContextMenuProviderProps) => {
yPos: 0, yPos: 0,
}); });
const [rating, setRating] = useState<number>(0);
useEffect(() => {
if (opened && ctx.data.length > 0) {
if (ctx.data.length === 1) {
setRating(ctx.data[0].userRating ?? 0);
} else {
const firstRating = ctx.data[0].userRating ?? 0;
const allSameRating = ctx.data.every(
(item) => (item.userRating ?? 0) === firstRating,
);
setRating(allSameRating ? firstRating : 0);
}
} else {
setRating(0);
}
}, [ctx.data, opened]);
const handlePlayQueueAdd = usePlayQueueAdd(); const handlePlayQueueAdd = usePlayQueueAdd();
const navigate = useNavigate(); const navigate = useNavigate();
@ -882,7 +888,7 @@ export const ContextMenuProvider = ({ children }: ContextMenuProviderProps) => {
leftIcon: <Icon icon="star" />, leftIcon: <Icon icon="star" />,
onClick: () => {}, onClick: () => {},
rightIcon: ( rightIcon: (
<Group ref={setRatingsRef as any}> <Group>
<Rating <Rating
onChange={(e) => { onChange={(e) => {
handleUpdateRating(e); handleUpdateRating(e);
@ -950,7 +956,7 @@ export const ContextMenuProvider = ({ children }: ContextMenuProviderProps) => {
<AnimatePresence> <AnimatePresence>
{opened && ( {opened && (
<ContextMenu minWidth={125} ref={mergedRef} xPos={ctx.xPos} yPos={ctx.yPos}> <ContextMenu minWidth={125} ref={mergedRef} xPos={ctx.xPos} yPos={ctx.yPos}>
<Stack gap={0} ref={setContextMenuRef}> <Stack gap={0}>
<Stack gap={0} onClick={closeContextMenu}> <Stack gap={0} onClick={closeContextMenu}>
{ctx.menuItems?.map((item) => { {ctx.menuItems?.map((item) => {
return ( return (