1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

Toggle app context menu on windows and linux

Signed-off-by: Sebastian Malton <sebastian@malton.name>
This commit is contained in:
Sebastian Malton 2022-01-24 15:11:35 -05:00
parent 2665cfc594
commit bb905bc0e5
3 changed files with 21 additions and 4 deletions

View File

@ -20,6 +20,7 @@ import { withInjectables } from "@ogre-tools/injectable-react";
import type { TopBarRegistration } from "./top-bar-registration"; import type { TopBarRegistration } from "./top-bar-registration";
import { emitOpenAppMenuAsContextMenu, requestWindowAction } from "../../../ipc"; import { emitOpenAppMenuAsContextMenu, requestWindowAction } from "../../../ipc";
import { WindowAction } from "../../../../common/ipc/window"; import { WindowAction } from "../../../../common/ipc/window";
import { useToggle } from "../../../hooks";
interface Props extends React.HTMLAttributes<any> {} interface Props extends React.HTMLAttributes<any> {}
@ -39,10 +40,15 @@ ipcRendererOn("history:can-go-forward", (event, state: boolean) => {
}); });
const NonInjectedTopBar = (({ items, children, ...rest }: Props & Dependencies) => { const NonInjectedTopBar = (({ items, children, ...rest }: Props & Dependencies) => {
const [isAppContextMenuOpen, toggleIsAppContextMenuOpen] = useToggle(false);
const elem = useRef<HTMLDivElement>(); const elem = useRef<HTMLDivElement>();
const openContextMenu = () => { const toggleAppContextMenu = () => {
toggleIsAppContextMenuOpen();
if (isAppContextMenuOpen) {
emitOpenAppMenuAsContextMenu(); emitOpenAppMenuAsContextMenu();
}
}; };
const goHome = () => { const goHome = () => {
@ -85,7 +91,7 @@ const NonInjectedTopBar = (({ items, children, ...rest }: Props & Dependencies)
<div className={styles.tools}> <div className={styles.tools}>
{(isWindows || isLinux) && ( {(isWindows || isLinux) && (
<div className={styles.winMenu}> <div className={styles.winMenu}>
<div onClick={openContextMenu} data-testid="window-menu"> <div onClick={toggleAppContextMenu} data-testid="window-menu">
<svg width="12" height="12" viewBox="0 0 12 12" shapeRendering="crispEdges"><path fill="currentColor" d="M0,8.5h12v1H0V8.5z"/><path fill="currentColor" d="M0,5.5h12v1H0V5.5z"/><path fill="currentColor" d="M0,2.5h12v1H0V2.5z"/></svg> <svg width="12" height="12" viewBox="0 0 12 12" shapeRendering="crispEdges"><path fill="currentColor" d="M0,8.5h12v1H0V8.5z"/><path fill="currentColor" d="M0,5.5h12v1H0V5.5z"/><path fill="currentColor" d="M0,2.5h12v1H0V2.5z"/></svg>
</div> </div>
</div> </div>
@ -153,7 +159,6 @@ const renderRegisteredItems = (items: TopBarRegistration[]) => (
export const TopBar = withInjectables(observer(NonInjectedTopBar), { export const TopBar = withInjectables(observer(NonInjectedTopBar), {
getProps: (di, props) => ({ getProps: (di, props) => ({
items: di.inject(topBarItemsInjectable), items: di.inject(topBarItemsInjectable),
...props, ...props,
}), }),
}); });

View File

@ -8,3 +8,4 @@
export * from "./useOnUnmount"; export * from "./useOnUnmount";
export * from "./useInterval"; export * from "./useInterval";
export * from "./useMutationObserver"; export * from "./useMutationObserver";
export * from "./use-toggle";

View File

@ -0,0 +1,11 @@
/**
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import { useState } from "react";
export function useToggle(initial: boolean): [value: boolean, toggle: () => void] {
const [val, setVal] = useState(initial);
return [val, () => setVal(!val)];
}