Extract top menu item for navigating to forward as OCP

Co-authored-by: Janne Savolainen <janne.savolainen@live.fi>

Signed-off-by: Iku-turso <mikko.aspiala@gmail.com>

src/renderer/components/layout/top-bar/top-bar-items/navigation-to-forward/go-forward/go-forward.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 goForwardInjectable from "./go-forward.injectable";
+import { getGlobalOverrideForFunction } from "../../../../../../../common/test-utils/get-global-override-for-function";
+
+export default getGlobalOverrideForFunction(goForwardInjectable);

src/renderer/components/layout/top-bar/top-bar-items/navigation-to-forward/go-forward/go-forward.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 goForwardInjectable = getInjectable({
   id: "go-forward",

src/renderer/components/layout/top-bar/top-bar-items/navigation-to-forward/navigation-to-forward-top-bar-item.injectable.ts

@@ -0,0 +1,23 @@
+/**
+ * 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 { NavigationToForward } from "./navigation-to-forward";
+
+const navigationToForwardTopBarItemInjectable = getInjectable({
+  id: "navigation-to-forward-top-bar-item",
+
+  instantiate: () => ({
+    id: "navigation-to-forward",
+    isShown: computed(() => true),
+    orderNumber: 40,
+    Component: NavigationToForward,
+  }),
+
+  injectionToken: topBarItemInjectionToken,
+});
+
+export default navigationToForwardTopBarItemInjectable;

src/renderer/components/layout/top-bar/top-bar-items/navigation-to-forward/navigation-to-forward.tsx

@@ -0,0 +1,39 @@
+/**
+ * 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 type { IComputedValue } from "mobx";
+import { Icon } from "../../../../icon";
+import topBarNextEnabledInjectable from "./next-enabled.injectable";
+import goForwardInjectable from "./go-forward/go-forward.injectable";
+import { observer } from "mobx-react";
+
+interface Dependencies {
+  nextEnabled: IComputedValue<boolean>;
+  goForward: () => void;
+}
+
+const NonInjectedNavigationToForward = observer(({
+  nextEnabled,
+  goForward,
+}: Dependencies) => (
+  <Icon
+    data-testid="history-forward"
+    material="arrow_forward"
+    onClick={goForward}
+    disabled={!nextEnabled.get()}
+  />
+));
+
+export const NavigationToForward = withInjectables<Dependencies>(
+  NonInjectedNavigationToForward,
+
+  {
+    getProps: (di) => ({
+      nextEnabled: di.inject(topBarNextEnabledInjectable),
+      goForward: di.inject(goForwardInjectable),
+    }),
+  },
+);

src/renderer/components/layout/top-bar/top-bar-items/navigation-to-forward/next-enabled.injectable.ts

@@ -4,7 +4,7 @@
  */
 import { getInjectable } from "@ogre-tools/injectable";
 import { computed } from "mobx";
-import topBarStateInjectable from "./state.injectable";
+import topBarStateInjectable from "../../state.injectable";
 
 const topBarNextEnabledInjectable = getInjectable({
   id: "top-bar-next-enabled",

src/renderer/components/layout/top-bar/top-bar.test.tsx

@@ -16,12 +16,13 @@ import { computed, observable } from "mobx";
 import rendererExtensionsInjectable from "../../../../extensions/renderer-extensions.injectable";
 import closeWindowInjectable from "./close-window.injectable";
 import goBackInjectable from "./top-bar-items/navigation-to-back/go-back/go-back.injectable";
-import goForwardInjectable from "./go-forward.injectable";
 import maximizeWindowInjectable from "./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 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";
 
 describe("<TopBar/>", () => {
   let di: DiContainer;

src/renderer/components/layout/top-bar/top-bar.tsx

@@ -7,7 +7,6 @@ import styles from "./top-bar.module.scss";
 import React, { useEffect, useRef } from "react";
 import { observer } from "mobx-react";
 import type { IComputedValue } from "mobx";
-import { Icon } from "../../icon";
 import { cssNames } from "../../../utils";
 import topBarItemsInjectable from "./top-bar-items/top-bar-items.injectable";
 import { withInjectables } from "@ogre-tools/injectable-react";
@@ -15,8 +14,6 @@ import type { TopBarRegistration } from "./top-bar-registration";
 import isLinuxInjectable from "../../../../common/vars/is-linux.injectable";
 import isWindowsInjectable from "../../../../common/vars/is-windows.injectable";
 import { UpdateButton } from "../../../../features/application-update/child-features/application-update-using-top-bar/renderer/update-button";
-import topBarNextEnabledInjectable from "./next-enabled.injectable";
-import goForwardInjectable from "./go-forward.injectable";
 import closeWindowInjectable from "./close-window.injectable";
 import maximizeWindowInjectable from "./maximize-window.injectable";
 import toggleMaximizeWindowInjectable from "./toggle-maximize-window.injectable";
@@ -31,8 +28,6 @@ interface Dependencies {
   items2: IComputedValue<TopBarItem[]>;
   isWindows: boolean;
   isLinux: boolean;
-  nextEnabled: IComputedValue<Boolean>;
-  goForward: () => void;
   minimizeWindow: () => void;
   toggleMaximizeWindow: () => void;
   closeWindow: () => void;
@@ -44,8 +39,6 @@ const NonInjectedTopBar = observer(({
   items2,
   isWindows,
   isLinux,
-  nextEnabled,
-  goForward,
   closeWindow,
   minimizeWindow,
   toggleMaximizeWindow,
@@ -73,12 +66,6 @@ const NonInjectedTopBar = observer(({
           return <Component key={item.id} />;
         })}
 
-        <Icon
-          data-testid="history-forward"
-          material="arrow_forward"
-          onClick={goForward}
-          disabled={!nextEnabled.get()}
-        />
         <UpdateButton />
       </div>
       <div className={styles.items}>
@@ -148,8 +135,6 @@ export const TopBar = withInjectables<Dependencies>(NonInjectedTopBar, {
     items2: di.inject(topBarItems2Injectable),
     isLinux: di.inject(isLinuxInjectable),
     isWindows: di.inject(isWindowsInjectable),
-    nextEnabled: di.inject(topBarNextEnabledInjectable),
-    goForward: di.inject(goForwardInjectable),
     closeWindow: di.inject(closeWindowInjectable),
     minimizeWindow: di.inject(maximizeWindowInjectable),
     toggleMaximizeWindow: di.inject(toggleMaximizeWindowInjectable),

src/renderer/getDiForUnitTesting.tsx

@@ -38,7 +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 goForwardInjectable from "./components/layout/top-bar/go-forward.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";
@@ -147,7 +146,6 @@ export const getDiForUnitTesting = (
 
     di.override(environmentVariablesInjectable, () => ({}));
     di.override(watchHistoryStateInjectable, () => () => () => {});
-    di.override(goForwardInjectable, () => () => {});
     di.override(closeWindowInjectable, () => () => {});
     di.override(maximizeWindowInjectable, () => () => {});
     di.override(toggleMaximizeWindowInjectable, () => () => {});