diff --git a/src/renderer/components/hotbar/hotbar-icon.scss b/src/renderer/components/hotbar/hotbar-icon.scss index 57c5ed8928..225a054011 100644 --- a/src/renderer/components/hotbar/hotbar-icon.scss +++ b/src/renderer/components/hotbar/hotbar-icon.scss @@ -49,6 +49,10 @@ cursor: default; filter: grayscale(0.7); + &.contextMenuAvailable { + cursor: context-menu; + } + &:hover { &:not(.active) { box-shadow: none; diff --git a/src/renderer/components/hotbar/hotbar-icon.tsx b/src/renderer/components/hotbar/hotbar-icon.tsx index a24e9bb237..b739fa2b4c 100644 --- a/src/renderer/components/hotbar/hotbar-icon.tsx +++ b/src/renderer/components/hotbar/hotbar-icon.tsx @@ -95,7 +95,7 @@ export const HotbarIcon = observer(({menuItems = [], size = 40, ...props}: Hotba }; return ( -
+
0 })}>
{renderIcon()} @@ -110,19 +110,17 @@ export const HotbarIcon = observer(({menuItems = [], size = 40, ...props}: Hotba toggleEvent="contextmenu" position={{right: true, bottom: true }} // FIXME: position does not work open={() => { - if (!disabled) { - onMenuOpen?.(); - toggleMenu(); - } + onMenuOpen?.(); + toggleMenu(); }} close={() => toggleMenu()}> - { menuItems.map((menuItem) => { - return ( - onMenuItemClick(menuItem) }> + { + menuItems.map((menuItem) => ( + onMenuItemClick(menuItem)}> {menuItem.title} - ); - })} + )) + }
); diff --git a/src/renderer/components/hotbar/hotbar-menu.tsx b/src/renderer/components/hotbar/hotbar-menu.tsx index e9be18990f..dd7267f213 100644 --- a/src/renderer/components/hotbar/hotbar-menu.tsx +++ b/src/renderer/components/hotbar/hotbar-menu.tsx @@ -27,7 +27,7 @@ import { HotbarEntityIcon } from "./hotbar-entity-icon"; import { cssNames, IClassName } from "../../utils"; import { catalogEntityRegistry } from "../../api/catalog-entity-registry"; import { defaultHotbarCells, HotbarItem, HotbarStore } from "../../../common/hotbar-store"; -import { CatalogEntity, CatalogEntityContextMenu, catalogEntityRunContext } from "../../api/catalog-entity"; +import { CatalogEntity, catalogEntityRunContext } from "../../api/catalog-entity"; import { DragDropContext, Draggable, Droppable, DropResult } from "react-beautiful-dnd"; import { HotbarSelector } from "./hotbar-selector"; import { HotbarCell } from "./hotbar-cell"; @@ -110,12 +110,6 @@ export class HotbarMenu extends React.Component { renderGrid() { return this.items.map((item, index) => { const entity = this.getEntity(item); - const disabledMenuItems: CatalogEntityContextMenu[] = [ - { - title: "Unpin from Hotbar", - onClick: () => this.removeItem(item.entity.uid) - } - ]; return ( @@ -163,7 +157,12 @@ export class HotbarMenu extends React.Component { uid={`hotbar-icon-${item.entity.uid}`} title={item.entity.name} source={item.entity.source} - menuItems={disabledMenuItems} + menuItems={[ + { + title: "Unpin from Hotbar", + onClick: () => this.removeItem(item.entity.uid) + } + ]} disabled size={40} />