- {Array.from(dynamicPages.routes).map(([path, { MenuIcon }]) => {
+ {dynamicPages.globalPages.map(({ path, components: { MenuIcon } }) => {
if (MenuIcon) {
return
navigate(path)}/>
}
diff --git a/src/renderer/components/cluster-manager/register-page.ts b/src/renderer/components/cluster-manager/register-page.ts
index 23db2c36dd..49d32dcb30 100644
--- a/src/renderer/components/cluster-manager/register-page.ts
+++ b/src/renderer/components/cluster-manager/register-page.ts
@@ -1,27 +1,38 @@
// Dynamic pages
import React from "react";
-import { observable } from "mobx";
+import { computed, observable } from "mobx";
import type { IconProps } from "../icon";
+export interface PageRegistration {
+ path: string;
+ type: "global" | "cluster-view";
+ components: PageComponents;
+}
+
export interface PageComponents {
- Main: React.ComponentType;
+ Page: React.ComponentType;
MenuIcon: React.ComponentType;
}
export class PagesStore {
- routes = observable.map();
+ protected pages = observable.array([], { deep: false });
- getComponents(path: string): PageComponents | null {
- return this.routes.get(path);
+ @computed get globalPages() {
+ return this.pages.filter(page => page.type === "global");
}
- register(path: string, components: PageComponents) {
- this.routes.set(path, components);
+ @computed get clusterPages() {
+ return this.pages.filter(page => page.type === "cluster-view");
}
- unregister(path: string) {
- this.routes.delete(path);
+ register(params: PageRegistration) {
+ this.pages.push(params);
+ return () => {
+ this.pages.replace(
+ this.pages.filter(page => page.components !== params.components)
+ )
+ };
}
}