From 11da9e49c4d1f81d9495c428d6f96b37efe38922 Mon Sep 17 00:00:00 2001
From: Jiri Tomasek <jtomasek@redhat.com>
Date: Wed, 5 Jun 2019 10:55:13 +0200
Subject: [PATCH 1/5] Use MultiListPage for BaremetalHostsPage

This allows to use machines and nodes data in hosts page
---
 .../console-shared/src/selectors/common.ts    |   6 +
 .../console-shared/src/selectors/index.ts     |   8 +-
 .../console-shared/src/selectors/machine.ts   |  11 ++
 .../src/components/host-role.tsx              |   8 ++
 .../metal3-plugin/src/components/host.tsx     | 110 ++++++++++++------
 .../src/components/machine-cell.tsx           |   2 +-
 frontend/packages/metal3-plugin/src/models.ts |   2 +-
 .../metal3-plugin/src/selectors/index.ts      |   5 +
 8 files changed, 106 insertions(+), 46 deletions(-)
 create mode 100644 frontend/packages/console-shared/src/selectors/common.ts
 create mode 100644 frontend/packages/console-shared/src/selectors/machine.ts
 create mode 100644 frontend/packages/metal3-plugin/src/components/host-role.tsx

diff --git a/frontend/packages/console-shared/src/selectors/common.ts b/frontend/packages/console-shared/src/selectors/common.ts
new file mode 100644
index 00000000000..98abc0c2d68
--- /dev/null
+++ b/frontend/packages/console-shared/src/selectors/common.ts
@@ -0,0 +1,6 @@
+import * as _ from 'lodash-es';
+
+import { K8sResourceKind } from '@console/internal/module/k8s';
+
+export const getName = (value: K8sResourceKind): string => _.get(value, 'metadata.name');
+export const getNamespace = (value: K8sResourceKind): string => _.get(value, 'metadata.namespace');
diff --git a/frontend/packages/console-shared/src/selectors/index.ts b/frontend/packages/console-shared/src/selectors/index.ts
index 98abc0c2d68..01e75f3d7c1 100644
--- a/frontend/packages/console-shared/src/selectors/index.ts
+++ b/frontend/packages/console-shared/src/selectors/index.ts
@@ -1,6 +1,2 @@
-import * as _ from 'lodash-es';
-
-import { K8sResourceKind } from '@console/internal/module/k8s';
-
-export const getName = (value: K8sResourceKind): string => _.get(value, 'metadata.name');
-export const getNamespace = (value: K8sResourceKind): string => _.get(value, 'metadata.namespace');
+export * from './common';
+export * from './machine';
diff --git a/frontend/packages/console-shared/src/selectors/machine.ts b/frontend/packages/console-shared/src/selectors/machine.ts
new file mode 100644
index 00000000000..4f2742178db
--- /dev/null
+++ b/frontend/packages/console-shared/src/selectors/machine.ts
@@ -0,0 +1,11 @@
+import * as _ from 'lodash-es';
+
+import { K8sResourceKind } from '@console/internal/module/k8s';
+import { getName } from './common';
+
+export const getMachineRole = (machine) =>
+  _.get(machine, ['metadata', 'labels', 'machine.openshift.io/cluster-api-machine-role']);
+export const getMachineNodeName = (machine) => _.get(machine, 'status.nodeRef.name');
+
+export const getMachineNode = (machine: K8sResourceKind, nodes: K8sResourceKind[]) =>
+  nodes.find((node) => getMachineNodeName(machine) === getName(node));
diff --git a/frontend/packages/metal3-plugin/src/components/host-role.tsx b/frontend/packages/metal3-plugin/src/components/host-role.tsx
new file mode 100644
index 00000000000..e4ed0ef480b
--- /dev/null
+++ b/frontend/packages/metal3-plugin/src/components/host-role.tsx
@@ -0,0 +1,8 @@
+import { getMachineRole, DASH } from '@console/shared';
+import { K8sResourceKind } from '@console/internal/module/k8s';
+
+type BaremetalHostRoleProps = {
+  machine: K8sResourceKind;
+};
+export const BaremetalHostRole: React.FC<BaremetalHostRoleProps> = ({ machine }) =>
+  getMachineRole(machine) || DASH;
diff --git a/frontend/packages/metal3-plugin/src/components/host.tsx b/frontend/packages/metal3-plugin/src/components/host.tsx
index 8c76972e102..892ea60757b 100644
--- a/frontend/packages/metal3-plugin/src/components/host.tsx
+++ b/frontend/packages/metal3-plugin/src/components/host.tsx
@@ -1,57 +1,61 @@
 import * as React from 'react';
+import * as _ from 'lodash-es';
 
 import { getName, getNamespace } from '@console/shared';
-// TODO(jtomasek): update import once models are moved to console-shared package
-// import { MachineModel, NodeModel } from '@console/internal/models';
-import { referenceForModel } from '@console/internal/module/k8s';
+import { MachineModel } from '@console/internal/models';
 
 import {
   ListHeader,
   ColHead,
   List,
-  ListPage,
+  MultiListPage,
   ResourceRow,
 } from '@console/internal/components/factory';
-
 import { ResourceLink } from '@console/internal/components/utils';
-// import { WithResources } from '@console/shared';
+import { referenceForModel, K8sResourceKind } from '@console/internal/module/k8s';
 
 import { BaremetalHostModel } from '../models';
-import { getHostBMCAddress } from '../selectors';
+import { getHostBMCAddress, getHostMachine } from '../selectors';
+import { BaremetalHostRole } from './host-role';
 import MachineCell from './machine-cell';
 
-// const nameColumnClasses = 'col-lg-2 col-md-4 col-sm-6 col-xs-6';
+const nameColumnClasses = 'col-lg-4 col-md-4 col-sm-6 col-xs-6';
 // const statusColumnClasses = 'col-lg-2 col-md-4 hidden-sm hidden-xs';
-// const machineColumnClasses = 'col-lg-3 visible-lg';
-// const roleColumnClasses = 'col-lg-2 visible-lg';
-// const addressColumnClasses = 'col-lg-2 visible-lg';
-const columnClasses = 'col-sm-4';
+const machineColumnClasses = 'col-lg-3 visible-lg';
+const roleColumnClasses = 'col-lg-2 visible-lg';
+const addressColumnClasses = 'col-lg-2 visible-lg';
 
 const HostHeader = (props: React.ComponentProps<typeof ColHead>) => (
   <ListHeader>
-    <ColHead {...props} className={columnClasses} sortField="metadata.name">
+    <ColHead {...props} className={nameColumnClasses} sortField="metadata.name">
       Name
     </ColHead>
     {/* <ColHead {...props} className={statusColumnClasses}>
       Status
     </ColHead> */}
-    <ColHead {...props} className={columnClasses}>
+    <ColHead {...props} className={machineColumnClasses} sortField="spec.machineRef.name">
       Machine
     </ColHead>
-    {/* <ColHead {...props} className={roleColumnClasses}>
+    <ColHead {...props} className={roleColumnClasses}>
       Role
-    </ColHead> */}
-    <ColHead {...props} className={columnClasses} sortField="spec.bmc.address">
+    </ColHead>
+    <ColHead {...props} className={addressColumnClasses} sortField="spec.bmc.address">
       Management Address
     </ColHead>
   </ListHeader>
 );
 
-const HostRow = ({ obj: host }: React.ComponentProps<typeof ResourceRow>) => {
+type HostRowProps = {
+  obj: K8sResourceKind & { machine: K8sResourceKind };
+  style?: React.StyleHTMLAttributes<any>;
+};
+
+const HostRow: React.FC<HostRowProps> = ({ obj: host }) => {
   const name = getName(host);
   const namespace = getNamespace(host);
   // const machineName = getHostMachineName(host);
   const address = getHostBMCAddress(host);
+  const { machine } = host;
 
   // TODO(jtomasek): other resource references will be updated as a subsequent change
   // const machineResource = {
@@ -74,7 +78,7 @@ const HostRow = ({ obj: host }: React.ComponentProps<typeof ResourceRow>) => {
 
   return (
     <ResourceRow obj={host}>
-      <div className={columnClasses}>
+      <div className={nameColumnClasses}>
         <ResourceLink
           kind={referenceForModel(BaremetalHostModel)}
           name={name}
@@ -86,21 +90,19 @@ const HostRow = ({ obj: host }: React.ComponentProps<typeof ResourceRow>) => {
           <BaremetalHostStatus host={host} />
         </WithResources>
       </div> */}
-      <div className={columnClasses}>
+      <div className={machineColumnClasses}>
         <MachineCell host={host} />
       </div>
-      {/* <div className={roleColumnClasses}>
-        <WithResources resourceMap={machineName ? hostResourceMap : {}}>
-          <BaremetalHostRole />
-        </WithResources>
-      </div> */}
-      <div className={columnClasses}>{address}</div>
+      <div className={roleColumnClasses}>
+        <BaremetalHostRole machine={machine} />
+      </div>
+      <div className={addressColumnClasses}>{address}</div>
     </ResourceRow>
   );
 };
 
-const HostList = (props: React.ComponentProps<typeof List>) => (
-  <List {...props} Header={HostHeader} Row={HostRow} />
+const HostList: React.FC<React.ComponentProps<typeof List>> = (props) => (
+  <List {...props} Header={HostHeader} Row={HostRow} virtualize />
 );
 
 // TODO(jtomasek): re-enable filters once the extension point for list.tsx is in place
@@ -118,13 +120,45 @@ type BaremetalHostsPageProps = {
   namespace: string;
 };
 
-export const BaremetalHostsPage = (props: BaremetalHostsPageProps) => (
-  <ListPage
-    {...props}
-    canCreate
-    rowFilters={filters}
-    createButtonText="Add Host"
-    kind={referenceForModel(BaremetalHostModel)}
-    ListComponent={HostList}
-  />
-);
+export const BaremetalHostsPage: React.FC<BaremetalHostsPageProps> = (props) => {
+  const hostsResource = {
+    kind: referenceForModel(BaremetalHostModel),
+    namespaced: true,
+    prop: 'hosts',
+  };
+  const machinesResource = {
+    kind: referenceForModel(MachineModel),
+    namespaced: true,
+    prop: 'machines',
+  };
+
+  const flatten = (resources) => {
+    // TODO(jtomasek): Remove loaded check once ListPageWrapper_ is updated to call flatten only
+    // when resources are loaded
+    const loaded = _.every(resources, (resource) =>
+      resource.optional ? resource.loaded || !_.isEmpty(resource.loadError) : resource.loaded,
+    );
+    const {
+      hosts: { data: hostsData },
+      machines: { data: machinesData },
+    } = resources;
+
+    if (loaded) {
+      return hostsData.map((host) => ({ ...host, machine: getHostMachine(host, machinesData) }));
+    }
+    return [];
+  };
+
+  return (
+    <MultiListPage
+      {...props}
+      canCreate
+      rowFilters={filters}
+      createButtonText="Add Host"
+      resources={[hostsResource, machinesResource]}
+      namespace={props.namespace}
+      flatten={flatten}
+      ListComponent={HostList}
+    />
+  );
+};
diff --git a/frontend/packages/metal3-plugin/src/components/machine-cell.tsx b/frontend/packages/metal3-plugin/src/components/machine-cell.tsx
index ee194f676a0..75cfd60883a 100644
--- a/frontend/packages/metal3-plugin/src/components/machine-cell.tsx
+++ b/frontend/packages/metal3-plugin/src/components/machine-cell.tsx
@@ -13,7 +13,7 @@ interface MachineCellProps {
   host: K8sResourceKind;
 }
 
-const MachineCell = ({ host }: MachineCellProps) => {
+const MachineCell: React.FC<MachineCellProps> = ({ host }) => {
   const machineName = getHostMachineName(host);
 
   const {
diff --git a/frontend/packages/metal3-plugin/src/models.ts b/frontend/packages/metal3-plugin/src/models.ts
index e8204ad97ab..7437216dee9 100644
--- a/frontend/packages/metal3-plugin/src/models.ts
+++ b/frontend/packages/metal3-plugin/src/models.ts
@@ -5,7 +5,7 @@ export const BaremetalHostModel: K8sKind = {
   labelPlural: 'Bare Metal Hosts',
   apiVersion: 'v1alpha1',
   path: 'baremetalhosts',
-  apiGroup: 'metalkube.org',
+  apiGroup: 'metal3.io',
   plural: 'baremetalhosts',
   abbr: 'BMH',
   namespaced: true,
diff --git a/frontend/packages/metal3-plugin/src/selectors/index.ts b/frontend/packages/metal3-plugin/src/selectors/index.ts
index bdd78b9e73b..1caaead9615 100644
--- a/frontend/packages/metal3-plugin/src/selectors/index.ts
+++ b/frontend/packages/metal3-plugin/src/selectors/index.ts
@@ -1,5 +1,8 @@
 import * as _ from 'lodash-es';
 
+import { K8sResourceKind } from '@console/internal/module/k8s';
+import { getName } from '@console/shared';
+
 export const getOperationalStatus = (host) => _.get(host, 'status.operationalStatus');
 export const getProvisioningState = (host) => _.get(host, 'status.provisioning.state');
 export const getHostMachineName = (host) => _.get(host, 'spec.machineRef.name');
@@ -14,3 +17,5 @@ export const getHostDescription = (host) => _.get(host, 'spec.description', '');
 export const isHostPoweredOn = (host) => _.get(host, 'status.poweredOn', false);
 export const getHostTotalStorageCapacity = (host) =>
   _.reduce(getHostStorage(host), (sum, disk) => sum + disk.sizeGiB, 0);
+export const getHostMachine = (host: K8sResourceKind, machines: K8sResourceKind[]) =>
+  machines.find((machine) => getHostMachineName(host) === getName(machine));

From 657e50c0ce363478d9f44fa7669774c2581a47d2 Mon Sep 17 00:00:00 2001
From: Jiri Tomasek <jtomasek@redhat.com>
Date: Mon, 10 Jun 2019 12:35:23 +0200
Subject: [PATCH 2/5] Add Nodes to Host MultiListPage

---
 .../metal3-plugin/src/components/host.tsx     | 20 ++++++++++++++-----
 1 file changed, 15 insertions(+), 5 deletions(-)

diff --git a/frontend/packages/metal3-plugin/src/components/host.tsx b/frontend/packages/metal3-plugin/src/components/host.tsx
index 892ea60757b..7dc7ddf3470 100644
--- a/frontend/packages/metal3-plugin/src/components/host.tsx
+++ b/frontend/packages/metal3-plugin/src/components/host.tsx
@@ -1,8 +1,8 @@
 import * as React from 'react';
 import * as _ from 'lodash-es';
 
-import { getName, getNamespace } from '@console/shared';
-import { MachineModel } from '@console/internal/models';
+import { getName, getNamespace, getMachineNode } from '@console/shared';
+import { MachineModel, NodeModel } from '@console/internal/models';
 
 import {
   ListHeader,
@@ -46,7 +46,7 @@ const HostHeader = (props: React.ComponentProps<typeof ColHead>) => (
 );
 
 type HostRowProps = {
-  obj: K8sResourceKind & { machine: K8sResourceKind };
+  obj: K8sResourceKind & { machine: K8sResourceKind; node: K8sResourceKind };
   style?: React.StyleHTMLAttributes<any>;
 };
 
@@ -131,6 +131,11 @@ export const BaremetalHostsPage: React.FC<BaremetalHostsPageProps> = (props) =>
     namespaced: true,
     prop: 'machines',
   };
+  const nodesResource = {
+    kind: NodeModel.kind,
+    namespaced: false,
+    prop: 'nodes',
+  };
 
   const flatten = (resources) => {
     // TODO(jtomasek): Remove loaded check once ListPageWrapper_ is updated to call flatten only
@@ -141,10 +146,15 @@ export const BaremetalHostsPage: React.FC<BaremetalHostsPageProps> = (props) =>
     const {
       hosts: { data: hostsData },
       machines: { data: machinesData },
+      nodes: { data: nodesData },
     } = resources;
 
     if (loaded) {
-      return hostsData.map((host) => ({ ...host, machine: getHostMachine(host, machinesData) }));
+      return hostsData.map((host) => {
+        const machine = getHostMachine(host, machinesData);
+        const node = getMachineNode(machine, nodesData);
+        return { ...host, machine, node };
+      });
     }
     return [];
   };
@@ -155,8 +165,8 @@ export const BaremetalHostsPage: React.FC<BaremetalHostsPageProps> = (props) =>
       canCreate
       rowFilters={filters}
       createButtonText="Add Host"
-      resources={[hostsResource, machinesResource]}
       namespace={props.namespace}
+      resources={[hostsResource, machinesResource, nodesResource]}
       flatten={flatten}
       ListComponent={HostList}
     />

From 91f354e1d30fa6d0ce5da43ef39dcbdf53553b91 Mon Sep 17 00:00:00 2001
From: Jiri Tomasek <jtomasek@redhat.com>
Date: Thu, 13 Jun 2019 16:16:34 +0200
Subject: [PATCH 3/5] Convert Baremetal Hosts list to use PF4 table

---
 .../metal3-plugin/src/components/host.tsx     | 125 ++++++++++--------
 1 file changed, 72 insertions(+), 53 deletions(-)

diff --git a/frontend/packages/metal3-plugin/src/components/host.tsx b/frontend/packages/metal3-plugin/src/components/host.tsx
index 7dc7ddf3470..b77bf553144 100644
--- a/frontend/packages/metal3-plugin/src/components/host.tsx
+++ b/frontend/packages/metal3-plugin/src/components/host.tsx
@@ -1,17 +1,13 @@
 import * as React from 'react';
 import * as _ from 'lodash-es';
+import * as classNames from 'classnames';
+import { sortable } from '@patternfly/react-table';
 
 import { getName, getNamespace, getMachineNode } from '@console/shared';
 import { MachineModel, NodeModel } from '@console/internal/models';
 
-import {
-  ListHeader,
-  ColHead,
-  List,
-  MultiListPage,
-  ResourceRow,
-} from '@console/internal/components/factory';
-import { ResourceLink } from '@console/internal/components/utils';
+import { MultiListPage, Table, TableRow, TableData } from '@console/internal/components/factory';
+import { ResourceLink, Kebab } from '@console/internal/components/utils';
 import { referenceForModel, K8sResourceKind } from '@console/internal/module/k8s';
 
 import { BaremetalHostModel } from '../models';
@@ -19,38 +15,54 @@ import { getHostBMCAddress, getHostMachine } from '../selectors';
 import { BaremetalHostRole } from './host-role';
 import MachineCell from './machine-cell';
 
-const nameColumnClasses = 'col-lg-4 col-md-4 col-sm-6 col-xs-6';
-// const statusColumnClasses = 'col-lg-2 col-md-4 hidden-sm hidden-xs';
-const machineColumnClasses = 'col-lg-3 visible-lg';
-const roleColumnClasses = 'col-lg-2 visible-lg';
-const addressColumnClasses = 'col-lg-2 visible-lg';
-
-const HostHeader = (props: React.ComponentProps<typeof ColHead>) => (
-  <ListHeader>
-    <ColHead {...props} className={nameColumnClasses} sortField="metadata.name">
-      Name
-    </ColHead>
-    {/* <ColHead {...props} className={statusColumnClasses}>
-      Status
-    </ColHead> */}
-    <ColHead {...props} className={machineColumnClasses} sortField="spec.machineRef.name">
-      Machine
-    </ColHead>
-    <ColHead {...props} className={roleColumnClasses}>
-      Role
-    </ColHead>
-    <ColHead {...props} className={addressColumnClasses} sortField="spec.bmc.address">
-      Management Address
-    </ColHead>
-  </ListHeader>
-);
-
-type HostRowProps = {
+const tableColumnClasses = [
+  classNames('col-lg-5', 'col-md-8', 'col-sm-12', 'col-xs-12'),
+  classNames('col-lg-2', 'col-md-4', 'col-sm-6', 'hidden-xs'),
+  classNames('col-lg-3', 'col-md-4', 'hidden-sm', 'hidden-xs'),
+  classNames('col-lg-2', 'hidden-md', 'hidden-sm', 'hidden-xs'),
+  classNames('col-lg-2', 'hidden-md', 'hidden-sm', 'hidden-xs'),
+  Kebab.columnClass,
+];
+
+const HostsTableHeader = () => [
+  {
+    title: 'Name',
+    sortField: 'metadata.name',
+    transforms: [sortable],
+    props: { className: tableColumnClasses[0] },
+  },
+  {
+    title: 'Machine',
+    sortField: 'spec.machineRef.name',
+    transforms: [sortable],
+    props: { className: tableColumnClasses[2] },
+  },
+  {
+    title: 'Role',
+    sortField: 'machine.metadata.labels["machine.openshift.io/cluster-api-machine-role"]',
+    transforms: [sortable],
+    props: { className: tableColumnClasses[3] },
+  },
+  {
+    title: 'Management Address',
+    sortField: 'spec.machineRef.name',
+    transforms: [sortable],
+    props: { className: tableColumnClasses[4] },
+  },
+  // {
+  //   title: '',
+  //   props: { className: tableColumnClasses[5] },
+  // },
+];
+
+type HostsTableRowProps = {
   obj: K8sResourceKind & { machine: K8sResourceKind; node: K8sResourceKind };
-  style?: React.StyleHTMLAttributes<any>;
+  index: number;
+  key?: string;
+  style: React.StyleHTMLAttributes<any>;
 };
 
-const HostRow: React.FC<HostRowProps> = ({ obj: host }) => {
+const HostsTableRow: React.FC<HostsTableRowProps> = ({ obj: host, index, key, style }) => {
   const name = getName(host);
   const namespace = getNamespace(host);
   // const machineName = getHostMachineName(host);
@@ -77,32 +89,39 @@ const HostRow: React.FC<HostRowProps> = ({ obj: host }) => {
   // };
 
   return (
-    <ResourceRow obj={host}>
-      <div className={nameColumnClasses}>
+    <TableRow id={host.metadata.uid} index={index} trKey={key} style={style}>
+      <TableData className={tableColumnClasses[0]}>
         <ResourceLink
           kind={referenceForModel(BaremetalHostModel)}
           name={name}
           namespace={namespace}
         />
-      </div>
-      {/* <div className={statusColumnClasses}>
-        <WithResources resourceMap={machineName ? hostResourceMap : {}}>
-          <BaremetalHostStatus host={host} />
-        </WithResources>
-      </div> */}
-      <div className={machineColumnClasses}>
+      </TableData>
+      {/* <TableData className={tableColumnClasses[0]}>
+           <BaremetalHostStatus host={host} />
+       </TableData> */}
+      <TableData className={tableColumnClasses[2]}>
         <MachineCell host={host} />
-      </div>
-      <div className={roleColumnClasses}>
+      </TableData>
+      <TableData className={tableColumnClasses[3]}>
         <BaremetalHostRole machine={machine} />
-      </div>
-      <div className={addressColumnClasses}>{address}</div>
-    </ResourceRow>
+      </TableData>
+      <TableData className={tableColumnClasses[4]}>{address}</TableData>
+      {/* <TableData className={tableColumnClasses[5]}>
+        TODO(jtomasek): Add host actions here
+      </TableData> */}
+    </TableRow>
   );
 };
 
-const HostList: React.FC<React.ComponentProps<typeof List>> = (props) => (
-  <List {...props} Header={HostHeader} Row={HostRow} virtualize />
+const HostList: React.FC<React.ComponentProps<typeof Table>> = (props) => (
+  <Table
+    {...props}
+    aria-label="Baremetal Hosts"
+    Header={HostsTableHeader}
+    Row={HostsTableRow}
+    virtualize
+  />
 );
 
 // TODO(jtomasek): re-enable filters once the extension point for list.tsx is in place

From 5017a6f39a5d1797bb3576e198ff9d4c11f5cb26 Mon Sep 17 00:00:00 2001
From: Jiri Tomasek <jtomasek@redhat.com>
Date: Thu, 13 Jun 2019 18:09:13 +0200
Subject: [PATCH 4/5] Disable react/prop-types eslint rule

due to false positives in typescript when using React.FC
---
 .../packages/eslint-plugin-console/lib/config/rules/react.js  | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/frontend/packages/eslint-plugin-console/lib/config/rules/react.js b/frontend/packages/eslint-plugin-console/lib/config/rules/react.js
index 51d11b214ad..5feacbdf934 100644
--- a/frontend/packages/eslint-plugin-console/lib/config/rules/react.js
+++ b/frontend/packages/eslint-plugin-console/lib/config/rules/react.js
@@ -11,4 +11,8 @@ module.exports = {
 
   // One JSX element Per line
   'react/jsx-one-expression-per-line': 'off',
+
+  // Prevent missing props validation in a React component definition
+  // Off due to false positives in typescript
+  'react/prop-types': 'off',
 };

From 3c293aa4b49884187b79ffe56f0d2c3e3c921083 Mon Sep 17 00:00:00 2001
From: Jiri Tomasek <jtomasek@redhat.com>
Date: Mon, 17 Jun 2019 13:52:32 +0200
Subject: [PATCH 5/5] Use machine selectors from @console/shared

* update machine selector types to use specific kinds
* remove selectors definition from machine module
* use machine selectors from @console/shared in machine, machine-set
  and machine-deployment modules
---
 .../console-shared/src/selectors/machine.ts     | 17 ++++++++++++-----
 .../metal3-plugin/src/components/host-role.tsx  |  4 ++--
 .../metal3-plugin/src/components/host.tsx       |  9 +++++++--
 .../metal3-plugin/src/selectors/index.ts        |  4 ++--
 .../public/components/machine-deployment.tsx    |  2 +-
 frontend/public/components/machine-set.tsx      |  3 ++-
 frontend/public/components/machine.tsx          | 16 ++++++----------
 7 files changed, 32 insertions(+), 23 deletions(-)

diff --git a/frontend/packages/console-shared/src/selectors/machine.ts b/frontend/packages/console-shared/src/selectors/machine.ts
index 4f2742178db..bfeb8ba7651 100644
--- a/frontend/packages/console-shared/src/selectors/machine.ts
+++ b/frontend/packages/console-shared/src/selectors/machine.ts
@@ -1,11 +1,18 @@
 import * as _ from 'lodash-es';
 
-import { K8sResourceKind } from '@console/internal/module/k8s';
+import {
+  MachineKind,
+  MachineSetKind,
+  MachineDeploymentKind,
+  NodeKind,
+} from '@console/internal/module/k8s';
 import { getName } from './common';
 
-export const getMachineRole = (machine) =>
-  _.get(machine, ['metadata', 'labels', 'machine.openshift.io/cluster-api-machine-role']);
-export const getMachineNodeName = (machine) => _.get(machine, 'status.nodeRef.name');
+export const getMachineRole = (obj: MachineKind | MachineSetKind | MachineDeploymentKind) =>
+  _.get(obj, ['metadata', 'labels', 'machine.openshift.io/cluster-api-machine-role']);
+export const getMachineNodeName = (obj: MachineKind) => _.get(obj, 'status.nodeRef.name');
+export const getMachineAWSPlacement = (machine: MachineKind) =>
+  _.get(machine, 'spec.providerSpec.value.placement') || {};
 
-export const getMachineNode = (machine: K8sResourceKind, nodes: K8sResourceKind[]) =>
+export const getMachineNode = (machine: MachineKind, nodes: NodeKind[]) =>
   nodes.find((node) => getMachineNodeName(machine) === getName(node));
diff --git a/frontend/packages/metal3-plugin/src/components/host-role.tsx b/frontend/packages/metal3-plugin/src/components/host-role.tsx
index e4ed0ef480b..5df85d02a83 100644
--- a/frontend/packages/metal3-plugin/src/components/host-role.tsx
+++ b/frontend/packages/metal3-plugin/src/components/host-role.tsx
@@ -1,8 +1,8 @@
 import { getMachineRole, DASH } from '@console/shared';
-import { K8sResourceKind } from '@console/internal/module/k8s';
+import { MachineKind } from '@console/internal/module/k8s';
 
 type BaremetalHostRoleProps = {
-  machine: K8sResourceKind;
+  machine: MachineKind;
 };
 export const BaremetalHostRole: React.FC<BaremetalHostRoleProps> = ({ machine }) =>
   getMachineRole(machine) || DASH;
diff --git a/frontend/packages/metal3-plugin/src/components/host.tsx b/frontend/packages/metal3-plugin/src/components/host.tsx
index b77bf553144..78e25de6cc6 100644
--- a/frontend/packages/metal3-plugin/src/components/host.tsx
+++ b/frontend/packages/metal3-plugin/src/components/host.tsx
@@ -8,7 +8,12 @@ import { MachineModel, NodeModel } from '@console/internal/models';
 
 import { MultiListPage, Table, TableRow, TableData } from '@console/internal/components/factory';
 import { ResourceLink, Kebab } from '@console/internal/components/utils';
-import { referenceForModel, K8sResourceKind } from '@console/internal/module/k8s';
+import {
+  referenceForModel,
+  K8sResourceKind,
+  MachineKind,
+  NodeKind,
+} from '@console/internal/module/k8s';
 
 import { BaremetalHostModel } from '../models';
 import { getHostBMCAddress, getHostMachine } from '../selectors';
@@ -56,7 +61,7 @@ const HostsTableHeader = () => [
 ];
 
 type HostsTableRowProps = {
-  obj: K8sResourceKind & { machine: K8sResourceKind; node: K8sResourceKind };
+  obj: K8sResourceKind & { machine: MachineKind; node: NodeKind };
   index: number;
   key?: string;
   style: React.StyleHTMLAttributes<any>;
diff --git a/frontend/packages/metal3-plugin/src/selectors/index.ts b/frontend/packages/metal3-plugin/src/selectors/index.ts
index 1caaead9615..ac699b9f06c 100644
--- a/frontend/packages/metal3-plugin/src/selectors/index.ts
+++ b/frontend/packages/metal3-plugin/src/selectors/index.ts
@@ -1,6 +1,6 @@
 import * as _ from 'lodash-es';
 
-import { K8sResourceKind } from '@console/internal/module/k8s';
+import { K8sResourceKind, MachineKind } from '@console/internal/module/k8s';
 import { getName } from '@console/shared';
 
 export const getOperationalStatus = (host) => _.get(host, 'status.operationalStatus');
@@ -17,5 +17,5 @@ export const getHostDescription = (host) => _.get(host, 'spec.description', '');
 export const isHostPoweredOn = (host) => _.get(host, 'status.poweredOn', false);
 export const getHostTotalStorageCapacity = (host) =>
   _.reduce(getHostStorage(host), (sum, disk) => sum + disk.sizeGiB, 0);
-export const getHostMachine = (host: K8sResourceKind, machines: K8sResourceKind[]) =>
+export const getHostMachine = (host: K8sResourceKind, machines: MachineKind[]) =>
   machines.find((machine) => getHostMachineName(host) === getName(machine));
diff --git a/frontend/public/components/machine-deployment.tsx b/frontend/public/components/machine-deployment.tsx
index 73aab84463c..e8408a98b3f 100644
--- a/frontend/public/components/machine-deployment.tsx
+++ b/frontend/public/components/machine-deployment.tsx
@@ -3,9 +3,9 @@ import * as _ from 'lodash-es';
 import { Link } from 'react-router-dom';
 import { sortable } from '@patternfly/react-table';
 import * as classNames from 'classnames';
+import { getMachineRole } from '@console/shared';
 import { MachineModel, MachineDeploymentModel } from '../models';
 import { MachineDeploymentKind, referenceForModel } from '../module/k8s';
-import { getMachineRole } from './machine';
 import {
   editCountAction,
   getAWSPlacement,
diff --git a/frontend/public/components/machine-set.tsx b/frontend/public/components/machine-set.tsx
index 4dd43a207ff..6b52c8825a7 100644
--- a/frontend/public/components/machine-set.tsx
+++ b/frontend/public/components/machine-set.tsx
@@ -3,9 +3,10 @@ import * as _ from 'lodash-es';
 import { Link } from 'react-router-dom';
 import { sortable } from '@patternfly/react-table';
 import * as classNames from 'classnames';
+import { getMachineRole } from '@console/shared';
 import { MachineAutoscalerModel, MachineModel, MachineSetModel } from '../models';
 import { K8sKind, MachineDeploymentKind, MachineSetKind, referenceForModel } from '../module/k8s';
-import { getMachineRole, MachinePage } from './machine';
+import { MachinePage } from './machine';
 import { configureMachineAutoscalerModal, configureReplicaCountModal } from './modals';
 import { DetailsPage, ListPage, Table, TableRow, TableData } from './factory';
 import {
diff --git a/frontend/public/components/machine.tsx b/frontend/public/components/machine.tsx
index 91a0662039f..3e31c334a99 100644
--- a/frontend/public/components/machine.tsx
+++ b/frontend/public/components/machine.tsx
@@ -2,8 +2,9 @@ import * as React from 'react';
 import * as _ from 'lodash-es';
 import { sortable } from '@patternfly/react-table';
 import * as classNames from 'classnames';
+import { getMachineRole, getMachineNodeName, getMachineAWSPlacement } from '@console/shared';
 import { MachineModel } from '../models';
-import { MachineDeploymentKind, MachineKind, MachineSetKind, referenceForModel } from '../module/k8s';
+import { MachineKind, referenceForModel } from '../module/k8s';
 import { Conditions } from './conditions';
 import { NodeIPList } from './node';
 import { DetailsPage, ListPage, Table, TableRow, TableData } from './factory';
@@ -21,11 +22,6 @@ import { breadcrumbsForOwnerRefs } from './utils/breadcrumbs';
 const { common } = Kebab.factory;
 const menuActions = [...common];
 export const machineReference = referenceForModel(MachineModel);
-const getAWSPlacement = (machine: MachineKind) => _.get(machine, 'spec.providerSpec.value.placement') || {};
-
-export const getMachineRole = (obj: MachineKind | MachineSetKind | MachineDeploymentKind) => _.get(obj, ['metadata', 'labels', 'sigs.k8s.io/cluster-api-machine-role']);
-
-const getNodeName = (obj) => _.get(obj, 'status.nodeRef.name');
 
 const tableColumnClasses = [
   classNames('pf-m-3-col-on-xl', 'pf-m-4-col-on-lg', 'pf-m-4-col-on-md', 'pf-m-6-col-on-sm'),
@@ -66,8 +62,8 @@ const MachineTableHeader = () => {
 MachineTableHeader.displayName = 'MachineTableHeader';
 
 const MachineTableRow: React.FC<MachineTableRowProps> = ({obj, index, key, style}) => {
-  const { availabilityZone, region } = getAWSPlacement(obj);
-  const nodeName = getNodeName(obj);
+  const { availabilityZone, region } = getMachineAWSPlacement(obj);
+  const nodeName = getMachineNodeName(obj);
   return (
     <TableRow id={obj.metadata.uid} index={index} trKey={key} style={style}>
       <TableData className={classNames(tableColumnClasses[0], 'co-break-word')}>
@@ -100,9 +96,9 @@ type MachineTableRowProps = {
 };
 
 const MachineDetails: React.SFC<MachineDetailsProps> = ({obj}: {obj: MachineKind}) => {
-  const nodeName = getNodeName(obj);
+  const nodeName = getMachineNodeName(obj);
   const machineRole = getMachineRole(obj);
-  const { availabilityZone, region } = getAWSPlacement(obj);
+  const { availabilityZone, region } = getMachineAWSPlacement(obj);
   return <React.Fragment>
     <div className="co-m-pane__body">
       <SectionHeading text="Machine Overview" />