refactoring as per review comments

Signed-off-by: Jim Ehrismann <jehrismann@mirantis.com>

src/renderer/components/+landing-page/workspace-cluster-menu.tsx

@@ -24,12 +24,12 @@ export class WorkspaceClusterMenu extends React.Component<Props> {
   }
 
   @autobind()
-  settings() {
+  gotoSettings() {
     const { clusterItem } = this.props;
 
     navigate(clusterSettingsURL({
       params: {
-        clusterId: clusterItem.getId()
+        clusterId: clusterItem.id
       }
     }));
   }
@@ -39,7 +39,7 @@ export class WorkspaceClusterMenu extends React.Component<Props> {
     const { clusterItem, workspace } = this.props;
 
     return (
-      <p>Remove cluster <b>{clusterItem.getName()}</b> from workspace {workspace.name}?</p>
+      <p>Remove cluster <b>{clusterItem.name}</b> from workspace <b>{workspace.name}</b>?</p>
     );
   }
 
@@ -49,7 +49,7 @@ export class WorkspaceClusterMenu extends React.Component<Props> {
 
     return (
       <>
-        <MenuItem onClick={this.settings}>
+        <MenuItem onClick={this.gotoSettings}>
           <Icon material="settings" interactive={toolbar} title="Settings"/>
           <span className="title">Settings</span>
         </MenuItem>
@@ -58,13 +58,13 @@ export class WorkspaceClusterMenu extends React.Component<Props> {
   }
 
   render() {
-    const { clusterItem, className, ...menuProps } = this.props;
+    const { clusterItem: { cluster: { isManaged } }, className, ...menuProps } = this.props;
 
     return (
       <MenuActions
         {...menuProps}
         className={cssNames("WorkspaceClusterMenu", className)}
-        removeAction={clusterItem.cluster.isManaged ? null : this.remove}
+        removeAction={isManaged ? null : this.remove}
         removeConfirmationMessage={this.renderRemoveMessage}
       >
         {this.renderContent()}

src/renderer/components/+landing-page/workspace-cluster.store.ts

@@ -7,13 +7,25 @@ import { autobind } from "../../utils";
 export class ClusterItem implements ItemObject {
   constructor(public cluster: Cluster) {}
   
-  getName() {
+  get name() {
     return this.cluster.name;
   }
 
-  getId() {
+  getName() {
+    return this.name;
+  }
+  
+  get id() {
     return this.cluster.id;
   }
+  
+  get clusterId() {
+    return this.cluster.id;
+  }
+  
+  getId() {
+    return this.id;
+  }
 }
 
 /** an ItemStore of the clusters belonging to a given workspace */
@@ -38,15 +50,11 @@ export class WorkspaceClusterStore extends ItemStore<ClusterItem> {
   }
 
   async remove(clusterItem: ClusterItem) {
-    const { cluster } = clusterItem;
+    const { cluster: { isManaged, id: clusterId }} = clusterItem;
 
-    if (cluster.isManaged) {
-      return;
+    if (!isManaged) {
+      return super.removeItem(clusterItem, () => clusterStore.removeById(clusterId));
     }
-
-    const clusterId = cluster.id;
-
-    return super.removeItem(clusterItem, () => clusterStore.removeById(clusterId));
   }
   
   async removeSelectedItems() {

src/renderer/components/+landing-page/workspace-overview.tsx

@@ -22,12 +22,10 @@ enum sortBy {
 @observer
 export class WorkspaceOverview extends Component<Props> {
 
-  showCluster = (clusterItem: ClusterItem) => {
-    const clusterId = clusterItem.getId();
-
+  showCluster = ({ clusterId }: ClusterItem) => {
     navigate(clusterViewURL({ params: { clusterId } }));
   };
-
+  
   render() {
     const { workspace } = this.props;
     const workspaceClusterStore = new WorkspaceClusterStore(workspace.id);
@@ -43,7 +41,7 @@ export class WorkspaceOverview extends Component<Props> {
         className="WorkspaceOverview"
         store={workspaceClusterStore}
         sortingCallbacks={{
-          [sortBy.name]: (item: ClusterItem) => item.getName(),
+          [sortBy.name]: (item: ClusterItem) => item.name,
           [sortBy.contextName]: (item: ClusterItem) => item.cluster.contextName,
           [sortBy.version]: (item: ClusterItem) => item.cluster.version,
         }}
@@ -54,7 +52,7 @@ export class WorkspaceOverview extends Component<Props> {
           { title: "Status", className: "status" },
         ]}
         renderTableContents={(item: ClusterItem) => [
-          item.getName(),
+          item.name,
           item.cluster.contextName,
           item.cluster.version,
           item.cluster.online ? "online" : "offline"