From 1f8b388bd49030c4899307f12a1a7d415c488337 Mon Sep 17 00:00:00 2001 From: Jari Kolehmainen Date: Tue, 6 Apr 2021 13:50:21 +0300 Subject: [PATCH] hotbar context menu & command palette Signed-off-by: Jari Kolehmainen --- src/common/catalog-entity.ts | 4 +- src/extensions/extension-loader.ts | 1 - src/extensions/interfaces/registrations.ts | 1 - src/extensions/lens-renderer-extension.ts | 3 +- .../registries/cluster-feature-registry.ts | 18 ------- src/extensions/registries/command-registry.ts | 23 ++++++-- src/extensions/registries/index.ts | 1 - src/renderer/api/catalog-entity-registry.ts | 2 - src/renderer/api/catalog-entity.ts | 12 +++++ src/renderer/components/+apps/apps.command.ts | 4 +- .../+catalog/catalog-entity.store.ts | 5 +- src/renderer/components/+catalog/catalog.tsx | 8 ++- .../cluster-settings.command.ts | 2 +- .../components/+config/config.command.ts | 12 ++--- .../components/+network/network.command.ts | 8 +-- .../components/+nodes/node.command.ts | 2 +- .../+workloads/workloads.command.ts | 12 ++--- .../command-palette/command-container.tsx | 3 +- .../command-palette/command-dialog.tsx | 12 ++--- src/renderer/components/dock/dock.tsx | 4 +- .../error-boundary/error-boundary.tsx | 2 +- .../components/hotbar/hotbar-icon.tsx | 54 ++++++++++++++++++- .../components/hotbar/hotbar-menu.tsx | 7 +-- src/renderer/lens-app.tsx | 14 +++++ 24 files changed, 143 insertions(+), 71 deletions(-) delete mode 100644 src/extensions/registries/cluster-feature-registry.ts create mode 100644 src/renderer/api/catalog-entity.ts diff --git a/src/common/catalog-entity.ts b/src/common/catalog-entity.ts index 9a78b5eab9..72ed703c51 100644 --- a/src/common/catalog-entity.ts +++ b/src/common/catalog-entity.ts @@ -38,6 +38,7 @@ export type CatalogEntityStatus = { export interface CatalogEntityActionContext { navigate: (url: string) => void; + setCommandPaletteContext: (context?: CatalogEntity) => void; } export type CatalogEntityContextMenu = { @@ -46,7 +47,8 @@ export type CatalogEntityContextMenu = { onClick: () => Promise; }; -export interface CatalogEntityContextMenuContext extends CatalogEntityActionContext { +export interface CatalogEntityContextMenuContext { + navigate: (url: string) => void; menuItems: CatalogEntityContextMenu[]; } diff --git a/src/extensions/extension-loader.ts b/src/extensions/extension-loader.ts index 3af9ad874e..d36123b95a 100644 --- a/src/extensions/extension-loader.ts +++ b/src/extensions/extension-loader.ts @@ -213,7 +213,6 @@ export class ExtensionLoader { registries.globalPageRegistry.add(extension.globalPages, extension), registries.globalPageMenuRegistry.add(extension.globalPageMenus, extension), registries.appPreferenceRegistry.add(extension.appPreferences), - registries.clusterFeatureRegistry.add(extension.clusterFeatures), registries.statusBarRegistry.add(extension.statusBarItems), registries.commandRegistry.add(extension.commands), ]; diff --git a/src/extensions/interfaces/registrations.ts b/src/extensions/interfaces/registrations.ts index 10a55d1b78..6af60d97d9 100644 --- a/src/extensions/interfaces/registrations.ts +++ b/src/extensions/interfaces/registrations.ts @@ -1,5 +1,4 @@ export type { AppPreferenceRegistration, AppPreferenceComponents } from "../registries/app-preference-registry"; -export type { ClusterFeatureRegistration, ClusterFeatureComponents } from "../registries/cluster-feature-registry"; export type { KubeObjectDetailRegistration, KubeObjectDetailComponents } from "../registries/kube-object-detail-registry"; export type { KubeObjectMenuRegistration, KubeObjectMenuComponents } from "../registries/kube-object-menu-registry"; export type { KubeObjectStatusRegistration } from "../registries/kube-object-status-registry"; diff --git a/src/extensions/lens-renderer-extension.ts b/src/extensions/lens-renderer-extension.ts index 982830d8af..bf1f8cbeb3 100644 --- a/src/extensions/lens-renderer-extension.ts +++ b/src/extensions/lens-renderer-extension.ts @@ -1,4 +1,4 @@ -import type { AppPreferenceRegistration, ClusterFeatureRegistration, ClusterPageMenuRegistration, KubeObjectDetailRegistration, KubeObjectMenuRegistration, KubeObjectStatusRegistration, PageMenuRegistration, PageRegistration, StatusBarRegistration, } from "./registries"; +import type { AppPreferenceRegistration, ClusterPageMenuRegistration, KubeObjectDetailRegistration, KubeObjectMenuRegistration, KubeObjectStatusRegistration, PageMenuRegistration, PageRegistration, StatusBarRegistration, } from "./registries"; import type { Cluster } from "../main/cluster"; import { LensExtension } from "./lens-extension"; import { getExtensionPageUrl } from "./registries/page-registry"; @@ -11,7 +11,6 @@ export class LensRendererExtension extends LensExtension { clusterPageMenus: ClusterPageMenuRegistration[] = []; kubeObjectStatusTexts: KubeObjectStatusRegistration[] = []; appPreferences: AppPreferenceRegistration[] = []; - clusterFeatures: ClusterFeatureRegistration[] = []; statusBarItems: StatusBarRegistration[] = []; kubeObjectDetailItems: KubeObjectDetailRegistration[] = []; kubeObjectMenuItems: KubeObjectMenuRegistration[] = []; diff --git a/src/extensions/registries/cluster-feature-registry.ts b/src/extensions/registries/cluster-feature-registry.ts deleted file mode 100644 index 5017ad27a6..0000000000 --- a/src/extensions/registries/cluster-feature-registry.ts +++ /dev/null @@ -1,18 +0,0 @@ -import type React from "react"; -import { BaseRegistry } from "./base-registry"; -import { ClusterFeature } from "../cluster-feature"; - -export interface ClusterFeatureComponents { - Description: React.ComponentType; -} - -export interface ClusterFeatureRegistration { - title: string; - components: ClusterFeatureComponents - feature: ClusterFeature -} - -export class ClusterFeatureRegistry extends BaseRegistry { -} - -export const clusterFeatureRegistry = new ClusterFeatureRegistry(); diff --git a/src/extensions/registries/command-registry.ts b/src/extensions/registries/command-registry.ts index 802593dbb4..889f004f22 100644 --- a/src/extensions/registries/command-registry.ts +++ b/src/extensions/registries/command-registry.ts @@ -1,23 +1,26 @@ // Extensions API -> Commands -import type { Cluster } from "../../main/cluster"; import { BaseRegistry } from "./base-registry"; -import { action } from "mobx"; +import { action, observable, reaction } from "mobx"; import { LensExtension } from "../lens-extension"; +import { CatalogEntity } from "../../common/catalog-entity"; +import { catalogEntityRegistry } from "../../common/catalog-entity-registry"; export type CommandContext = { - cluster?: Cluster; + entity?: CatalogEntity; }; export interface CommandRegistration { id: string; title: string; - scope: "cluster" | "global"; + scope: "entity" | "global"; action: (context: CommandContext) => void; isActive?: (context: CommandContext) => boolean; } export class CommandRegistry extends BaseRegistry { + @observable activeEntity: CatalogEntity; + @action add(items: CommandRegistration | CommandRegistration[], extension?: LensExtension) { const itemArray = [items].flat(); @@ -32,4 +35,16 @@ export class CommandRegistry extends BaseRegistry { } } +export function syncCommandRegistryWithCatalog() { + reaction(() => catalogEntityRegistry.items, (items) => { + if (!commandRegistry.activeEntity) { + return; + } + + if (!items.includes(commandRegistry.activeEntity)) { + commandRegistry.activeEntity = null; + } + }); +} + export const commandRegistry = new CommandRegistry(); diff --git a/src/extensions/registries/index.ts b/src/extensions/registries/index.ts index b6838f1bab..9f0aba5f0d 100644 --- a/src/extensions/registries/index.ts +++ b/src/extensions/registries/index.ts @@ -7,6 +7,5 @@ export * from "./app-preference-registry"; export * from "./status-bar-registry"; export * from "./kube-object-detail-registry"; export * from "./kube-object-menu-registry"; -export * from "./cluster-feature-registry"; export * from "./kube-object-status-registry"; export * from "./command-registry"; diff --git a/src/renderer/api/catalog-entity-registry.ts b/src/renderer/api/catalog-entity-registry.ts index fc04c690e8..31bf3902c6 100644 --- a/src/renderer/api/catalog-entity-registry.ts +++ b/src/renderer/api/catalog-entity-registry.ts @@ -4,8 +4,6 @@ import { CatalogEntity, CatalogEntityData } from "../../common/catalog-entity"; import { catalogCategoryRegistry, CatalogCategoryRegistry } from "../../common/catalog-category-registry"; import "../../common/catalog-entities"; -export { CatalogEntity, CatalogEntityData, CatalogEntityContextMenuContext } from "../../common/catalog-entity"; - export class CatalogEntityRegistry { @observable protected _items: CatalogEntity[] = observable.array([], { deep: true }); diff --git a/src/renderer/api/catalog-entity.ts b/src/renderer/api/catalog-entity.ts new file mode 100644 index 0000000000..a4e75753c2 --- /dev/null +++ b/src/renderer/api/catalog-entity.ts @@ -0,0 +1,12 @@ +import { navigate } from "../navigation"; +import { commandRegistry } from "../../extensions/registries"; +import { CatalogEntity } from "../../common/catalog-entity"; + +export { CatalogEntity, CatalogEntityData, CatalogEntityActionContext, CatalogEntityContextMenuContext } from "../../common/catalog-entity"; + +export const catalogEntityRunContext = { + navigate: (url: string) => navigate(url), + setCommandPaletteContext: (entity?: CatalogEntity) => { + commandRegistry.activeEntity = entity; + } +}; diff --git a/src/renderer/components/+apps/apps.command.ts b/src/renderer/components/+apps/apps.command.ts index ff6c9d615d..8c499e7e4e 100644 --- a/src/renderer/components/+apps/apps.command.ts +++ b/src/renderer/components/+apps/apps.command.ts @@ -6,13 +6,13 @@ import { releaseURL } from "../+apps-releases"; commandRegistry.add({ id: "cluster.viewHelmCharts", title: "Cluster: View Helm Charts", - scope: "cluster", + scope: "entity", action: () => navigate(helmChartsURL()) }); commandRegistry.add({ id: "cluster.viewHelmReleases", title: "Cluster: View Helm Releases", - scope: "cluster", + scope: "entity", action: () => navigate(releaseURL()) }); diff --git a/src/renderer/components/+catalog/catalog-entity.store.ts b/src/renderer/components/+catalog/catalog-entity.store.ts index f99b4b768c..96893b3f30 100644 --- a/src/renderer/components/+catalog/catalog-entity.store.ts +++ b/src/renderer/components/+catalog/catalog-entity.store.ts @@ -1,5 +1,6 @@ import { action, computed, reaction } from "mobx"; -import { CatalogEntity, catalogEntityRegistry } from "../../api/catalog-entity-registry"; +import { catalogEntityRegistry } from "../../api/catalog-entity-registry"; +import { CatalogEntity, CatalogEntityActionContext } from "../../api/catalog-entity"; import { ItemObject, ItemStore } from "../../item.store"; import { autobind } from "../../utils"; @@ -42,7 +43,7 @@ export class CatalogEntityItem implements ItemObject { return this.entity.metadata.source || "unknown"; } - onRun(ctx: any) { + onRun(ctx: CatalogEntityActionContext) { this.entity.onRun(ctx); } diff --git a/src/renderer/components/+catalog/catalog.tsx b/src/renderer/components/+catalog/catalog.tsx index 540379fe36..bffdf28cfc 100644 --- a/src/renderer/components/+catalog/catalog.tsx +++ b/src/renderer/components/+catalog/catalog.tsx @@ -9,7 +9,7 @@ import { kebabCase } from "lodash"; import { PageLayout } from "../layout/page-layout"; import { MenuItem, MenuActions } from "../menu"; import { Icon } from "../icon"; -import { CatalogEntityContextMenuContext } from "../../api/catalog-entity-registry"; +import { CatalogEntityContextMenuContext, catalogEntityRunContext } from "../../api/catalog-entity"; import { Badge } from "../badge"; import { hotbarStore } from "../../../common/hotbar-store"; import { addClusterURL } from "../+add-cluster"; @@ -68,6 +68,10 @@ export class Catalog extends React.Component { hotbar.items = hotbar.items.filter((i) => i.entity.uid !== item.id); } + onDetails(item: CatalogEntityItem) { + item.onRun(catalogEntityRunContext); + } + @autobind() renderItemMenu(item: CatalogEntityItem) { const onOpen = async () => { @@ -124,7 +128,7 @@ export class Catalog extends React.Component { item.labels.map((label) => ), { title: item.phase, className: kebabCase(item.phase) } ]} - onDetails={(item: CatalogEntityItem) => item.onRun({ navigate: (url: string) => navigate(url)})} + onDetails={(item: CatalogEntityItem) => this.onDetails(item) } renderItemMenu={this.renderItemMenu} addRemoveButtons={{ addTooltip: "Add Kubernetes Cluster", diff --git a/src/renderer/components/+cluster-settings/cluster-settings.command.ts b/src/renderer/components/+cluster-settings/cluster-settings.command.ts index a3b3c8792e..c2e762eca8 100644 --- a/src/renderer/components/+cluster-settings/cluster-settings.command.ts +++ b/src/renderer/components/+cluster-settings/cluster-settings.command.ts @@ -12,5 +12,5 @@ commandRegistry.add({ clusterId: clusterStore.active.id } })), - isActive: (context) => !!context.cluster + isActive: (context) => !!context.entity }); diff --git a/src/renderer/components/+config/config.command.ts b/src/renderer/components/+config/config.command.ts index b709e6e9cd..32dbbc45cb 100644 --- a/src/renderer/components/+config/config.command.ts +++ b/src/renderer/components/+config/config.command.ts @@ -10,41 +10,41 @@ import { pdbURL } from "../+config-pod-disruption-budgets"; commandRegistry.add({ id: "cluster.viewConfigMaps", title: "Cluster: View ConfigMaps", - scope: "cluster", + scope: "entity", action: () => navigate(configMapsURL()) }); commandRegistry.add({ id: "cluster.viewSecrets", title: "Cluster: View Secrets", - scope: "cluster", + scope: "entity", action: () => navigate(secretsURL()) }); commandRegistry.add({ id: "cluster.viewResourceQuotas", title: "Cluster: View ResourceQuotas", - scope: "cluster", + scope: "entity", action: () => navigate(resourceQuotaURL()) }); commandRegistry.add({ id: "cluster.viewLimitRanges", title: "Cluster: View LimitRanges", - scope: "cluster", + scope: "entity", action: () => navigate(limitRangeURL()) }); commandRegistry.add({ id: "cluster.viewHorizontalPodAutoscalers", title: "Cluster: View HorizontalPodAutoscalers (HPA)", - scope: "cluster", + scope: "entity", action: () => navigate(hpaURL()) }); commandRegistry.add({ id: "cluster.viewPodDisruptionBudget", title: "Cluster: View PodDisruptionBudgets", - scope: "cluster", + scope: "entity", action: () => navigate(pdbURL()) }); diff --git a/src/renderer/components/+network/network.command.ts b/src/renderer/components/+network/network.command.ts index 6dfa907136..2fda32d020 100644 --- a/src/renderer/components/+network/network.command.ts +++ b/src/renderer/components/+network/network.command.ts @@ -8,27 +8,27 @@ import { networkPoliciesURL } from "../+network-policies"; commandRegistry.add({ id: "cluster.viewServices", title: "Cluster: View Services", - scope: "cluster", + scope: "entity", action: () => navigate(servicesURL()) }); commandRegistry.add({ id: "cluster.viewEndpoints", title: "Cluster: View Endpoints", - scope: "cluster", + scope: "entity", action: () => navigate(endpointURL()) }); commandRegistry.add({ id: "cluster.viewIngresses", title: "Cluster: View Ingresses", - scope: "cluster", + scope: "entity", action: () => navigate(ingressURL()) }); commandRegistry.add({ id: "cluster.viewNetworkPolicies", title: "Cluster: View NetworkPolicies", - scope: "cluster", + scope: "entity", action: () => navigate(networkPoliciesURL()) }); diff --git a/src/renderer/components/+nodes/node.command.ts b/src/renderer/components/+nodes/node.command.ts index 9257cea668..d92d17ccce 100644 --- a/src/renderer/components/+nodes/node.command.ts +++ b/src/renderer/components/+nodes/node.command.ts @@ -5,6 +5,6 @@ import { nodesURL } from "./nodes.route"; commandRegistry.add({ id: "cluster.viewNodes", title: "Cluster: View Nodes", - scope: "cluster", + scope: "entity", action: () => navigate(nodesURL()) }); diff --git a/src/renderer/components/+workloads/workloads.command.ts b/src/renderer/components/+workloads/workloads.command.ts index 02b5e42657..dfe774b204 100644 --- a/src/renderer/components/+workloads/workloads.command.ts +++ b/src/renderer/components/+workloads/workloads.command.ts @@ -5,41 +5,41 @@ import { cronJobsURL, daemonSetsURL, deploymentsURL, jobsURL, podsURL, statefulS commandRegistry.add({ id: "cluster.viewPods", title: "Cluster: View Pods", - scope: "cluster", + scope: "entity", action: () => navigate(podsURL()) }); commandRegistry.add({ id: "cluster.viewDeployments", title: "Cluster: View Deployments", - scope: "cluster", + scope: "entity", action: () => navigate(deploymentsURL()) }); commandRegistry.add({ id: "cluster.viewDaemonSets", title: "Cluster: View DaemonSets", - scope: "cluster", + scope: "entity", action: () => navigate(daemonSetsURL()) }); commandRegistry.add({ id: "cluster.viewStatefulSets", title: "Cluster: View StatefulSets", - scope: "cluster", + scope: "entity", action: () => navigate(statefulSetsURL()) }); commandRegistry.add({ id: "cluster.viewJobs", title: "Cluster: View Jobs", - scope: "cluster", + scope: "entity", action: () => navigate(jobsURL()) }); commandRegistry.add({ id: "cluster.viewCronJobs", title: "Cluster: View CronJobs", - scope: "cluster", + scope: "entity", action: () => navigate(cronJobsURL()) }); diff --git a/src/renderer/components/command-palette/command-container.tsx b/src/renderer/components/command-palette/command-container.tsx index 14208f5639..140523bc61 100644 --- a/src/renderer/components/command-palette/command-container.tsx +++ b/src/renderer/components/command-palette/command-container.tsx @@ -8,7 +8,6 @@ import { EventEmitter } from "../../../common/event-emitter"; import { subscribeToBroadcast } from "../../../common/ipc"; import { CommandDialog } from "./command-dialog"; import { CommandRegistration, commandRegistry } from "../../../extensions/registries/command-registry"; -import { clusterStore } from "../../../common/cluster-store"; export type CommandDialogEvent = { component: React.ReactElement @@ -48,7 +47,7 @@ export class CommandContainer extends React.Component<{ clusterId?: string }> { private runCommand(command: CommandRegistration) { command.action({ - cluster: clusterStore.active + entity: commandRegistry.activeEntity }); } diff --git a/src/renderer/components/command-palette/command-dialog.tsx b/src/renderer/components/command-palette/command-dialog.tsx index b640ff5735..c784612345 100644 --- a/src/renderer/components/command-palette/command-dialog.tsx +++ b/src/renderer/components/command-palette/command-dialog.tsx @@ -16,11 +16,11 @@ export class CommandDialog extends React.Component { @computed get options() { const context = { - cluster: clusterStore.active + entity: commandRegistry.activeEntity }; return commandRegistry.getItems().filter((command) => { - if (command.scope === "cluster" && !clusterStore.active) { + if (command.scope === "entity" && !clusterStore.active) { return false; } @@ -54,15 +54,15 @@ export class CommandDialog extends React.Component { if (command.scope === "global") { action({ - cluster: clusterStore.active + entity: commandRegistry.activeEntity }); - } else if(clusterStore.active) { + } else if(commandRegistry.activeEntity) { navigate(clusterViewURL({ params: { - clusterId: clusterStore.active.id + clusterId: commandRegistry.activeEntity.metadata.uid } })); - broadcastMessage(`command-palette:run-action:${clusterStore.active.id}`, command.id); + broadcastMessage(`command-palette:run-action:${commandRegistry.activeEntity.metadata.uid}`, command.id); } } catch(error) { console.error("[COMMAND-DIALOG] failed to execute command", command.id, error); diff --git a/src/renderer/components/dock/dock.tsx b/src/renderer/components/dock/dock.tsx index 19a233eb79..13f9d9f914 100644 --- a/src/renderer/components/dock/dock.tsx +++ b/src/renderer/components/dock/dock.tsx @@ -136,7 +136,7 @@ export class Dock extends React.Component { commandRegistry.add({ id: "cluster.openTerminal", title: "Cluster: Open terminal", - scope: "cluster", + scope: "entity", action: () => createTerminalTab(), - isActive: (context) => !!context.cluster + isActive: (context) => !!context.entity }); diff --git a/src/renderer/components/error-boundary/error-boundary.tsx b/src/renderer/components/error-boundary/error-boundary.tsx index a70e27ce3d..a628bfb3bc 100644 --- a/src/renderer/components/error-boundary/error-boundary.tsx +++ b/src/renderer/components/error-boundary/error-boundary.tsx @@ -39,7 +39,7 @@ export class ErrorBoundary extends React.Component { if (error) { const slackLink = Slack; const githubLink = Github; - const pageUrl = location.href; + const pageUrl = location.pathname; return (
diff --git a/src/renderer/components/hotbar/hotbar-icon.tsx b/src/renderer/components/hotbar/hotbar-icon.tsx index 0b4dd1d92e..a6c2d8cc42 100644 --- a/src/renderer/components/hotbar/hotbar-icon.tsx +++ b/src/renderer/components/hotbar/hotbar-icon.tsx @@ -5,7 +5,12 @@ import { observer } from "mobx-react"; import { cssNames, IClassName } from "../../utils"; import { Tooltip } from "../tooltip"; import { Avatar } from "@material-ui/core"; -import { CatalogEntity } from "../../../common/catalog-entity"; +import { CatalogEntity, CatalogEntityContextMenuContext } from "../../../common/catalog-entity"; +import { Menu, MenuItem } from "../menu"; +import { Icon } from "../icon"; +import { observable } from "mobx"; +import { navigate } from "../../navigation"; +import { hotbarStore } from "../../../common/hotbar-store"; interface Props extends DOMAttributes { entity: CatalogEntity; @@ -16,6 +21,16 @@ interface Props extends DOMAttributes { @observer export class HotbarIcon extends React.Component { + @observable.deep private contextMenu: CatalogEntityContextMenuContext; + @observable menuOpen = false; + + componentDidMount() { + this.contextMenu = { + menuItems: [], + navigate: (url: string) => navigate(url) + }; + } + get iconString() { let splittedName = this.props.entity.metadata.name.split(" "); @@ -36,6 +51,20 @@ export class HotbarIcon extends React.Component { } } + toggleMenu() { + this.menuOpen = !this.menuOpen; + } + + removeFromHotbar(item: CatalogEntity) { + const hotbar = hotbarStore.getByName("default"); // FIXME + + if (!hotbar) { + return; + } + + hotbar.items = hotbar.items.filter((i) => i.entity.uid !== item.metadata.uid); + } + render() { const { entity, errorClass, isActive, @@ -46,11 +75,34 @@ export class HotbarIcon extends React.Component { interactive: true, active: isActive, }); + const onOpen = async () => { + await entity.onContextMenuOpen(this.contextMenu); + this.toggleMenu(); + }; return (
{entity.metadata.name} {this.iconString} + onOpen()} + close={() => this.toggleMenu()}> + this.removeFromHotbar(entity) }> + Remove from Hotbar + + { this.contextMenu && this.contextMenu.menuItems.map((menuItem) => { + return ( + menuItem.onClick()}> + {menuItem.title} + + ); + })} + {children}
); diff --git a/src/renderer/components/hotbar/hotbar-menu.tsx b/src/renderer/components/hotbar/hotbar-menu.tsx index 6bbc75cd7c..bef3fc759d 100644 --- a/src/renderer/components/hotbar/hotbar-menu.tsx +++ b/src/renderer/components/hotbar/hotbar-menu.tsx @@ -5,8 +5,8 @@ import { observer } from "mobx-react"; import { HotbarIcon } from "./hotbar-icon"; import { cssNames, IClassName } from "../../utils"; import { catalogEntityRegistry } from "../../api/catalog-entity-registry"; -import { navigate } from "../../navigation"; import { hotbarStore } from "../../../common/hotbar-store"; +import { catalogEntityRunContext } from "../../api/catalog-entity"; interface Props { className?: IClassName; @@ -23,9 +23,6 @@ export class HotbarMenu extends React.Component { } const items = hotbar.items.map((item) => catalogEntityRegistry.items.find((entity) => entity.metadata.uid === item.entity.uid)).filter(Boolean); - const runContext = { - navigate: (url: string) => navigate(url) - }; return (
@@ -36,7 +33,7 @@ export class HotbarMenu extends React.Component { key={entity.metadata.uid} entity={entity} isActive={entity.status.active} - onClick={() => entity.onRun(runContext)} + onClick={() => entity.onRun(catalogEntityRunContext)} /> ); })} diff --git a/src/renderer/lens-app.tsx b/src/renderer/lens-app.tsx index cd2048a028..9ff5c47f87 100644 --- a/src/renderer/lens-app.tsx +++ b/src/renderer/lens-app.tsx @@ -17,6 +17,8 @@ import { registerIpcHandlers } from "./ipc"; import { ipcRenderer } from "electron"; import { IpcRendererNavigationEvents } from "./navigation/events"; import { catalogEntityRegistry } from "./api/catalog-entity-registry"; +import { commandRegistry } from "../extensions/registries"; +import { reaction } from "mobx"; @observer export class LensApp extends React.Component { @@ -36,6 +38,18 @@ export class LensApp extends React.Component { ipcRenderer.send(IpcRendererNavigationEvents.LOADED); } + componentDidMount() { + reaction(() => catalogEntityRegistry.items, (items) => { + if (!commandRegistry.activeEntity) { + return; + } + + if (!items.includes(commandRegistry.activeEntity)) { + commandRegistry.activeEntity = null; + } + }); + } + render() { return (