mirror of
https://github.com/lensapp/lens.git
synced 2025-05-20 05:10:56 +00:00
Allow extensions to control status bar item visibility (#6178)
* Allow extensions to control status bar item visibility. Signed-off-by: Panu Horsmalahti <phorsmalahti@mirantis.com> * Move visible to StatusBarRegistration Signed-off-by: Panu Horsmalahti <phorsmalahti@mirantis.com> Signed-off-by: Panu Horsmalahti <phorsmalahti@mirantis.com>
This commit is contained in:
parent
4a033a49f0
commit
78b771d03b
@ -8,6 +8,7 @@ import type { ApplicationBuilder } from "../../renderer/components/test-utils/ge
|
||||
import { getApplicationBuilder } from "../../renderer/components/test-utils/get-application-builder";
|
||||
import getRandomIdInjectable from "../../common/utils/get-random-id.injectable";
|
||||
import type { FakeExtensionOptions } from "../../renderer/components/test-utils/get-extension-fake";
|
||||
import { computed } from "mobx";
|
||||
|
||||
describe("status-bar-items-originating-from-extensions", () => {
|
||||
let applicationBuilder: ApplicationBuilder;
|
||||
@ -65,7 +66,7 @@ describe("status-bar-items-originating-from-extensions", () => {
|
||||
|
||||
const rightSide = rendered.getByTestId("status-bar-right");
|
||||
|
||||
const actual = getTestStatusBarTexts(rightSide, [
|
||||
const actual = getExpectedTestStatusBarTexts(rightSide, [
|
||||
"extension1",
|
||||
"extension2",
|
||||
]);
|
||||
@ -95,6 +96,13 @@ describe("status-bar-items-originating-from-extensions", () => {
|
||||
position: "right" as const,
|
||||
},
|
||||
},
|
||||
{
|
||||
components: {
|
||||
Item: () => <div data-testid="some-testId">right4</div>,
|
||||
position: "right" as const,
|
||||
},
|
||||
visible: computed(() => false),
|
||||
},
|
||||
{
|
||||
components: {
|
||||
Item: () => <div data-testid="some-testId">left1</div>,
|
||||
@ -121,7 +129,7 @@ describe("status-bar-items-originating-from-extensions", () => {
|
||||
it("shows right side status bar items in the correct order", () => {
|
||||
const rightSide = rendered.getByTestId("status-bar-right");
|
||||
|
||||
const actual = getTestStatusBarTexts(rightSide, [
|
||||
const actual = getExpectedTestStatusBarTexts(rightSide, [
|
||||
"right1",
|
||||
"right2",
|
||||
"right3",
|
||||
@ -130,10 +138,16 @@ describe("status-bar-items-originating-from-extensions", () => {
|
||||
expect(actual).toEqual(["right3", "right2", "right1"]);
|
||||
});
|
||||
|
||||
it("doesn't show invisible status bar item", () => {
|
||||
const rightSide = rendered.getByTestId("status-bar-right");
|
||||
|
||||
expect(getTestStatusBarTexts(rightSide)).not.toContain("right4");
|
||||
});
|
||||
|
||||
it("shows left side status bar items in the correct order", () => {
|
||||
const leftSide = rendered.getByTestId("status-bar-left");
|
||||
|
||||
const actual = getTestStatusBarTexts(leftSide, ["left2", "left1"]);
|
||||
const actual = getExpectedTestStatusBarTexts(leftSide, ["left2", "left1"]);
|
||||
|
||||
expect(actual).toEqual(["left1", "left2"]);
|
||||
});
|
||||
@ -149,7 +163,9 @@ describe("status-bar-items-originating-from-extensions", () => {
|
||||
});
|
||||
});
|
||||
|
||||
const getTestStatusBarTexts = (actual: HTMLElement, expectedTexts: string[]) =>
|
||||
const getTestStatusBarTexts = (actual: HTMLElement) =>
|
||||
Array.from(actual.children)
|
||||
.map((elem) => elem.textContent)
|
||||
.filter((elem) => elem && expectedTexts.includes(elem));
|
||||
.map((elem) => String(elem.textContent));
|
||||
|
||||
const getExpectedTestStatusBarTexts = (actual: HTMLElement, expectedTexts: string[]) =>
|
||||
getTestStatusBarTexts(actual).filter((textContent) => textContent && expectedTexts.includes(textContent));
|
||||
|
||||
@ -4,6 +4,7 @@
|
||||
*/
|
||||
import type { Injectable } from "@ogre-tools/injectable";
|
||||
import { getInjectable } from "@ogre-tools/injectable";
|
||||
import type { IComputedValue } from "mobx";
|
||||
import { computed } from "mobx";
|
||||
import { extensionRegistratorInjectionToken } from "../../../extensions/extension-loader/extension-registrator-injection-token";
|
||||
import type { LensRendererExtension } from "../../../extensions/lens-renderer-extension";
|
||||
@ -38,6 +39,7 @@ const toItemInjectableFor = (extension: LensRendererExtension, getRandomId: () =
|
||||
const id = `${getRandomId()}-status-bar-item-for-extension-${extension.sanitizedExtensionId}`;
|
||||
let component: React.ComponentType;
|
||||
let position: "left" | "right";
|
||||
const visible: IComputedValue<boolean> | undefined = registration?.visible;
|
||||
|
||||
if (registration?.item) {
|
||||
const { item } = registration;
|
||||
@ -74,7 +76,7 @@ const toItemInjectableFor = (extension: LensRendererExtension, getRandomId: () =
|
||||
instantiate: () => ({
|
||||
component,
|
||||
position,
|
||||
visible: computed(() => true),
|
||||
visible: visible ?? computed(() => true),
|
||||
}),
|
||||
|
||||
injectionToken: statusBarItemInjectionToken,
|
||||
|
||||
@ -3,6 +3,8 @@
|
||||
* Licensed under MIT License. See LICENSE in root directory for more information.
|
||||
*/
|
||||
|
||||
import type { IComputedValue } from "mobx";
|
||||
|
||||
/**
|
||||
* The props for StatusBar item component
|
||||
*/
|
||||
@ -38,4 +40,9 @@ export interface StatusBarRegistration {
|
||||
* The newer API, allows for registering a component instead of a ReactNode
|
||||
*/
|
||||
components?: StatusBarComponents;
|
||||
|
||||
/**
|
||||
* If specified, controls item visibility
|
||||
*/
|
||||
visible?: IComputedValue<boolean>;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user