mirror of
https://github.com/lensapp/lens.git
synced 2025-05-20 05:10:56 +00:00
workspace overview is now reactive to cluster changes (#2356)
Signed-off-by: Jim Ehrismann <jehrismann@mirantis.com>
This commit is contained in:
parent
69200b50c7
commit
4529b1ec33
@ -3,6 +3,7 @@ import { Cluster } from "../../../main/cluster";
|
|||||||
import { clusterStore } from "../../../common/cluster-store";
|
import { clusterStore } from "../../../common/cluster-store";
|
||||||
import { ItemObject, ItemStore } from "../../item.store";
|
import { ItemObject, ItemStore } from "../../item.store";
|
||||||
import { autobind } from "../../utils";
|
import { autobind } from "../../utils";
|
||||||
|
import { computed, reaction } from "mobx";
|
||||||
|
|
||||||
export class ClusterItem implements ItemObject {
|
export class ClusterItem implements ItemObject {
|
||||||
constructor(public cluster: Cluster) {}
|
constructor(public cluster: Cluster) {}
|
||||||
@ -51,15 +52,21 @@ export class WorkspaceClusterStore extends ItemStore<ClusterItem> {
|
|||||||
this.workspaceId = workspaceId;
|
this.workspaceId = workspaceId;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@computed get clusters(): ClusterItem[] {
|
||||||
|
return clusterStore
|
||||||
|
.getByWorkspaceId(this.workspaceId)
|
||||||
|
.filter(cluster => cluster.enabled)
|
||||||
|
.map(cluster => new ClusterItem(cluster));
|
||||||
|
}
|
||||||
|
|
||||||
|
watch() {
|
||||||
|
return reaction(() => this.clusters, () => this.loadAll(), {
|
||||||
|
fireImmediately: true
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
loadAll() {
|
loadAll() {
|
||||||
return this.loadItems(
|
return this.loadItems(() => this.clusters);
|
||||||
() => (
|
|
||||||
clusterStore
|
|
||||||
.getByWorkspaceId(this.workspaceId)
|
|
||||||
.filter(cluster => cluster.enabled)
|
|
||||||
.map(cluster => new ClusterItem(cluster))
|
|
||||||
)
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
async remove(clusterItem: ClusterItem) {
|
async remove(clusterItem: ClusterItem) {
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
import "./workspace-overview.scss";
|
import "./workspace-overview.scss";
|
||||||
|
|
||||||
import React, { Component } from "react";
|
import React, { Component } from "react";
|
||||||
import { disposeOnUnmount, observer } from "mobx-react";
|
import { observer } from "mobx-react";
|
||||||
import { ItemListLayout } from "../item-object-list/item-list-layout";
|
import { ItemListLayout } from "../item-object-list/item-list-layout";
|
||||||
import { ClusterItem, WorkspaceClusterStore } from "./workspace-cluster.store";
|
import { ClusterItem, WorkspaceClusterStore } from "./workspace-cluster.store";
|
||||||
import { navigate } from "../../navigation";
|
import { navigate } from "../../navigation";
|
||||||
@ -9,7 +9,7 @@ import { clusterViewURL } from "../cluster-manager/cluster-view.route";
|
|||||||
import { WorkspaceClusterMenu } from "./workspace-cluster-menu";
|
import { WorkspaceClusterMenu } from "./workspace-cluster-menu";
|
||||||
import { kebabCase } from "lodash";
|
import { kebabCase } from "lodash";
|
||||||
import { addClusterURL } from "../+add-cluster";
|
import { addClusterURL } from "../+add-cluster";
|
||||||
import { observable, reaction } from "mobx";
|
import { IReactionDisposer, observable, reaction } from "mobx";
|
||||||
import { workspaceStore } from "../../../common/workspace-store";
|
import { workspaceStore } from "../../../common/workspace-store";
|
||||||
|
|
||||||
enum sortBy {
|
enum sortBy {
|
||||||
@ -23,15 +23,22 @@ enum sortBy {
|
|||||||
export class WorkspaceOverview extends Component {
|
export class WorkspaceOverview extends Component {
|
||||||
@observable private workspaceClusterStore?: WorkspaceClusterStore;
|
@observable private workspaceClusterStore?: WorkspaceClusterStore;
|
||||||
|
|
||||||
|
disposeWorkspaceWatch: IReactionDisposer;
|
||||||
|
disposeClustersWatch: IReactionDisposer;
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
disposeOnUnmount(this, [
|
this.disposeWorkspaceWatch = reaction(() => workspaceStore.currentWorkspaceId, workspaceId => {
|
||||||
reaction(() => workspaceStore.currentWorkspaceId, workspaceId => {
|
this.workspaceClusterStore = new WorkspaceClusterStore(workspaceId);
|
||||||
this.workspaceClusterStore = new WorkspaceClusterStore(workspaceId);
|
this.disposeClustersWatch?.();
|
||||||
this.workspaceClusterStore.loadAll().catch(error => console.log("workspaceClusterStore.loadAll", error));
|
this.disposeClustersWatch = this.workspaceClusterStore.watch();
|
||||||
}, {
|
}, {
|
||||||
fireImmediately: true,
|
fireImmediately: true,
|
||||||
})
|
});
|
||||||
]);
|
}
|
||||||
|
|
||||||
|
componentWillUnmount() {
|
||||||
|
this.disposeWorkspaceWatch?.();
|
||||||
|
this.disposeClustersWatch?.();
|
||||||
}
|
}
|
||||||
|
|
||||||
showCluster = ({ clusterId }: ClusterItem) => {
|
showCluster = ({ clusterId }: ClusterItem) => {
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user