mirror of
https://github.com/lensapp/lens.git
synced 2025-05-20 05:10:56 +00:00
HotbarIcon's refering to unknown entities should be removalable
Signed-off-by: Sebastian Malton <sebastian@malton.name>
This commit is contained in:
parent
4e235a95a1
commit
2024dd9412
@ -44,9 +44,8 @@
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
&.disabled,&.inactive {
|
||||
opacity: 0.4;
|
||||
cursor: default;
|
||||
filter: grayscale(0.7);
|
||||
|
||||
&:hover {
|
||||
@ -56,6 +55,14 @@
|
||||
}
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
&.inactive {
|
||||
cursor: context-menu;
|
||||
}
|
||||
|
||||
&.isDragging {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
@ -43,6 +43,7 @@ export interface HotbarIconProps extends DOMAttributes<HTMLElement> {
|
||||
active?: boolean;
|
||||
menuItems?: CatalogEntityContextMenu[];
|
||||
disabled?: boolean;
|
||||
inactive?: boolean;
|
||||
size?: number;
|
||||
background?: string;
|
||||
}
|
||||
@ -65,7 +66,7 @@ function onMenuItemClick(menuItem: CatalogEntityContextMenu) {
|
||||
}
|
||||
|
||||
export const HotbarIcon = observer(({menuItems = [], size = 40, ...props}: HotbarIconProps) => {
|
||||
const { uid, title, src, material, active, className, source, disabled, onMenuOpen, onClick, children, ...rest } = props;
|
||||
const { uid, title, src, material, active, className, source, disabled, onMenuOpen, onClick, inactive, children, ...rest } = props;
|
||||
const id = `hotbarIcon-${uid}`;
|
||||
const [menuOpen, setMenuOpen] = useState(false);
|
||||
|
||||
@ -95,7 +96,7 @@ export const HotbarIcon = observer(({menuItems = [], size = 40, ...props}: Hotba
|
||||
};
|
||||
|
||||
return (
|
||||
<div className={cssNames("HotbarIcon flex", className, { disabled })}>
|
||||
<div className={cssNames("HotbarIcon flex", className, { disabled, inactive })}>
|
||||
<MaterialTooltip title={`${title || "unknown"} (${source || "unknown"})`} placement="right">
|
||||
<div id={id}>
|
||||
{renderIcon()}
|
||||
@ -116,13 +117,13 @@ export const HotbarIcon = observer(({menuItems = [], size = 40, ...props}: Hotba
|
||||
}
|
||||
}}
|
||||
close={() => toggleMenu()}>
|
||||
{ menuItems.map((menuItem) => {
|
||||
return (
|
||||
<MenuItem key={menuItem.title} onClick={() => onMenuItemClick(menuItem) }>
|
||||
{
|
||||
menuItems.map((menuItem) => (
|
||||
<MenuItem key={menuItem.title} onClick={() => onMenuItemClick(menuItem)}>
|
||||
{menuItem.title}
|
||||
</MenuItem>
|
||||
);
|
||||
})}
|
||||
))
|
||||
}
|
||||
</Menu>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -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<Props> {
|
||||
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 (
|
||||
<Droppable droppableId={`${index}`} key={index}>
|
||||
@ -163,8 +157,13 @@ export class HotbarMenu extends React.Component<Props> {
|
||||
uid={`hotbar-icon-${item.entity.uid}`}
|
||||
title={item.entity.name}
|
||||
source={item.entity.source}
|
||||
menuItems={disabledMenuItems}
|
||||
disabled
|
||||
menuItems={[
|
||||
{
|
||||
title: "Unpin from Hotbar",
|
||||
onClick: () => this.removeItem(item.entity.uid)
|
||||
}
|
||||
]}
|
||||
inactive
|
||||
size={40}
|
||||
/>
|
||||
)}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user