From a59aa44249bd46b3d714161a89baa5c69d882329 Mon Sep 17 00:00:00 2001
From: Kia Lam <digitalanime@gmail.com>
Date: Mon, 29 Aug 2022 12:38:44 -0700
Subject: [PATCH] Update status label to reflect instance node states.

---
 .../src/components/StatusIcon/StatusIcon.js   |  7 +++++++
 awx/ui/src/components/StatusIcon/icons.js     |  8 ++++++++
 .../src/components/StatusLabel/StatusLabel.js | 20 +++++++++++++++++++
 .../Instances/InstanceListItem.js             |  2 +-
 .../InstanceList/InstanceListItem.js          |  2 +-
 .../InstancePeers/InstancePeerListItem.js     |  2 +-
 6 files changed, 38 insertions(+), 3 deletions(-)

diff --git a/awx/ui/src/components/StatusIcon/StatusIcon.js b/awx/ui/src/components/StatusIcon/StatusIcon.js
index 71149f8753..d63da75fd6 100644
--- a/awx/ui/src/components/StatusIcon/StatusIcon.js
+++ b/awx/ui/src/components/StatusIcon/StatusIcon.js
@@ -22,6 +22,13 @@ const colors = {
   disabled: gray,
   canceled: orange,
   changed: orange,
+  /* Instance statuses */
+  ready: green,
+  installed: blue,
+  provisioning: gray,
+  deprovisioning: gray,
+  'provision-fail': red,
+  'deprovision-fail': red,
 };
 
 function StatusIcon({ status, ...props }) {
diff --git a/awx/ui/src/components/StatusIcon/icons.js b/awx/ui/src/components/StatusIcon/icons.js
index e91174661d..01eb1704ba 100644
--- a/awx/ui/src/components/StatusIcon/icons.js
+++ b/awx/ui/src/components/StatusIcon/icons.js
@@ -7,6 +7,7 @@ import {
   ClockIcon,
   MinusCircleIcon,
   InfoCircleIcon,
+  PlusCircleIcon,
 } from '@patternfly/react-icons';
 
 const Spin = keyframes`
@@ -40,5 +41,12 @@ const icons = {
   skipped: MinusCircleIcon,
   canceled: ExclamationTriangleIcon,
   changed: ExclamationTriangleIcon,
+  /* Instance statuses */
+  ready: CheckCircleIcon,
+  installed: ClockIcon,
+  provisioning: PlusCircleIcon,
+  deprovisioning: MinusCircleIcon,
+  'provision-fail': ExclamationCircleIcon,
+  'deprovision-fail': ExclamationCircleIcon,
 };
 export default icons;
diff --git a/awx/ui/src/components/StatusLabel/StatusLabel.js b/awx/ui/src/components/StatusLabel/StatusLabel.js
index f7a91c8af2..dc78fd69e6 100644
--- a/awx/ui/src/components/StatusLabel/StatusLabel.js
+++ b/awx/ui/src/components/StatusLabel/StatusLabel.js
@@ -24,6 +24,13 @@ const colors = {
   disabled: 'grey',
   canceled: 'orange',
   changed: 'orange',
+  /* Instance statuses */
+  ready: 'green',
+  installed: 'blue',
+  provisioning: 'gray',
+  deprovisioning: 'gray',
+  'provision-fail': 'red',
+  'deprovision-fail': 'red',
 };
 
 export default function StatusLabel({ status, tooltipContent = '', children }) {
@@ -45,6 +52,13 @@ export default function StatusLabel({ status, tooltipContent = '', children }) {
     disabled: t`Disabled`,
     canceled: t`Canceled`,
     changed: t`Changed`,
+    /* Instance statuses */
+    ready: t`Ready`,
+    installed: t`Installed`,
+    provisioning: t`Provisioning`,
+    deprovisioning: t`Deprovisioning`,
+    'provision-fail': t`Provisioning fail`,
+    'deprovision-fail': t`Deprovisioning fail`,
   };
   const label = upperCaseStatus[status] || status;
   const color = colors[status] || 'grey';
@@ -88,5 +102,11 @@ StatusLabel.propTypes = {
     'disabled',
     'canceled',
     'changed',
+    'ready',
+    'installed',
+    'provisioning',
+    'deprovisioning',
+    'provision-fail',
+    'deprovision-fail',
   ]).isRequired,
 };
diff --git a/awx/ui/src/screens/InstanceGroup/Instances/InstanceListItem.js b/awx/ui/src/screens/InstanceGroup/Instances/InstanceListItem.js
index 5d3c2e25a8..60a1cc49a5 100644
--- a/awx/ui/src/screens/InstanceGroup/Instances/InstanceListItem.js
+++ b/awx/ui/src/screens/InstanceGroup/Instances/InstanceListItem.js
@@ -136,7 +136,7 @@ function InstanceListItem({
               </div>
             }
           >
-            <StatusLabel status={instance.errors ? 'error' : 'healthy'} />
+            <StatusLabel status={instance.node_state} />
           </Tooltip>
         </Td>
         <Td dataLabel={t`Node Type`}>{instance.node_type}</Td>
diff --git a/awx/ui/src/screens/Instances/InstanceList/InstanceListItem.js b/awx/ui/src/screens/Instances/InstanceList/InstanceListItem.js
index fc89bdd3fc..f01134f266 100644
--- a/awx/ui/src/screens/Instances/InstanceList/InstanceListItem.js
+++ b/awx/ui/src/screens/Instances/InstanceList/InstanceListItem.js
@@ -143,7 +143,7 @@ function InstanceListItem({
               </div>
             }
           >
-            <StatusLabel status={instance.errors ? 'error' : 'healthy'} />
+            <StatusLabel status={instance.node_state} />
           </Tooltip>
         </Td>
 
diff --git a/awx/ui/src/screens/Instances/InstancePeers/InstancePeerListItem.js b/awx/ui/src/screens/Instances/InstancePeers/InstancePeerListItem.js
index defa7c11d9..bc3b5ad912 100644
--- a/awx/ui/src/screens/Instances/InstancePeers/InstancePeerListItem.js
+++ b/awx/ui/src/screens/Instances/InstancePeers/InstancePeerListItem.js
@@ -144,7 +144,7 @@ function InstancePeerListItem({
               </div>
             }
           >
-            <StatusLabel status={peerInstance.errors ? 'error' : 'healthy'} />
+            <StatusLabel status={peerInstance.node_state} />
           </Tooltip>
         </Td>