From d7de5ce4675a48c921a4faa7ba48b6800ca3f759 Mon Sep 17 00:00:00 2001 From: Iku-turso Date: Tue, 16 Aug 2022 14:39:40 +0300 Subject: [PATCH] Extract top menu item for window controls as OCP Co-authored-by: Janne Savolainen Signed-off-by: Iku-turso --- ...g-update-using-topbar-button.test.tsx.snap | 6 -- ...dability-using-extension-api.test.tsx.snap | 12 --- ...e-window.global-override-for-injectable.ts | 8 ++ .../toggle-maximize-window.injectable.ts | 4 +- .../navigation-to-home/navigation-to-home.tsx | 16 ++-- ...e-window.global-override-for-injectable.ts | 8 ++ .../close-window}/close-window.injectable.ts | 4 +- ...e-window.global-override-for-injectable.ts | 8 ++ .../maximize-window.injectable.ts | 4 +- ...window-controls-top-bar-item.injectable.ts | 30 +++++++ .../window-controls/window-controls.tsx | 90 +++++++++++++++++++ .../layout/top-bar/top-bar.test.tsx | 6 +- .../components/layout/top-bar/top-bar.tsx | 74 +-------------- src/renderer/getDiForUnitTesting.tsx | 6 -- 14 files changed, 162 insertions(+), 114 deletions(-) create mode 100644 src/renderer/components/layout/top-bar/toggle-maximize-window/toggle-maximize-window.global-override-for-injectable.ts rename src/renderer/components/layout/top-bar/{ => toggle-maximize-window}/toggle-maximize-window.injectable.ts (78%) create mode 100644 src/renderer/components/layout/top-bar/top-bar-items/window-controls/close-window/close-window.global-override-for-injectable.ts rename src/renderer/components/layout/top-bar/{ => top-bar-items/window-controls/close-window}/close-window.injectable.ts (75%) create mode 100644 src/renderer/components/layout/top-bar/top-bar-items/window-controls/maximize-window/maximize-window.global-override-for-injectable.ts rename src/renderer/components/layout/top-bar/{ => top-bar-items/window-controls/maximize-window}/maximize-window.injectable.ts (76%) create mode 100644 src/renderer/components/layout/top-bar/top-bar-items/window-controls/window-controls-top-bar-item.injectable.ts create mode 100644 src/renderer/components/layout/top-bar/top-bar-items/window-controls/window-controls.tsx diff --git a/src/features/application-update/child-features/application-update-using-top-bar/__snapshots__/installing-update-using-topbar-button.test.tsx.snap b/src/features/application-update/child-features/application-update-using-top-bar/__snapshots__/installing-update-using-topbar-button.test.tsx.snap index 4e33733f69..1baec94319 100644 --- a/src/features/application-update/child-features/application-update-using-top-bar/__snapshots__/installing-update-using-topbar-button.test.tsx.snap +++ b/src/features/application-update/child-features/application-update-using-top-bar/__snapshots__/installing-update-using-topbar-button.test.tsx.snap @@ -64,9 +64,6 @@ exports[`encourage user to update when sufficient time passed since update was d -
-
-
-
-
-
; + disabled: IComputedValue; goHome: () => void; } const NonInjectedNavigationToHome = observer(({ - catalogRouteIsActive, + disabled, goHome, }: Dependencies) => ( )); @@ -33,12 +33,12 @@ export const NavigationToHome = withInjectables( { getProps: (di) => ({ - catalogRouteIsActive: di.inject( + disabled: di.inject( routeIsActiveInjectable, - di.inject(catalogRouteInjectable), + di.inject(welcomeRouteInjectable), ), - goHome: di.inject(navigateToCatalogInjectable), + goHome: di.inject(navigateToWelcomeInjectable), }), }, ); diff --git a/src/renderer/components/layout/top-bar/top-bar-items/window-controls/close-window/close-window.global-override-for-injectable.ts b/src/renderer/components/layout/top-bar/top-bar-items/window-controls/close-window/close-window.global-override-for-injectable.ts new file mode 100644 index 0000000000..f8124bbbe5 --- /dev/null +++ b/src/renderer/components/layout/top-bar/top-bar-items/window-controls/close-window/close-window.global-override-for-injectable.ts @@ -0,0 +1,8 @@ +/** + * Copyright (c) OpenLens Authors. All rights reserved. + * Licensed under MIT License. See LICENSE in root directory for more information. + */ +import closeWindowInjectable from "./close-window.injectable"; +import { getGlobalOverrideForFunction } from "../../../../../../../common/test-utils/get-global-override-for-function"; + +export default getGlobalOverrideForFunction(closeWindowInjectable); diff --git a/src/renderer/components/layout/top-bar/close-window.injectable.ts b/src/renderer/components/layout/top-bar/top-bar-items/window-controls/close-window/close-window.injectable.ts similarity index 75% rename from src/renderer/components/layout/top-bar/close-window.injectable.ts rename to src/renderer/components/layout/top-bar/top-bar-items/window-controls/close-window/close-window.injectable.ts index 906cf88427..b49711d01d 100644 --- a/src/renderer/components/layout/top-bar/close-window.injectable.ts +++ b/src/renderer/components/layout/top-bar/top-bar-items/window-controls/close-window/close-window.injectable.ts @@ -3,8 +3,8 @@ * Licensed under MIT License. See LICENSE in root directory for more information. */ import { getInjectable } from "@ogre-tools/injectable"; -import { WindowAction } from "../../../../common/ipc/window"; -import { requestWindowAction } from "../../../ipc"; +import { WindowAction } from "../../../../../../../common/ipc/window"; +import { requestWindowAction } from "../../../../../../ipc"; const closeWindowInjectable = getInjectable({ id: "close-window", diff --git a/src/renderer/components/layout/top-bar/top-bar-items/window-controls/maximize-window/maximize-window.global-override-for-injectable.ts b/src/renderer/components/layout/top-bar/top-bar-items/window-controls/maximize-window/maximize-window.global-override-for-injectable.ts new file mode 100644 index 0000000000..e0056a6ee8 --- /dev/null +++ b/src/renderer/components/layout/top-bar/top-bar-items/window-controls/maximize-window/maximize-window.global-override-for-injectable.ts @@ -0,0 +1,8 @@ +/** + * Copyright (c) OpenLens Authors. All rights reserved. + * Licensed under MIT License. See LICENSE in root directory for more information. + */ +import maximizeWindowInjectable from "./maximize-window.injectable"; +import { getGlobalOverrideForFunction } from "../../../../../../../common/test-utils/get-global-override-for-function"; + +export default getGlobalOverrideForFunction(maximizeWindowInjectable); diff --git a/src/renderer/components/layout/top-bar/maximize-window.injectable.ts b/src/renderer/components/layout/top-bar/top-bar-items/window-controls/maximize-window/maximize-window.injectable.ts similarity index 76% rename from src/renderer/components/layout/top-bar/maximize-window.injectable.ts rename to src/renderer/components/layout/top-bar/top-bar-items/window-controls/maximize-window/maximize-window.injectable.ts index bfcb2916c4..624979cf10 100644 --- a/src/renderer/components/layout/top-bar/maximize-window.injectable.ts +++ b/src/renderer/components/layout/top-bar/top-bar-items/window-controls/maximize-window/maximize-window.injectable.ts @@ -3,8 +3,8 @@ * Licensed under MIT License. See LICENSE in root directory for more information. */ import { getInjectable } from "@ogre-tools/injectable"; -import { WindowAction } from "../../../../common/ipc/window"; -import { requestWindowAction } from "../../../ipc"; +import { WindowAction } from "../../../../../../../common/ipc/window"; +import { requestWindowAction } from "../../../../../../ipc"; const maximizeWindowInjectable = getInjectable({ id: "maximize-window", diff --git a/src/renderer/components/layout/top-bar/top-bar-items/window-controls/window-controls-top-bar-item.injectable.ts b/src/renderer/components/layout/top-bar/top-bar-items/window-controls/window-controls-top-bar-item.injectable.ts new file mode 100644 index 0000000000..14a489aa9e --- /dev/null +++ b/src/renderer/components/layout/top-bar/top-bar-items/window-controls/window-controls-top-bar-item.injectable.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) OpenLens Authors. All rights reserved. + * Licensed under MIT License. See LICENSE in root directory for more information. + */ +import { getInjectable } from "@ogre-tools/injectable"; +import { computed } from "mobx"; +import topBarItemInjectionToken from "../top-bar-item-injection-token"; +import { WindowControls } from "./window-controls"; +import isWindowsInjectable from "../../../../../../common/vars/is-windows.injectable"; +import isLinuxInjectable from "../../../../../../common/vars/is-linux.injectable"; + +const windowControlsTopBarItemInjectable = getInjectable({ + id: "window-controls-top-bar-item", + + instantiate: (di) => { + const isWindows = di.inject(isWindowsInjectable); + const isLinux = di.inject(isLinuxInjectable); + + return ({ + id: "window-controls", + orderNumber: 110, + isShown: computed(() => (isWindows || isLinux)), + Component: WindowControls, + }); + }, + + injectionToken: topBarItemInjectionToken, +}); + +export default windowControlsTopBarItemInjectable; diff --git a/src/renderer/components/layout/top-bar/top-bar-items/window-controls/window-controls.tsx b/src/renderer/components/layout/top-bar/top-bar-items/window-controls/window-controls.tsx new file mode 100644 index 0000000000..08cdee837f --- /dev/null +++ b/src/renderer/components/layout/top-bar/top-bar-items/window-controls/window-controls.tsx @@ -0,0 +1,90 @@ +/** + * Copyright (c) OpenLens Authors. All rights reserved. + * Licensed under MIT License. See LICENSE in root directory for more information. + */ +import React from "react"; +import { withInjectables } from "@ogre-tools/injectable-react"; +import { cssNames } from "../../../../../utils"; +import styles from "../../top-bar.module.scss"; +import isLinuxInjectable from "../../../../../../common/vars/is-linux.injectable"; +import toggleMaximizeWindowInjectable from "../../toggle-maximize-window/toggle-maximize-window.injectable"; +import closeWindowInjectable from "./close-window/close-window.injectable"; +import maximizeWindowInjectable from "./maximize-window/maximize-window.injectable"; + +interface Dependencies { + isLinux: boolean; + toggleMaximizeWindow: () => void; + closeWindow: () => void; + minimizeWindow: () => void; +} + +const NonInjectedWindowControls = ({ + isLinux, + toggleMaximizeWindow, + closeWindow, + minimizeWindow, +}: Dependencies) => ( +
+
+ + + +
+ +
+ + + +
+ +
+ + + +
+
+); + +export const WindowControls = withInjectables( + NonInjectedWindowControls, + + { + getProps: (di) => ({ + isLinux: di.inject(isLinuxInjectable), + toggleMaximizeWindow: di.inject(toggleMaximizeWindowInjectable), + closeWindow: di.inject(closeWindowInjectable), + minimizeWindow: di.inject(maximizeWindowInjectable), + }), + }, +); diff --git a/src/renderer/components/layout/top-bar/top-bar.test.tsx b/src/renderer/components/layout/top-bar/top-bar.test.tsx index 8384205a59..749b3c7c26 100644 --- a/src/renderer/components/layout/top-bar/top-bar.test.tsx +++ b/src/renderer/components/layout/top-bar/top-bar.test.tsx @@ -13,11 +13,11 @@ import type { DiRender } from "../../test-utils/renderFor"; import { renderFor } from "../../test-utils/renderFor"; import { computed, observable } from "mobx"; import rendererExtensionsInjectable from "../../../../extensions/renderer-extensions.injectable"; -import closeWindowInjectable from "./close-window.injectable"; +import closeWindowInjectable from "./top-bar-items/window-controls/close-window/close-window.injectable"; import goBackInjectable from "./top-bar-items/navigation-to-back/go-back/go-back.injectable"; -import maximizeWindowInjectable from "./maximize-window.injectable"; +import maximizeWindowInjectable from "./top-bar-items/window-controls/maximize-window/maximize-window.injectable"; import openAppContextMenuInjectable from "./top-bar-items/context-menu/open-app-context-menu/open-app-context-menu.injectable"; -import toggleMaximizeWindowInjectable from "./toggle-maximize-window.injectable"; +import toggleMaximizeWindowInjectable from "./toggle-maximize-window/toggle-maximize-window.injectable"; import topBarStateInjectable from "./state.injectable"; import platformInjectable from "../../../../common/vars/platform.injectable"; import goForwardInjectable from "./top-bar-items/navigation-to-forward/go-forward/go-forward.injectable"; diff --git a/src/renderer/components/layout/top-bar/top-bar.tsx b/src/renderer/components/layout/top-bar/top-bar.tsx index 3eed0bc6b9..df2668038e 100644 --- a/src/renderer/components/layout/top-bar/top-bar.tsx +++ b/src/renderer/components/layout/top-bar/top-bar.tsx @@ -7,13 +7,8 @@ import styles from "./top-bar.module.scss"; import React, { useEffect, useRef } from "react"; import { observer } from "mobx-react"; import type { IComputedValue } from "mobx"; -import { cssNames } from "../../../utils"; import { withInjectables } from "@ogre-tools/injectable-react"; -import isLinuxInjectable from "../../../../common/vars/is-linux.injectable"; -import isWindowsInjectable from "../../../../common/vars/is-windows.injectable"; -import closeWindowInjectable from "./close-window.injectable"; -import maximizeWindowInjectable from "./maximize-window.injectable"; -import toggleMaximizeWindowInjectable from "./toggle-maximize-window.injectable"; +import toggleMaximizeWindowInjectable from "./toggle-maximize-window/toggle-maximize-window.injectable"; import watchHistoryStateInjectable from "../../../remote-helpers/watch-history-state.injectable"; import topBarItemsInjectable from "./top-bar-items/top-bar-items.injectable"; import type { TopBarItem } from "./top-bar-items/top-bar-item-injection-token"; @@ -22,21 +17,13 @@ import navigateToWelcomeInjectable from "../../../../common/front-end-routing/ro interface Dependencies { items: IComputedValue; - isWindows: boolean; - isLinux: boolean; - minimizeWindow: () => void; toggleMaximizeWindow: () => void; - closeWindow: () => void; watchHistoryState: () => () => void; } const NonInjectedTopBar = observer( ({ items, - isWindows, - isLinux, - closeWindow, - minimizeWindow, toggleMaximizeWindow, watchHistoryState, }: Dependencies) => { @@ -63,61 +50,6 @@ const NonInjectedTopBar = observer( return ; })}
- -
- {(isWindows || isLinux) && ( -
-
- - - -
- -
- - - -
- -
- - - -
-
- )} -
); }, @@ -126,10 +58,6 @@ const NonInjectedTopBar = observer( export const TopBar = withInjectables(NonInjectedTopBar, { getProps: (di) => ({ items: di.inject(topBarItemsInjectable), - isLinux: di.inject(isLinuxInjectable), - isWindows: di.inject(isWindowsInjectable), - closeWindow: di.inject(closeWindowInjectable), - minimizeWindow: di.inject(maximizeWindowInjectable), toggleMaximizeWindow: di.inject(toggleMaximizeWindowInjectable), watchHistoryState: di.inject(watchHistoryStateInjectable), }), diff --git a/src/renderer/getDiForUnitTesting.tsx b/src/renderer/getDiForUnitTesting.tsx index 09ea55712f..2afd522518 100644 --- a/src/renderer/getDiForUnitTesting.tsx +++ b/src/renderer/getDiForUnitTesting.tsx @@ -38,9 +38,6 @@ import platformInjectable from "../common/vars/platform.injectable"; import startTopbarStateSyncInjectable from "./components/layout/top-bar/start-state-sync.injectable"; import { registerMobX } from "@ogre-tools/injectable-extension-for-mobx"; import watchHistoryStateInjectable from "./remote-helpers/watch-history-state.injectable"; -import closeWindowInjectable from "./components/layout/top-bar/close-window.injectable"; -import maximizeWindowInjectable from "./components/layout/top-bar/maximize-window.injectable"; -import toggleMaximizeWindowInjectable from "./components/layout/top-bar/toggle-maximize-window.injectable"; import type { HotbarStore } from "../common/hotbars/store"; import cronJobTriggerDialogClusterFrameChildComponentInjectable from "./components/+workloads-cronjobs/cron-job-trigger-dialog-cluster-frame-child-component.injectable"; import deploymentScaleDialogClusterFrameChildComponentInjectable from "./components/+workloads-deployments/scale/deployment-scale-dialog-cluster-frame-child-component.injectable"; @@ -146,9 +143,6 @@ export const getDiForUnitTesting = ( di.override(environmentVariablesInjectable, () => ({})); di.override(watchHistoryStateInjectable, () => () => () => {}); - di.override(closeWindowInjectable, () => () => {}); - di.override(maximizeWindowInjectable, () => () => {}); - di.override(toggleMaximizeWindowInjectable, () => () => {}); overrideFunctionalInjectables(di, [ broadcastMessageInjectable,