New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
PageRegistration & BaseRegistry refactoring #1334
Changes from 10 commits
9ec91c0
ab097c4
9b55a5f
296ba90
e671d07
824d102
451bc42
0d16f61
1823460
bc3a659
6159ebf
a489d9a
1fc8ff0
356cbef
78a4f73
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -100,13 +100,22 @@ import { ExamplePage } from "./src/example-page" | |
export default class ExampleRendererExtension extends LensRendererExtension { | ||
globalPages = [ | ||
{ | ||
path: "/example-route", | ||
hideInMenu: true, | ||
routePath: "/items/:id?", | ||
components: { | ||
Page: ExamplePage, | ||
} | ||
} | ||
] | ||
|
||
globalPageMenus = [ | ||
{ | ||
url: "/items/1", | ||
title: "Example page", // used in icon's tooltip | ||
components: { | ||
Icon: () => <Component.Icon material="arrow"/>, | ||
} | ||
} | ||
] | ||
} | ||
``` | ||
|
||
|
@@ -146,11 +155,20 @@ import { ExampleIcon, ExamplePage } from "./src/page" | |
export default class ExampleExtension extends LensRendererExtension { | ||
clusterPages = [ | ||
{ | ||
path: "/extension-example", | ||
title: "Example Extension", | ||
routePath: "/extension-example", | ||
exact: true, | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. can default be There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. This is optional. Could be default whatever we want :) |
||
components: { | ||
Page: () => <ExamplePage extension={this}/>, | ||
MenuIcon: ExampleIcon, | ||
} | ||
} | ||
] | ||
|
||
clusterPageMenus = [ | ||
{ | ||
url: "/extension-example", | ||
title: "Example Extension", | ||
components: { | ||
Icon: ExampleIcon, | ||
} | ||
} | ||
] | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
// Common variables for both processes (main & renderer) | ||
|
||
export const pageRoute = "/support" | ||
export const pageUrl = pageRoute; // same since no special :placeholder-s for react-router's route |
This file was deleted.
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -241,6 +241,8 @@ | |
"openid-client": "^3.15.2", | ||
"path-to-regexp": "^6.1.0", | ||
"proper-lockfile": "^4.1.1", | ||
"react": "^16.14.0", | ||
"react-router": "^5.2.0", | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. This is moved to normal dependencies since required in runtime ( There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
|
||
"request": "^2.88.2", | ||
"request-promise-native": "^1.0.8", | ||
"semver": "^7.3.2", | ||
|
@@ -361,11 +363,9 @@ | |
"postinstall-postinstall": "^2.1.0", | ||
"progress-bar-webpack-plugin": "^2.1.0", | ||
"raw-loader": "^4.0.1", | ||
"react": "^16.14.0", | ||
"react-beautiful-dnd": "^13.0.0", | ||
"react-dom": "^16.13.1", | ||
"react-refresh": "^0.9.0", | ||
"react-router": "^5.2.0", | ||
"react-router-dom": "^5.2.0", | ||
"react-select": "^3.1.0", | ||
"react-window": "^1.8.5", | ||
|
This file was deleted.
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -7,6 +7,8 @@ export class LensMainExtension extends LensExtension { | |
@observable.shallow appMenus: MenuRegistration[] = [] | ||
|
||
async navigate(location: string, frameId?: number) { | ||
await WindowManager.getInstance<WindowManager>().navigate(location, frameId) | ||
const windowManager = WindowManager.getInstance<WindowManager>(); | ||
const url = this.getPageUrl(location); | ||
await windowManager.navigate(url, frameId) | ||
} | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I like this a lot but @jakolehm couldn't get it to work? There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
It works on main extension. |
||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,18 +1,25 @@ | ||
import type { | ||
AppPreferenceRegistration, ClusterFeatureRegistration, | ||
KubeObjectMenuRegistration, KubeObjectDetailRegistration, | ||
PageRegistration, StatusBarRegistration, KubeObjectStatusRegistration | ||
KubeObjectMenuRegistration, KubeObjectDetailRegistration, StatusBarRegistration, KubeObjectStatusRegistration, | ||
PageRegistration, PageMenuRegistration, | ||
} from "./registries" | ||
import { observable } from "mobx"; | ||
import { LensExtension } from "./lens-extension" | ||
|
||
export class LensRendererExtension extends LensExtension { | ||
@observable.shallow globalPages: PageRegistration[] = [] | ||
@observable.shallow clusterPages: PageRegistration[] = [] | ||
@observable.shallow kubeObjectStatusTexts: KubeObjectStatusRegistration[] = [] | ||
@observable.shallow globalPageMenus: PageMenuRegistration[] = [] | ||
@observable.shallow clusterPageMenus: PageMenuRegistration[] = [] | ||
@observable.shallow kubeObjectStatusTexts: KubeObjectStatusRegistration[] = [] | ||
@observable.shallow appPreferences: AppPreferenceRegistration[] = [] | ||
@observable.shallow clusterFeatures: ClusterFeatureRegistration[] = [] | ||
@observable.shallow statusBarItems: StatusBarRegistration[] = [] | ||
@observable.shallow kubeObjectDetailItems: KubeObjectDetailRegistration[] = [] | ||
@observable.shallow kubeObjectMenuItems: KubeObjectMenuRegistration[] = [] | ||
|
||
async navigate(location: string){ | ||
const { navigate } = await import("../renderer/navigation"); | ||
navigate(this.getPageUrl(location)); | ||
} | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,23 +1,47 @@ | ||
// Base class for extensions-api registries | ||
import { action, observable } from "mobx"; | ||
import { LensExtension } from "../lens-extension"; | ||
|
||
export class BaseRegistry<T = any> { | ||
protected items = observable<T>([], { deep: false }); | ||
export interface BaseRegistryAddMeta { | ||
ext?: LensExtension | null; | ||
merge?: boolean | ||
} | ||
|
||
export class BaseRegistry<T extends object = any> { | ||
private items = observable.map<LensExtension, T[]>([], { deep: false }); | ||
|
||
getItems(): T[] { | ||
return this.items.toJS(); | ||
getItems(): (T & { extension?: LensExtension })[] { | ||
return Array.from(this.items).map(([ext, items]) => { | ||
return items.map(item => ({ | ||
...item, | ||
extension: ext, | ||
})) | ||
}).flat() | ||
} | ||
|
||
@action | ||
add(...items: T[]) { | ||
this.items.push(...items); | ||
return () => this.remove(...items); | ||
add(items: T | T[], { ext = null, merge = true }: BaseRegistryAddMeta = {}) { | ||
const itemsList: T[] = Array.isArray(items) ? items : [items]; | ||
if (merge && this.items.has(ext)) { | ||
const newItems = new Set(this.items.get(ext)); | ||
itemsList.forEach(item => newItems.add(item)) | ||
this.items.set(ext, [...newItems]); | ||
} else { | ||
this.items.set(ext, itemsList); | ||
} | ||
return () => this.remove(itemsList, ext) | ||
} | ||
|
||
@action | ||
remove(...items: T[]) { | ||
items.forEach(item => { | ||
this.items.remove(item); // works because of {deep: false}; | ||
}) | ||
remove(items: T[], key: LensExtension = null) { | ||
const storedItems = this.items.get(key); | ||
if (storedItems) { | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. could be also be
|
||
const newItems = storedItems.filter(item => !items.includes(item)); // works because of {deep: false}; | ||
if (newItems.length > 0) { | ||
this.items.set(key, newItems) | ||
} else { | ||
this.items.delete(key); | ||
} | ||
} | ||
} | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Seems cumbersome if the extension developer has to specify this. Can it default to this?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It's just an example. Now could be optional since we have route-prefix for all extensions.