diff --git a/src/behaviours/preferences/__snapshots__/navigation-to-extension-specific-preferences.test.tsx.snap b/src/behaviours/preferences/__snapshots__/navigation-to-extension-specific-preferences.test.tsx.snap index db0b8f3207..425728241d 100644 --- a/src/behaviours/preferences/__snapshots__/navigation-to-extension-specific-preferences.test.tsx.snap +++ b/src/behaviours/preferences/__snapshots__/navigation-to-extension-specific-preferences.test.tsx.snap @@ -1,5 +1,216 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP +exports[`preferences - navigation to extension specific preferences given in preferences, when rendered given multiple extensions with specific preferences, when navigating to extension specific preferences page renders 1`] = ` +
+
+ +
+
+
+

+ Extensions +

+
+
+ Some preference item + +
+
+
+
+
+
+
+
+
+ Test preference item + +
+
+
+
+
+
+
+
+
+
+
+
+
+ + + close + + +
+ +
+
+
+
+
+
+`; + exports[`preferences - navigation to extension specific preferences given in preferences, when rendered renders 1`] = `
+
-
@@ -1050,6 +1261,18 @@ exports[`preferences - navigation to extension specific preferences given in pre Proxy +
- diff --git a/src/behaviours/preferences/navigation-to-extension-specific-preferences.test.tsx b/src/behaviours/preferences/navigation-to-extension-specific-preferences.test.tsx index fcfecdf305..da654af756 100644 --- a/src/behaviours/preferences/navigation-to-extension-specific-preferences.test.tsx +++ b/src/behaviours/preferences/navigation-to-extension-specific-preferences.test.tsx @@ -59,11 +59,37 @@ describe("preferences - navigation to extension specific preferences", () => { expect(actual).toBeNull(); }); + describe("given multiple extensions with specific preferences, when navigating to extension specific preferences page", () => { + beforeEach(async () => { + const someTestExtension = getRendererExtensionFake(extensionStubWithExtensionSpecificPreferenceItems); + const someOtherTestExtension = getRendererExtensionFake(someOtherExtensionStubWithExtensionSpecificPreferenceItems); + + await applicationBuilder.addExtensions(someTestExtension, someOtherTestExtension); + applicationBuilder.preferences.navigation.click("extension-some-test-extension-id"); + }); + + it("renders", () => { + expect(rendered.container).toMatchSnapshot(); + }); + + it("doesn't show preferences from unrelated extension", () => { + const actual = rendered.getByTestId("extension-preference-item-for-some-other-preference-item-id"); + + expect(actual).toBeNull(); + }); + + it("shows preferences from related extension", () => { + const actual = rendered.getByTestId("extension-preference-item-for-some-preference-item-id"); + + expect(actual).not.toBeNull(); + }); + }); + describe("when extension with specific preferences is enabled", () => { - beforeEach(() => { + beforeEach(async () => { const testExtension = getRendererExtensionFake(extensionStubWithExtensionSpecificPreferenceItems); - applicationBuilder.addExtensions(testExtension); + await applicationBuilder.addExtensions(testExtension); }); it("renders", () => { @@ -71,14 +97,14 @@ describe("preferences - navigation to extension specific preferences", () => { }); it("shows link for extension preferences", () => { - const actual = rendered.getByTestId("tab-link-for-extensions"); + const actual = rendered.getByTestId("tab-link-for-extension-some-test-extension-id"); expect(actual).not.toBeNull(); }); describe("when navigating to extension preferences using navigation", () => { beforeEach(() => { - applicationBuilder.preferences.navigation.click("extensions"); + applicationBuilder.preferences.navigation.click("extension-some-test-extension-id"); }); it("renders", () => { @@ -134,3 +160,19 @@ const extensionStubWithExtensionSpecificPreferenceItems: Partial = { + id: "some-other-test-extension-id", + + appPreferences: [ + { + title: "Test preference item", + id: "some-other-preference-item-id", + + components: { + Hint: () =>
, + Input: () =>
, + }, + }, + ], +}; + diff --git a/src/common/front-end-routing/routes/preferences/extension/extension-preferences-route.injectable.ts b/src/common/front-end-routing/routes/preferences/extension/extension-preferences-route.injectable.ts index 92a97675b0..0b9015008e 100644 --- a/src/common/front-end-routing/routes/preferences/extension/extension-preferences-route.injectable.ts +++ b/src/common/front-end-routing/routes/preferences/extension/extension-preferences-route.injectable.ts @@ -4,13 +4,18 @@ */ import { getInjectable } from "@ogre-tools/injectable"; import { computed } from "mobx"; +import type { Route } from "../../../route-injection-token"; import { routeInjectionToken } from "../../../route-injection-token"; +interface ExtensionPreferenceRouteParams { + extensionId: string; +} + const extensionPreferencesRouteInjectable = getInjectable({ id: "extension-preferences-route", - instantiate: () => ({ - path: "/preferences/extensions", + instantiate: (): Route => ({ + path: "/preferences/extension/:extensionId", clusterFrame: false, isEnabled: computed(() => true), }), diff --git a/src/common/front-end-routing/routes/preferences/extension/navigate-to-extension-preferences.injectable.ts b/src/common/front-end-routing/routes/preferences/extension/navigate-to-extension-preferences.injectable.ts index 6e2f80d864..33466b9094 100644 --- a/src/common/front-end-routing/routes/preferences/extension/navigate-to-extension-preferences.injectable.ts +++ b/src/common/front-end-routing/routes/preferences/extension/navigate-to-extension-preferences.injectable.ts @@ -13,7 +13,9 @@ const navigateToExtensionPreferencesInjectable = getInjectable({ const navigateToRoute = di.inject(navigateToRouteInjectionToken); const route = di.inject(extensionPreferencesRouteInjectable); - return () => navigateToRoute(route); + return (extensionId: string) => navigateToRoute(route, { parameters: { + extensionId, + }}); }, }); diff --git a/src/renderer/components/+preferences/preferences-navigation/extensions-preferences-navigation-item.injectable.ts b/src/renderer/components/+preferences/preferences-navigation/extensions-preferences-navigation-item.injectable.ts index 029e9ba896..55b8ee9f97 100644 --- a/src/renderer/components/+preferences/preferences-navigation/extensions-preferences-navigation-item.injectable.ts +++ b/src/renderer/components/+preferences/preferences-navigation/extensions-preferences-navigation-item.injectable.ts @@ -3,49 +3,39 @@ * Licensed under MIT License. See LICENSE in root directory for more information. */ import { getInjectable } from "@ogre-tools/injectable"; -import { preferenceNavigationItemInjectionToken } from "./preference-navigation-items.injectable"; -import routeIsActiveInjectable from "../../../routes/route-is-active.injectable"; import { computed } from "mobx"; -import extensionsPreferenceItemsInjectable from "../extension-preference-items.injectable"; -import extensionPreferencesRouteInjectable from "../../../../common/front-end-routing/routes/preferences/extension/extension-preferences-route.injectable"; -import navigateToPreferenceTabInjectable from "./navigate-to-preference-tab.injectable"; +import navigateToExtensionPreferencesInjectable from "../../../../common/front-end-routing/routes/preferences/extension/navigate-to-extension-preferences.injectable"; +import { extensionRegistratorInjectionToken } from "../../../../extensions/extension-loader/extension-registrator-injection-token"; +import type { LensRendererExtension } from "../../../../extensions/lens-renderer-extension"; +import { preferenceNavigationItemInjectionToken } from "./preference-navigation-items.injectable"; -const extensionsPreferencesNavigationItemInjectable = getInjectable({ +const extensionPreferencesNavigationItemRegistratorInjectable = getInjectable({ id: "extension-preferences-navigation-item", instantiate: (di) => { - const preferenceItems = di.inject( - extensionsPreferenceItemsInjectable, - ); + return (extension: LensRendererExtension) => { + const navigateToExtensionPreferences = di.inject( + navigateToExtensionPreferencesInjectable, + ); - const navigateToPreferenceTab = di.inject( - navigateToPreferenceTabInjectable, - ); + const extensionInjectable = getInjectable({ + id: `extension-preferences-navigation-item-${extension.sanitizedExtensionId}`, + instantiate: () => ({ + id: `extension-${extension.sanitizedExtensionId}`, + label: `${extension.name}`, + navigate: () => navigateToExtensionPreferences(extension.sanitizedExtensionId), + isActive: computed(() => false), + isVisible: computed(() => true), + orderNumber: 20, + }), + injectionToken: preferenceNavigationItemInjectionToken, + }); - const route = di.inject( - extensionPreferencesRouteInjectable, - ); - - const routeIsActive = di.inject( - routeIsActiveInjectable, - route, - ); - - return { - id: "extensions", - label: "Extensions", - navigate: navigateToPreferenceTab(route), - isActive: routeIsActive, - - isVisible: computed( - () => preferenceItems.get().length > 0, - ), - - orderNumber: 70, + di.register(extensionInjectable); }; }, - injectionToken: preferenceNavigationItemInjectionToken, + injectionToken: extensionRegistratorInjectionToken, }); -export default extensionsPreferencesNavigationItemInjectable; +export default extensionPreferencesNavigationItemRegistratorInjectable; diff --git a/src/renderer/components/+preferences/preferences-navigation/navigate-to-preference-tab.injectable.ts b/src/renderer/components/+preferences/preferences-navigation/navigate-to-preference-tab.injectable.ts index 05a20dab29..12495b5738 100644 --- a/src/renderer/components/+preferences/preferences-navigation/navigate-to-preference-tab.injectable.ts +++ b/src/renderer/components/+preferences/preferences-navigation/navigate-to-preference-tab.injectable.ts @@ -12,7 +12,7 @@ const navigateToPreferenceTabInjectable = getInjectable({ instantiate: (di) => { const navigateToRoute = di.inject(navigateToRouteInjectionToken); - return (route: Route) => () => { + return (route: Route) => () => { navigateToRoute(route, { withoutAffectingBackButton: true }); }; },