hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

add tooltip to hotbar index

Browse Source 
Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>
This commit is contained in:
Jari Kolehmainen 2021-04-23 10:21:18 +03:00
parent b20bedfbae
commit e6310cb4a4
1 changed files with 9 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/renderer/components/hotbar/hotbar-menu.tsx
View File

@ -12,6 +12,7 @@ import { Icon } from "../icon";
import { Badge } from "../badge"; import { Badge } from "../badge";
import { CommandOverlay } from "../command-palette"; import { CommandOverlay } from "../command-palette";
import { HotbarSwitchCommand } from "./hotbar-switch-command"; import { HotbarSwitchCommand } from "./hotbar-switch-command";
import { Tooltip, TooltipPosition } from "../tooltip";
interface Props { interface Props {
className?: IClassName; className?: IClassName;
@ -43,6 +44,7 @@ export class HotbarMenu extends React.Component<Props> {
render() { render() {
const { className } = this.props; const { className } = this.props;
const hotbar = HotbarStore.getInstance();
const hotbarIndex = HotbarStore.getInstance().activeHotbarIndex + 1; const hotbarIndex = HotbarStore.getInstance().activeHotbarIndex + 1;
return ( return (
@ -63,7 +65,13 @@ export class HotbarMenu extends React.Component<Props> {
<div className="HotbarSelector flex gaps auto"> <div className="HotbarSelector flex gaps auto">
<Icon material="chevron_left" className="previous box" onClick={() => this.previous()} /> <Icon material="chevron_left" className="previous box" onClick={() => this.previous()} />
<div className="box"> <div className="box">
<Badge small label={hotbarIndex} onClick={() => this.openSelector()} /> <Badge id="hotbarIndex" small label={hotbarIndex} onClick={() => this.openSelector()} />
<Tooltip
targetId="hotbarIndex"
preferredPositions={TooltipPosition.TOP}
>
{hotbar.name}
</Tooltip>
</div> </div>
<Icon material="chevron_right" className="next box" onClick={() => this.next()} /> <Icon material="chevron_right" className="next box" onClick={() => this.next()} />
</div> </div>