diff --git a/src/renderer/features/context-menu/context-menu-items.tsx b/src/renderer/features/context-menu/context-menu-items.tsx
index 014a64f6..a0eefa0b 100644
--- a/src/renderer/features/context-menu/context-menu-items.tsx
+++ b/src/renderer/features/context-menu/context-menu-items.tsx
@@ -3,7 +3,7 @@ import { SetContextMenuItems } from '/@/renderer/features/context-menu/events';
export const SONG_CONTEXT_MENU_ITEMS: SetContextMenuItems = [
{ id: 'play' },
{ id: 'playLast' },
- { id: 'playNext' },
+ { divider: true, id: 'playNext' },
{ disabled: true, id: 'addToPlaylist' },
{ disabled: true, id: 'addToFavorites' },
{ disabled: true, id: 'removeFromFavorites' },
@@ -13,7 +13,7 @@ export const SONG_CONTEXT_MENU_ITEMS: SetContextMenuItems = [
export const ALBUM_CONTEXT_MENU_ITEMS: SetContextMenuItems = [
{ id: 'play' },
{ id: 'playLast' },
- { id: 'playNext' },
+ { divider: true, id: 'playNext' },
{ disabled: true, id: 'addToPlaylist' },
{ disabled: true, id: 'addToFavorites' },
{ disabled: true, id: 'removeFromFavorites' },
@@ -23,7 +23,7 @@ export const ALBUM_CONTEXT_MENU_ITEMS: SetContextMenuItems = [
export const ARTIST_CONTEXT_MENU_ITEMS: SetContextMenuItems = [
{ id: 'play' },
{ id: 'playLast' },
- { id: 'playNext' },
+ { divider: true, id: 'playNext' },
{ disabled: true, id: 'addToPlaylist' },
{ disabled: true, id: 'addToFavorites' },
{ disabled: true, id: 'removeFromFavorites' },
diff --git a/src/renderer/features/context-menu/context-menu-provider.tsx b/src/renderer/features/context-menu/context-menu-provider.tsx
index 6fd306eb..0ac9d6d9 100644
--- a/src/renderer/features/context-menu/context-menu-provider.tsx
+++ b/src/renderer/features/context-menu/context-menu-provider.tsx
@@ -1,6 +1,6 @@
-import { Stack } from '@mantine/core';
+import { Divider, Stack } from '@mantine/core';
import { useClickOutside, useResizeObserver, useSetState, useViewportSize } from '@mantine/hooks';
-import { createContext, useState } from 'react';
+import { createContext, Fragment, useState } from 'react';
import { ContextMenu, ContextMenuButton } from '/@/renderer/components';
import {
OpenContextMenuProps,
@@ -48,7 +48,6 @@ export const ContextMenuProvider = ({ children }: ContextMenuProviderProps) => {
const handlePlayQueueAdd = useHandlePlayQueueAdd();
const openContextMenu = (args: OpenContextMenuProps) => {
- console.log('args.data', args.data);
const { xPos, yPos, menuItems, data, type } = args;
const shouldReverseY = yPos + menuRect.height > viewport.height;
@@ -114,12 +113,12 @@ export const ContextMenuProvider = ({ children }: ContextMenuProviderProps) => {
},
playLast: {
id: 'playLast',
- label: 'Play Last',
+ label: 'Add to queue (last)',
onClick: () => handlePlay(Play.LAST),
},
playNext: {
id: 'playNext',
- label: 'Play Next',
+ label: 'Add to queue (next)',
onClick: () => handlePlay(Play.NEXT),
},
removeFromFavorites: {
@@ -151,14 +150,16 @@ export const ContextMenuProvider = ({ children }: ContextMenuProviderProps) => {
>
{ctx.menuItems?.map((item) => {
return (
-
- {contextMenuItems[item.id].label}
-
+
+
+ {contextMenuItems[item.id as keyof typeof contextMenuItems].label}
+
+ {item.divider && }
+
);
})}
diff --git a/src/renderer/features/context-menu/events.ts b/src/renderer/features/context-menu/events.ts
index 60396b4d..460a2807 100644
--- a/src/renderer/features/context-menu/events.ts
+++ b/src/renderer/features/context-menu/events.ts
@@ -25,6 +25,7 @@ export type ContextMenuItem =
export type SetContextMenuItems = {
disabled?: boolean;
+ divider?: boolean;
id: ContextMenuItem;
onClick?: () => void;
}[];