1
0
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:
Jim Ehrismann 2021-03-30 10:12:57 -04:00 committed by GitHub
parent 69200b50c7
commit 4529b1ec33
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 32 additions and 18 deletions

View File

@ -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;
} }
loadAll() { @computed get clusters(): ClusterItem[] {
return this.loadItems( return clusterStore
() => (
clusterStore
.getByWorkspaceId(this.workspaceId) .getByWorkspaceId(this.workspaceId)
.filter(cluster => cluster.enabled) .filter(cluster => cluster.enabled)
.map(cluster => new ClusterItem(cluster)) .map(cluster => new ClusterItem(cluster));
) }
);
watch() {
return reaction(() => this.clusters, () => this.loadAll(), {
fireImmediately: true
});
}
loadAll() {
return this.loadItems(() => this.clusters);
} }
async remove(clusterItem: ClusterItem) { async remove(clusterItem: ClusterItem) {

View File

@ -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.workspaceClusterStore.loadAll().catch(error => console.log("workspaceClusterStore.loadAll", error)); this.disposeClustersWatch?.();
this.disposeClustersWatch = this.workspaceClusterStore.watch();
}, { }, {
fireImmediately: true, fireImmediately: true,
}) });
]); }
componentWillUnmount() {
this.disposeWorkspaceWatch?.();
this.disposeClustersWatch?.();
} }
showCluster = ({ clusterId }: ClusterItem) => { showCluster = ({ clusterId }: ClusterItem) => {