hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Removing external observables out from App render()

Browse Source 
Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2021-03-03 10:50:50 +03:00
parent e422fa3c3b
commit 97a88eb2b8
1 changed files with 13 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
src/renderer/components/app.tsx
View File

@ -51,6 +51,7 @@ import { CommandContainer } from "./command-palette/command-container";
import { KubeObjectStore } from "../kube-object.store"; import { KubeObjectStore } from "../kube-object.store";
import { clusterContext } from "./context"; import { clusterContext } from "./context";
@observer
export class App extends React.Component { export class App extends React.Component {
static async init() { static async init() {
const frameId = webFrame.routingId; const frameId = webFrame.routingId;
@ -90,19 +91,21 @@ export class App extends React.Component {
reaction(() => this.warningsTotal, (count: number) => { reaction(() => this.warningsTotal, (count: number) => {
broadcastMessage(`cluster-warning-event-count:${getHostedCluster().id}`, count); broadcastMessage(`cluster-warning-event-count:${getHostedCluster().id}`, count);
}), }),
reaction(getHostedCluster, () => {
this.setStartUrl();
})
]); ]);
} }
@observable startUrl: string = clusterURL();
@computed get warningsTotal(): number { @computed get warningsTotal(): number {
return nodesStore.getWarningsCount() + eventStore.getWarningsCount(); return nodesStore.getWarningsCount() + eventStore.getWarningsCount();
} }
get startURL() { setStartUrl() {
if (isAllowedResource(["events", "nodes", "pods"])) { this.startUrl = isAllowedResource(["events", "nodes", "pods"]) ? clusterURL() : workloadsURL();
return clusterURL();
}
return workloadsURL();
} }
getTabLayoutRoutes(menuItem: ClusterPageMenuRegistration) { getTabLayoutRoutes(menuItem: ClusterPageMenuRegistration) {
@ -156,14 +159,11 @@ export class App extends React.Component {
} }
render() { render() {
const cluster = getHostedCluster();
return ( return (
<Router history={history}> <Router history={history}>
<ErrorBoundary> <ErrorBoundary>
<MainLayout> <MainLayout>
<Switch> <Switch>
<Redirect exact from="/" to={this.startURL}/>
<Route component={ClusterOverview} {...clusterRoute}/> <Route component={ClusterOverview} {...clusterRoute}/>
<Route component={Nodes} {...nodesRoute}/> <Route component={Nodes} {...nodesRoute}/>
<Route component={Workloads} {...workloadsRoute}/> <Route component={Workloads} {...workloadsRoute}/>
@ -175,8 +175,9 @@ export class App extends React.Component {
<Route component={CustomResources} {...crdRoute}/> <Route component={CustomResources} {...crdRoute}/>
<Route component={UserManagement} {...usersManagementRoute}/> <Route component={UserManagement} {...usersManagementRoute}/>
<Route component={Apps} {...appsRoute}/> <Route component={Apps} {...appsRoute}/>
<ExtensionTabLayoutRoutes/> {this.renderExtensionTabLayoutRoutes()}
<ExtensionRoutes/> {this.renderExtensionRoutes()}
<Redirect exact from="/" to={this.startUrl}/>
<Route component={NotFound}/> <Route component={NotFound}/>
</Switch> </Switch>
</MainLayout> </MainLayout>
@ -189,65 +190,9 @@ export class App extends React.Component {
<StatefulSetScaleDialog/> <StatefulSetScaleDialog/>
<ReplicaSetScaleDialog/> <ReplicaSetScaleDialog/>
<CronJobTriggerDialog/> <CronJobTriggerDialog/>
<CommandContainer cluster={cluster}/> <CommandContainer/>
</ErrorBoundary> </ErrorBoundary>
</Router> </Router>
); );
} }
} }
@observer
class ExtensionRoutes extends React.Component {
render() {
return clusterPageRegistry.getItems().map((page, index) => {
const menu = clusterPageMenuRegistry.getByPage(page);
if (!menu) {
return <Route key={`extension-route-${index}`} path={page.url} component={page.components.Page}/>;
}
});
}
}
@observer
class ExtensionTabLayoutRoutes extends React.Component {
getTabLayoutRoutes(menuItem: ClusterPageMenuRegistration) {
const routes: TabLayoutRoute[] = [];
if (!menuItem.id) {
return routes;
}
clusterPageMenuRegistry.getSubItems(menuItem).forEach((subMenu) => {
const page = clusterPageRegistry.getByPageTarget(subMenu.target);
if (page) {
routes.push({
routePath: page.url,
url: getExtensionPageUrl(subMenu.target),
title: subMenu.title,
component: page.components.Page,
});
}
});
return routes;
}
render() {
return clusterPageMenuRegistry.getRootItems().map((menu, index) => {
const tabRoutes = this.getTabLayoutRoutes(menu);
if (tabRoutes.length > 0) {
const pageComponent = () => <TabLayout tabs={tabRoutes}/>;
return <Route key={`extension-tab-layout-route-${index}`} component={pageComponent} path={tabRoutes.map((tab) => tab.routePath)}/>;
} else {
const page = clusterPageRegistry.getByPageTarget(menu.target);
if (page) {
return <Route key={`extension-tab-layout-route-${index}`} path={page.url} component={page.components.Page}/>;
}
}
});
}
}