From 1feed9b3c80cc371e0d0377a03c3631d013d42a2 Mon Sep 17 00:00:00 2001
From: Rohit Yadav <rohit.yadav@shapeblue.com>
Date: Tue, 15 Oct 2019 18:40:47 +0530
Subject: [PATCH] config: fix all actions in infra

Signed-off-by: Rohit Yadav <rohit.yadav@shapeblue.com>
---
 ui/src/config/section/infra/clusters.js       | 130 +++++------
 ui/src/config/section/infra/hosts.js          | 212 ++++++++---------
 ui/src/config/section/infra/pods.js           |  46 ++--
 .../config/section/infra/primaryStorages.js   |  34 +--
 ui/src/config/section/infra/routers.js        |  76 +++----
 .../config/section/infra/secondaryStorages.js |  10 +-
 ui/src/config/section/infra/systemVms.js      |  54 ++---
 ui/src/config/section/infra/zones.js          | 214 +++++++++---------
 8 files changed, 340 insertions(+), 436 deletions(-)

diff --git a/ui/src/config/section/infra/clusters.js b/ui/src/config/section/infra/clusters.js
index c0f844b0c85..092848987c5 100644
--- a/ui/src/config/section/infra/clusters.js
+++ b/ui/src/config/section/infra/clusters.js
@@ -2,8 +2,8 @@ export default {
   name: 'cluster',
   title: 'Clusters',
   icon: 'cluster',
-  permission: [ 'listClusters', 'listClustersMetrics' ],
-  columns: [ 'name', 'allocationstate', 'clustertype', 'hypervisortype', 'podname', 'zonename' ],
+  permission: [ 'listClustersMetrics', 'listClusters' ],
+  columns: [ 'name', 'state', 'clustertype', 'hypervisortype', 'hosts', 'cpuused', 'cpumaxdeviation', 'cpuallocated', 'cputotal', 'memoryused', 'memorymaxdeviation', 'memoryallocated', 'memorytotal', 'podname', 'zonename' ],
   details: [ 'name', 'id', 'allocationstate', 'clustertype', 'hypervisortype', 'podname', 'zonename' ],
   actions: [
     {
@@ -11,122 +11,110 @@ export default {
       icon: 'plus',
       label: 'label.add.cluster',
       listView: true,
-      args: [
-        'zoneId', 'hypervisor', 'clustertype', 'podId', 'clustername'
-      ]
+      args: ['zoneid', 'hypervisor', 'podid', 'clustername']
     },
     {
       api: 'updateCluster',
-      icon: 'enable',
+      icon: 'pause-circle',
       label: 'label.action.enable.cluster',
       dataView: true,
-      hidden: (record) => { return record.allocationstate === 'Disabled' },
-      args: [
-        'id'
-      ],
-      defaultArgs: { allocationstate: 'Enabled' }
+      args: ['id'],
+      defaultArgs: { allocationstate: 'Disabled' },
+      show: (record) => { return record.allocationstate === 'Enabled' }
     },
     {
       api: 'updateCluster',
-      icon: 'disable',
+      icon: 'play-circle',
       label: 'label.action.disable.cluster',
       dataView: true,
-      hidden: (record) => { return record.allocationstate === 'Enabled' },
-      args: [
-        'id'
-      ],
-      defaultArgs: { allocationstate: 'Disabled' }
+      args: [ 'id' ],
+      defaultArgs: { allocationstate: 'Enabled' },
+      show: (record) => { return record.allocationstate === 'Disabled' }
     },
     {
       api: 'dedicateCluster',
-      icon: 'dedicate',
+      icon: 'user-add',
       label: 'label.dedicate.cluster',
       dataView: true,
-      hidden: (record) => { return record.domainid === null },
-      args: [
-        'clusterId', 'domainId', 'account'
-      ]
+      args: ['clusterid', 'domainid', 'account'],
+      show: (record) => { return !record.domainid }
     },
     {
       api: 'releaseDedicatedCluster',
-      icon: 'release',
+      icon: 'user-delete',
       label: 'label.release.dedicated.cluster',
       dataView: true,
-      hidden: (record) => { return record.domainid !== null },
-      args: [
-        'clusterid'
-      ]
+      args: ['clusterid'],
+      show: (record) => { return record.domainid }
     },
     {
       api: 'updateCluster',
-      icon: 'managed',
-      label: 'label.add.zone',
+      icon: 'plus-square',
+      label: 'Manage Cluster',
       dataView: true,
-      hidden: (record) => { return record.state !== 'Enabled' && record.state !== 'Disabled' },
-      args: [
-        'id'
-      ],
-      defaultArgs: { managedstate: 'Managed' }
+      args: ['id'],
+      defaultArgs: { managedstate: 'Managed' },
+      show: (record) => { return record.clustertype === 'CloudManaged' && ['PrepareUnmanaged', 'Unmanaged'].includes(record.state) }
     },
     {
       api: 'updateCluster',
-      icon: 'unmanaged',
-      label: 'label.add.zone',
+      icon: 'minus-square',
+      label: 'Unmanage Cluster',
       dataView: true,
-      hidden: (record) => { return record.state === 'Enabled' || record.state === 'Disabled' },
-      args: [
-        'id'
-      ],
-      defaultArgs: { managedstate: 'Unmanaged' }
-    },
-    {
-      api: 'disableOutOfBandManagementForCluster',
-      icon: 'disableband',
-      label: 'label.outofbandmanagement.disable',
-      dataView: true,
-      hidden: (record) => { return !(record.resourcedetails && record.resourcedetails.outOfBandManagementEnabled && record.resourcedetails.outOfBandManagementEnabled === 'false') },
-      args: [
-        'clusterid'
-      ]
+      args: ['id'],
+      defaultArgs: { managedstate: 'Unmanaged' },
+      show: (record) => { return record.clustertype === 'CloudManaged' && record.state === 'Enabled' }
     },
     {
       api: 'enableOutOfBandManagementForCluster',
-      icon: 'enableband',
+      icon: 'plus-circle',
       label: 'label.outofbandmanagement.enable',
       dataView: true,
-      hidden: (record) => { return record.resourcedetails && record.resourcedetails.outOfBandManagementEnabled && record.resourcedetails.outOfBandManagementEnabled === 'false' },
-      args: [
-        'clusterid'
-      ]
+      args: ['clusterid'],
+      show: (record) => {
+        return !record.resourcedetails || !record.resourcedetails.outOfBandManagementEnabled ||
+          record.resourcedetails.outOfBandManagementEnabled === 'false'
+      }
     },
     {
-      api: 'disableHAForCluster',
-      icon: 'disableha',
-      label: 'label.ha.disable',
+      api: 'disableOutOfBandManagementForCluster',
+      icon: 'minus-circle',
+      label: 'label.outofbandmanagement.disable',
       dataView: true,
-      hidden: (record) => { return !(record.resourcedetails && record.resourcedetails.resourceHAEnabled && record.resourcedetails.resourceHAEnabled === 'false') },
-      args: [
-        'clusterid'
-      ]
+      args: ['clusterid'],
+      show: (record) => {
+        return record.resourcedetails && record.resourcedetails.outOfBandManagementEnabled &&
+          record.resourcedetails.outOfBandManagementEnabled === 'true'
+      }
     },
     {
       api: 'enableHAForCluster',
-      icon: 'enableha',
+      icon: 'eye',
       label: 'label.ha.enable',
       dataView: true,
-      hidden: (record) => { return record.resourcedetails && record.resourcedetails.resourceHAEnabled && record.resourcedetails.resourceHAEnabled === 'false' },
-      args: [
-        'clusterid'
-      ]
+      args: ['clusterid'],
+      show: (record) => {
+        return !record.resourcedetails || !record.resourcedetails.resourceHAEnabled ||
+          record.resourcedetails.resourceHAEnabled === 'false'
+      }
+    },
+    {
+      api: 'disableHAForCluster',
+      icon: 'eye-invisible',
+      label: 'label.ha.disable',
+      dataView: true,
+      args: ['clusterid'],
+      show: (record) => {
+        return record.resourcedetails && record.resourcedetails.resourceHAEnabled &&
+          record.resourcedetails.resourceHAEnabled === 'true'
+      }
     },
     {
       api: 'deleteCluster',
       icon: 'delete',
       label: 'label.action.delete.cluster',
       dataView: true,
-      args: [
-        'id'
-      ]
+      args: ['id']
     }
   ]
 }
diff --git a/ui/src/config/section/infra/hosts.js b/ui/src/config/section/infra/hosts.js
index 6fafce3c0eb..111315d113a 100644
--- a/ui/src/config/section/infra/hosts.js
+++ b/ui/src/config/section/infra/hosts.js
@@ -2,10 +2,10 @@ export default {
   name: 'host',
   title: 'Hosts',
   icon: 'desktop',
-  permission: [ 'listHosts', 'listHostsMetrics' ],
+  permission: [ 'listHostsMetrics', 'listHosts' ],
   resourceType: 'Host',
   params: { 'type': 'routing' },
-  columns: [ 'name', 'state', 'resourcestate', 'ipaddress', 'hypervisor', 'hypervisorversion', 'clustername', 'zonename' ],
+  columns: [ 'name', 'state', 'resourcestate', 'powerstate', 'ipaddress', 'hypervisor', 'instances', 'cpunumber', 'cputotalghz', 'cpuusedghz', 'cpuallocatedghz', 'memorytotalgb', 'memoryusedgb', 'memoryallocatedgb', 'networkread', 'networkwrite', 'clustername', 'zonename' ],
   details: [ 'name', 'id', 'resourcestate', 'ipaddress', 'hypervisor', 'hypervisorversion', 'version', 'type', 'oscategoryname', 'hosttags', 'clustername', 'podname', 'zonename', 'created' ],
   actions: [
     {
@@ -13,180 +13,168 @@ export default {
       icon: 'plus',
       label: 'label.add.host',
       listView: true,
-      args: [
-        'zoneid', 'podid', 'clusterid', 'hypervisor', 'hosttags', 'username', 'password', 'url'
-      ]
+      args: ['zoneid', 'podid', 'clusterid', 'hypervisor', 'username', 'password', 'url', 'hosttags']
     },
     {
       api: 'updateHost',
       icon: 'edit',
       label: 'label.edit',
       dataView: true,
-      args: [
-        'id', 'hosttags', 'annotation'
-      ]
-    },
-    {
-      api: 'dedicateHost',
-      icon: 'dedicate',
-      label: 'label.dedicate.host',
-      dataView: true,
-      hidden: (record) => { return record.domainid === null },
-      args: [
-        'hostId', 'domainId', 'account'
-      ]
-    },
-    {
-      api: 'releaseDedicatedHost',
-      icon: 'release',
-      label: 'label.release.dedicated.host',
-      dataView: true,
-      hidden: (record) => { return record.domainid !== null },
-      args: [
-        'hostid'
-      ]
+      args: ['id', 'hosttags', 'oscategoryid']
     },
     {
       api: 'provisionCertificate',
-      icon: 'kvmcertificate',
+      icon: 'safety-certificate',
       label: 'label.action.secure.host',
       dataView: true,
-      hidden: (record) => { return record.hypervisor === 'KVM' },
-      args: [
-        'hostid'
-      ]
-    },
-    {
-      api: 'prepareHostForMaintenance',
-      icon: 'enablemaintenance',
-      label: 'label.action.enable.maintenance.mode',
-      dataView: true,
-      hidden: (record) => { return record.resourcestate === 'Enabled' },
-      args: [
-        'id'
-      ]
-    },
-    {
-      api: 'cancelHostMaintenance',
-      icon: 'cancelmaintenance',
-      label: 'label.action.cancel.maintenance.mode',
-      dataView: true,
-      hidden: (record) => { return record.resourcestate === 'Maintenance' || record.resourcestate === 'ErrorInMaintenance' || record.resourcestate === 'PrepareForMaintenance' },
-      args: [
-        'id'
-      ]
+      args: ['hostid'],
+      show: (record) => { return record.hypervisor === 'KVM' }
     },
     {
       api: 'reconnectHost',
-      icon: 'reconnect',
+      icon: 'forward',
       label: 'label.action.force.reconnect',
       dataView: true,
-      hidden: (record) => { return record.state !== 'Disconnected' },
-      args: [
-        'id'
-      ]
+      args: ['id'],
+      show: (record) => { return ['Disconnected', 'Up'].includes(record.state) }
     },
     {
       api: 'updateHost',
-      icon: 'enable',
-      label: 'label.enable.host',
+      icon: 'pause-circle',
+      label: 'Disable Host',
       dataView: true,
-      hidden: (record) => { return record.allocationstate === 'Enabled' },
-      args: [ 'id' ],
-      defaultArgs: { allocationstate: 'Disabled' }
+      args: ['id'],
+      defaultArgs: { allocationstate: 'Disable' },
+      show: (record) => { return record.resourcestate === 'Enabled' }
     },
     {
       api: 'updateHost',
-      icon: 'disable',
-      label: 'label.disable.host',
+      icon: 'play-circle',
+      label: 'Enable Host',
       dataView: true,
-      hidden: (record) => { return record.allocationstate === 'Disabled' },
       args: [ 'id' ],
-      defaultArgs: { allocationstate: 'Enabled' }
+      defaultArgs: { allocationstate: 'Enable' },
+      show: (record) => { return record.resourcestate === 'Disabled' }
     },
     {
-      api: 'configureHAForHost',
-      icon: 'configureha',
-      label: 'label.ha.configure',
+      api: 'dedicateHost',
+      icon: 'user-add',
+      label: 'label.dedicate.host',
       dataView: true,
-      args: [
-        'provider', 'tags', 'hostid'
-      ]
+      args: ['hostid', 'domainid', 'account'],
+      show: (record) => { return !record.domainid }
     },
     {
-      api: 'enableHAForHost',
-      icon: 'enableha',
-      label: 'label.ha.enable',
+      api: 'releaseDedicatedHost',
+      icon: 'user-delete',
+      label: 'label.release.dedicated.host',
       dataView: true,
-      hidden: (record) => { return !(record.hostha && record.hostha.haenable) },
-      args: [
-        'hostid'
-      ]
+      args: ['hostid'],
+      show: (record) => { return record.domainid }
     },
     {
-      api: 'disableHAForHost',
-      icon: 'disableha',
-      label: 'label.ha.disable',
+      api: 'prepareHostForMaintenance',
+      icon: 'plus-square',
+      label: 'label.action.enable.maintenance.mode',
       dataView: true,
-      hidden: (record) => { return record.hostha && record.hostha.haenable },
-      args: [
-        'hostid'
-      ]
+      args: ['id'],
+      show: (record) => { return record.resourcestate === 'Enabled' }
+    },
+    {
+      api: 'cancelHostMaintenance',
+      icon: 'minus-square',
+      label: 'label.action.cancel.maintenance.mode',
+      dataView: true,
+      args: ['id'],
+      show: (record) => { return record.resourcestate === 'Maintenance' || record.resourcestate === 'ErrorInMaintenance' || record.resourcestate === 'PrepareForMaintenance' }
     },
     {
       api: 'configureOutOfBandManagement',
-      icon: 'plus',
+      icon: 'setting',
       label: 'label.outofbandmanagement.configure',
       dataView: true,
-      args: [
-        'address', 'port', 'username', 'password', 'driver', 'tags', 'hostid'
-      ]
+      args: ['hostid', 'address', 'port', 'username', 'password', 'driver']
     },
     {
       api: 'enableOutOfBandManagementForHost',
-      icon: 'enableband',
+      icon: 'plus-circle',
       label: 'label.outofbandmanagement.enable',
       dataView: true,
-      args: [
-        'hostid'
-      ]
+      args: ['hostid'],
+      show: (record) => {
+        return !record.resourcedetails || !record.resourcedetails.outOfBandManagementEnabled ||
+          record.resourcedetails.outOfBandManagementEnabled === 'false'
+      }
     },
     {
       api: 'disableOutOfBandManagementForHost',
-      icon: 'disableband',
+      icon: 'minus-circle',
       label: 'label.outofbandmanagement.disable',
       dataView: true,
-      args: [
-        'hostid'
-      ]
+      args: ['hostid'],
+      show: (record) => {
+        return record.resourcedetails && record.resourcedetails.outOfBandManagementEnabled &&
+          record.resourcedetails.outOfBandManagementEnabled === 'true'
+      }
     },
     {
       api: 'issueOutOfBandManagementPowerAction',
-      icon: 'issuepowerband',
+      icon: 'login',
       label: 'label.outofbandmanagement.action.issue',
       dataView: true,
-      args: [
-        'action', 'tags', 'hostid'
-      ]
+      args: ['hostid', 'action'],
+      show: (record) => {
+        return record.resourcedetails && record.resourcedetails.outOfBandManagementEnabled &&
+          record.resourcedetails.outOfBandManagementEnabled === 'true'
+      }
     },
     {
       api: 'changeOutOfBandManagementPassword',
-      icon: 'changebandpassword',
+      icon: 'key',
       label: 'label.outofbandmanagement.changepassword',
       dataView: true,
-      args: [
-        'password', 'reenterpassword', 'tags', 'hostid'
-      ]
+      args: ['hostid', 'password'],
+      show: (record) => {
+        return record.resourcedetails && record.resourcedetails.outOfBandManagementEnabled &&
+          record.resourcedetails.outOfBandManagementEnabled === 'true'
+      }
+    },
+    {
+      api: 'configureHAForHost',
+      icon: 'tool',
+      label: 'label.ha.configure',
+      dataView: true,
+      args: ['hostid', 'provider']
+    },
+    {
+      api: 'enableHAForHost',
+      icon: 'eye',
+      label: 'label.ha.enable',
+      dataView: true,
+      args: ['hostid'],
+      show: (record) => {
+        return !record.resourcedetails || !record.resourcedetails.resourceHAEnabled ||
+          record.resourcedetails.resourceHAEnabled === 'false'
+      }
+    },
+    {
+      api: 'disableHAForHost',
+      icon: 'eye-invisible',
+      label: 'label.ha.disable',
+      dataView: true,
+      args: ['hostid'],
+      show: (record) => {
+        return record.resourcedetails && record.resourcedetails.resourceHAEnabled &&
+          record.resourcedetails.resourceHAEnabled === 'true'
+      }
     },
     {
       api: 'deleteHost',
       icon: 'delete',
-      label: 'label.action.delete.host',
+      label: 'Remove Host',
       dataView: true,
-      hidden: (record) => { return !(record.resourcestate === 'Maintenance' || record.resourcestate !== 'Disabled' || record.state === 'Down' || record.state === 'Alert' || record.state === 'Disconnected') },
-      args: [
-        'id', 'forced'
-      ]
+      args: ['id', 'forced'],
+      show: (record) => { return ['Maintenance', 'Disabled', 'Down', 'Alert', 'Disconnected'].includes(record.resourcestate) }
     }
   ]
 }
diff --git a/ui/src/config/section/infra/pods.js b/ui/src/config/section/infra/pods.js
index f5cdf8f74f6..7b6ecaa3cf4 100644
--- a/ui/src/config/section/infra/pods.js
+++ b/ui/src/config/section/infra/pods.js
@@ -11,60 +11,46 @@ export default {
       icon: 'plus',
       label: 'label.add.pod',
       listView: true,
-      popup: true,
-      args: [
-        'zoneid', 'name', 'gateway', 'netmask', 'startip', 'endip'
-      ]
+      args: ['zoneid', 'name', 'gateway', 'netmask', 'startip', 'endip']
     },
     {
       api: 'updatePod',
       icon: 'edit',
       label: 'label.edit',
       dataView: true,
-      args: [
-        'id', 'name', 'netmask', 'gateway'
-      ]
+      args: ['id', 'name', 'netmask', 'gateway']
     },
     {
       api: 'dedicatePod',
-      icon: 'dedicate',
+      icon: 'user-add',
       label: 'label.dedicate.pod',
       dataView: true,
-      hidden: (record) => { return record.domainid !== null },
-      args: [
-        'podId', 'domainid', 'account'
-      ]
+      args: ['podid', 'domainid', 'account'],
+      show: (record) => { return !record.domainid }
     },
     {
       api: 'releaseDedicatedPod',
-      icon: 'release',
+      icon: 'user-delete',
       label: 'label.release.dedicated.pod',
       dataView: true,
-      hidden: (record) => { return record.domainid === null },
-      args: [
-        'podid'
-      ]
+      args: ['podid'],
+      show: (record) => { return record.domainid }
     },
     {
       api: 'updatePod',
-      icon: 'enable',
+      icon: 'play-circle',
       label: 'label.action.enable.pod',
       dataView: true,
-      hidden: (record) => { return record.allocationstate === 'Enabled' },
-      args: [
-        'id'
-      ],
-      defaultArgs: { allocationstate: 'Enabled' }
+      args: ['id'],
+      show: (record) => { return record.allocationstate === 'Disabled' }
     },
     {
       api: 'updatePod',
-      icon: 'disable',
+      icon: 'pause-circle',
       label: 'label.action.disable.pod',
       dataView: true,
-      hidden: (record) => { return record.allocationstate === 'Disabled' },
-      args: [
-        'id'
-      ],
+      args: ['id'],
+      show: (record) => { return record.allocationstate === 'Enabled' },
       defaultArgs: { allocationstate: 'Disabled' }
     },
     {
@@ -72,9 +58,7 @@ export default {
       icon: 'delete',
       label: 'label.action.delete.pod',
       dataView: true,
-      args: [
-        'id'
-      ]
+      args: ['id']
     }
   ]
 }
diff --git a/ui/src/config/section/infra/primaryStorages.js b/ui/src/config/section/infra/primaryStorages.js
index 31eff5d639c..f2737d83c49 100644
--- a/ui/src/config/section/infra/primaryStorages.js
+++ b/ui/src/config/section/infra/primaryStorages.js
@@ -2,8 +2,8 @@ export default {
   name: 'storagepool',
   title: 'Primary Storage',
   icon: 'database',
-  permission: [ 'listStoragePools', 'listStoragePoolsMetrics' ],
-  columns: [ 'name', 'state', 'ipaddress', 'type', 'path', 'scope', 'clustername', 'zonename' ],
+  permission: [ 'listStoragePoolsMetrics', 'listStoragePools' ],
+  columns: [ 'name', 'state', 'ipaddress', 'type', 'path', 'scope', 'disksizeusedgb', 'disksizetotalgb', 'disksizeallocatedgb', 'disksizeunallocatedgb', 'clustername', 'zonename' ],
   details: [ 'name', 'id', 'ipaddress', 'type', 'scope', 'path', 'provider', 'hypervisor', 'overprovisionfactor', 'disksizetotal', 'disksizeallocated', 'disksizeused', 'clustername', 'podname', 'zonename', 'created' ],
   actions: [
     {
@@ -11,48 +11,38 @@ export default {
       icon: 'plus',
       label: 'label.add.primary.storage',
       listView: true,
-      args: [
-        'scope', 'zoneid', 'podid', 'clusterid', 'name', 'provider', 'managed', 'capacityBytes', 'capacityIops', 'url', 'tags'
-      ]
+      args: ['scope', 'zoneid', 'podid', 'clusterid', 'name', 'provider', 'managed', 'capacityBytes', 'capacityIops', 'url', 'tags']
     },
     {
       api: 'updateStoragePool',
       icon: 'edit',
       label: 'label.edit',
       dataView: true,
-      args: [
-        'id', 'tags', 'capacitybytes', 'capacityiops'
-      ]
+      args: ['id', 'tags', 'capacitybytes', 'capacityiops']
     },
     {
       api: 'enableStorageMaintenance',
-      icon: 'enablemaintenance',
+      icon: 'plus-square',
       label: 'label.action.enable.maintenance.mode',
       dataView: true,
-      hidden: (record) => { return !(record.state === 'Up' || record.state === 'Connecting' || record.state === 'Down' || record.state === 'ErrorInMaintenance') },
-      args: [
-        'id'
-      ]
+      args: ['id'],
+      show: (record) => { return ['Up', 'Connecting', 'Down', 'ErrorInMaintenance'].includes(record.state) }
     },
     {
       api: 'cancelStorageMaintenance',
-      icon: 'cancelmaintenance',
+      icon: 'minus-square',
       label: 'label.action.cancel.maintenance.mode',
       dataView: true,
-      hidden: (record) => { return !(record.state === 'ErrorInMaintenance' || record.state === 'PrepareForMaintenance' || record.state === 'Maintenance') },
-      args: [
-        'id'
-      ]
+      args: ['id'],
+      show: (record) => { return ['Maintenance', 'PrepareForMaintenance', 'ErrorInMaintenance'].includes(record.state) }
     },
     {
       api: 'deleteStoragePool',
       icon: 'delete',
       label: 'label.action.delete.primary.storage',
       dataView: true,
-      hidden: (record) => { return !(record.state === 'Down' || record.state === 'Alert' || record.state === 'Maintenance' || record.state === 'Disconnected') },
-      args: [
-        'id', 'forced'
-      ]
+      args: ['id', 'forced'],
+      show: (record) => { return !(record.state === 'Down' || record.state === 'Alert' || record.state === 'Maintenance' || record.state === 'Disconnected') }
     }
   ]
 }
diff --git a/ui/src/config/section/infra/routers.js b/ui/src/config/section/infra/routers.js
index 9bb8dc7bccf..92469de1b0f 100644
--- a/ui/src/config/section/infra/routers.js
+++ b/ui/src/config/section/infra/routers.js
@@ -8,84 +8,68 @@ export default {
   actions: [
     {
       api: 'startRouter',
-      icon: 'startvm',
+      icon: 'caret-right',
       label: 'label.action.start.router',
       dataView: true,
-      hidden: (record) => { return record.state !== 'Stopped' },
-      args: [
-        'id'
-      ]
+      args: ['id'],
+      show: (record) => { return record.state === 'Stopped' }
     },
     {
       api: 'stopRouter',
-      icon: 'stopvm',
+      icon: 'stop',
       label: 'label.action.stop.router',
       dataView: true,
-      hidden: (record) => { return record.state !== 'Running' },
-      args: [
-        'id', 'forced'
-      ]
-    },
-    {
-      api: 'scaleSystemVm',
-      icon: 'scalevm',
-      label: 'label.change.service.offering',
-      dataView: true,
-      hidden: (record) => { return !(record.state === 'Stopped' || record.hypervisor === 'VMWare') },
-      args: [
-        'id', 'serviceofferingid'
-      ]
+      args: ['id', 'forced'],
+      show: (record) => { return record.state === 'Running' }
     },
     {
       api: 'rebootRouter',
-      icon: 'rebootvm',
+      icon: 'sync',
       label: 'label.action.reboot.router',
       dataView: true,
-      hidden: (record) => { return record.state !== 'Running' },
-      args: [
-        'id'
-      ]
+      args: ['id'],
+      hidden: (record) => { return record.state === 'Running' }
     },
     {
-      api: 'migrateSystemVm',
-      icon: 'migratevm',
-      label: 'label.action.migrate.router',
+      api: 'scaleSystemVm',
+      icon: 'arrows-alt',
+      label: 'label.change.service.offering',
       dataView: true,
-      hidden: (record) => { return record.state !== 'Running' },
-      args: [
-        'hostid', 'virtualmachineid'
-      ]
+      args: ['id', 'serviceofferingid'],
+      show: (record) => { return record.state === 'Stopped' || record.hypervisor === 'VMWare' }
     },
     {
       api: 'upgradeRouterTemplate',
-      icon: 'upgraderouter',
+      icon: 'fullscreen',
       label: 'label.upgrade.router.newer.template',
       dataView: true,
       groupAction: true,
-      hidden: (record) => { return record.requiresupgrade },
-      args: [
-        'id'
-      ]
+      args: ['id'],
+      show: (record) => { return record.requiresupgrade }
+    },
+    {
+      api: 'migrateSystemVm',
+      icon: 'drag',
+      label: 'label.action.migrate.router',
+      dataView: true,
+      args: ['virtualmachineid', 'hostid'],
+      show: (record) => { return record.state === 'Running' }
     },
     {
       api: 'runDiagnostics',
-      icon: 'diagnostics',
+      icon: 'reconciliation',
       label: 'label.action.run.diagnostics',
       dataView: true,
-      hidden: (record) => { return record.state !== 'Running' },
-      args: [
-        'targetid', 'ipaddress', 'type', 'params'
-      ]
+      args: ['targetid', 'type', 'ipaddress', 'params'],
+      show: (record) => { return record.state === 'Running' }
     },
     {
       api: 'destroyRouter',
       icon: 'delete',
       label: 'label.destroy.router',
       dataView: true,
-      hidden: (record) => { return record.state !== 'Running' && record.state !== 'Stopped' },
-      args: [
-        'id'
-      ]
+      args: ['id'],
+      show: (record) => { return ['Running', 'Error', 'Stopped'].includes(record.state) }
     }
   ]
 }
diff --git a/ui/src/config/section/infra/secondaryStorages.js b/ui/src/config/section/infra/secondaryStorages.js
index afbc144d839..0acef6d9780 100644
--- a/ui/src/config/section/infra/secondaryStorages.js
+++ b/ui/src/config/section/infra/secondaryStorages.js
@@ -11,18 +11,14 @@ export default {
       icon: 'plus',
       label: 'label.add.secondary.storage',
       listView: true,
-      args: [
-        'name', 'provider', 'zoneid', 'url'
-      ]
+      args: ['name', 'provider', 'zoneid', 'url', 'details']
     },
     {
       api: 'deleteImageStore',
       icon: 'delete',
-      label: 'label.action.delete.primary.storage',
+      label: 'label.action.delete.secondary.storage',
       dataView: true,
-      args: [
-        'id'
-      ]
+      args: ['id']
     }
   ]
 }
diff --git a/ui/src/config/section/infra/systemVms.js b/ui/src/config/section/infra/systemVms.js
index d429e6a26fc..6711835f435 100644
--- a/ui/src/config/section/infra/systemVms.js
+++ b/ui/src/config/section/infra/systemVms.js
@@ -8,73 +8,59 @@ export default {
   actions: [
     {
       api: 'startSystemVm',
-      icon: 'startvm',
+      icon: 'caret-right',
       label: 'label.action.start.systemvm',
       dataView: true,
-      hidden: (record) => { return record.state !== 'Stopped' },
-      args: [
-        'id'
-      ]
+      args: ['id'],
+      show: (record) => { return record.state === 'Stopped' }
     },
     {
       api: 'stopSystemVm',
-      icon: 'stopvm',
+      icon: 'stop',
       label: 'label.action.stop.systemvm',
       dataView: true,
-      hidden: (record) => { return record.state !== 'Running' },
-      args: [
-        'id'
-      ]
+      args: ['id'],
+      show: (record) => { return record.state === 'Running' }
     },
     {
       api: 'rebootSystemVm',
-      icon: 'rebootvm',
+      icon: 'sync',
       label: 'label.action.reboot.systemvm',
       dataView: true,
-      hidden: (record) => { return record.state !== 'Running' },
-      args: [
-        'id'
-      ]
+      args: ['id'],
+      show: (record) => { return record.state === 'Running' }
     },
     {
       api: 'scaleSystemVm',
-      icon: 'scalevm',
+      icon: 'arrows-alt',
       label: 'label.change.service.offering',
       dataView: true,
-      hidden: (record) => { return !(record.state === 'Stopped' || record.hypervisor === 'VMWare') },
-      args: [
-        'id', 'serviceofferingid'
-      ]
+      args: ['id', 'serviceofferingid'],
+      show: (record) => { return record.hypervisor === 'VMWare' || record.state === 'Stopped' }
     },
     {
       api: 'migrateSystemVm',
-      icon: 'migratevm',
+      icon: 'drag',
       label: 'label.action.migrate.systemvm',
       dataView: true,
-      hidden: (record) => { return record.state !== 'Running' },
-      args: [
-        'hostid', 'virtualmachineid'
-      ]
+      args: ['virtualmachineid', 'hostid'],
+      show: (record) => { return record.state === 'Running' }
     },
     {
       api: 'runDiagnostics',
-      icon: 'diagnostics',
+      icon: 'reconciliation',
       label: 'label.action.run.diagnostics',
       dataView: true,
-      hidden: (record) => { return record.state !== 'Running' },
-      args: [
-        'targetid', 'ipaddress', 'type', 'params'
-      ]
+      args: ['targetid', 'type', 'ipaddress', 'params'],
+      show: (record) => { return record.state === 'Running' }
     },
     {
       api: 'destroySystemVm',
       icon: 'delete',
       label: 'label.action.destroy.systemvm',
       dataView: true,
-      hidden: (record) => { return record.state !== 'Running' && record.state !== 'Error' && record.state !== 'Stopped' },
-      args: [
-        'id'
-      ]
+      args: ['id'],
+      show: (record) => { return ['Running', 'Error', 'Stopped'].includes(record.state) }
     }
   ]
 }
diff --git a/ui/src/config/section/infra/zones.js b/ui/src/config/section/infra/zones.js
index 5fe81911b4a..3e1d0d4fb96 100644
--- a/ui/src/config/section/infra/zones.js
+++ b/ui/src/config/section/infra/zones.js
@@ -2,8 +2,8 @@ export default {
   name: 'zone',
   title: 'Zones',
   icon: 'global',
-  permission: [ 'listZones', 'listZonesMetrics' ],
-  columns: [ 'name', 'allocationstate', 'networktype', 'guestcidraddress' ],
+  permission: [ 'listZonesMetrics', 'listZones' ],
+  columns: [ 'name', 'state', 'networktype', 'clusters', 'cpuused', 'cpumaxdeviation', 'cpuallocated', 'cputotal', 'memoryused', 'memorymaxdeviation', 'memoryallocated', 'memorytotal' ],
   details: [ 'name', 'id', 'allocationstate', 'networktype', 'guestcidraddress', 'localstorageenabled', 'securitygroupsenabled', 'dns1', 'dns2', 'internaldns1', 'internaldns2' ],
   actions: [
     {
@@ -16,140 +16,128 @@ export default {
     },
     {
       api: 'updateZone',
-      icon: 'enable',
-      label: 'label.action.disable.zone',
+      icon: 'edit',
+      label: 'Edit Zone',
       dataView: true,
-      hidden: (record) => { return record.allocationstate === 'Enabled' },
-      args: [ 'id' ],
-      defaultArgs: { allocationstate: 'Disabled' }
+      args: ['id', 'name', 'dns1', 'dns2', 'ip6dns1', 'ip6dns2', 'internaldns1', 'internaldns2', 'guestcidraddress', 'domain', 'localstorageenabled'],
+      show: (record) => { return record.networktype === 'Advanced' }
     },
     {
       api: 'updateZone',
-      icon: 'disable',
+      icon: 'edit',
+      label: 'Edit Zone',
+      dataView: true,
+      args: ['id', 'name', 'dns1', 'dns2', 'ip6dns1', 'ip6dns2', 'internaldns1', 'internaldns2', 'domain', 'localstorageenabled'],
+      show: (record) => { return record.networktype === 'Basic' }
+    },
+    {
+      api: 'updateZone',
+      icon: 'pause-circle',
+      label: 'label.action.disable.zone',
+      dataView: true,
+      args: ['id'],
+      defaultArgs: { allocationstate: 'Disabled' },
+      show: (record) => { return record.allocationstate === 'Enabled' }
+    },
+    {
+      api: 'updateZone',
+      icon: 'play-circle',
       label: 'label.action.enable.zone',
       dataView: true,
-      hidden: (record) => { return record.allocationstate === 'Disabled' },
       args: [ 'id' ],
-      defaultArgs: { allocationstate: 'Enabled' }
+      defaultArgs: { allocationstate: 'Enabled' },
+      show: (record) => { return record.allocationstate === 'Disabled' }
     },
     {
       api: 'dedicateZone',
-      icon: 'dedicate',
+      icon: 'user-add',
       label: 'label.dedicate.zone',
       dataView: true,
-      hidden: (record) => { return record.domainid !== null },
-      args: [
-        'zoneId', 'domainid', 'account'
-      ]
+      args: ['zoneid', 'domainid', 'account'],
+      show: (record) => { return !record.domainid }
     },
     {
       api: 'releaseDedicatedZone',
-      icon: 'release',
+      icon: 'user-delete',
       label: 'label.release.dedicated.zone',
       dataView: true,
-      hidden: (record) => { return record.domainid !== null },
-      args: [
-        'zoneid'
-      ]
+      args: ['zoneid'],
+      show: (record) => { return record.domainid }
+    },
+    {
+      api: 'enableOutOfBandManagementForZone',
+      icon: 'plus-circle',
+      label: 'label.outofbandmanagement.enable',
+      dataView: true,
+      args: ['zoneid'],
+      show: (record) => {
+        return !record.resourcedetails || !record.resourcedetails.outOfBandManagementEnabled ||
+          record.resourcedetails.outOfBandManagementEnabled === 'false'
+      }
+    },
+    {
+      api: 'disableOutOfBandManagementForZone',
+      icon: 'minus-circle',
+      label: 'label.outofbandmanagement.disable',
+      dataView: true,
+      args: ['zoneid'],
+      show: (record) => {
+        return record.resourcedetails && record.resourcedetails.outOfBandManagementEnabled &&
+          record.resourcedetails.outOfBandManagementEnabled === 'true'
+      }
+    },
+    {
+      api: 'enableHAForZone',
+      icon: 'eye',
+      label: 'label.ha.enable',
+      dataView: true,
+      args: ['zoneid'],
+      show: (record) => {
+        return !record.resourcedetails || !record.resourcedetails.resourceHAEnabled ||
+          record.resourcedetails.resourceHAEnabled === 'false'
+      }
+    },
+    {
+      api: 'disableHAForZone',
+      icon: 'eye-invisible',
+      label: 'label.ha.disable',
+      dataView: true,
+      args: ['zoneid'],
+      show: (record) => {
+        return record.resourcedetails && record.resourcedetails.resourceHAEnabled &&
+          record.resourcedetails.resourceHAEnabled === 'true'
+      }
+    },
+    {
+      api: 'addVmwareDc',
+      icon: 'block',
+      label: 'label.add.vmware.datacenter',
+      dataView: true,
+      args: ['zoneid', 'name', 'vcenter', 'username', 'password'],
+      show: (record) => { return !record.vmwaredcid }
+    },
+    {
+      api: 'updateVmwareDc',
+      icon: 'block',
+      label: 'label.update.vmware.datacenter',
+      dataView: true,
+      args: ['zoneid', 'name', 'vcenter', 'username', 'password', 'isrecursive'],
+      show: (record) => { return record.vmwaredcid }
+    },
+    {
+      api: 'removeVmwareDc',
+      icon: 'minus-square',
+      label: 'label.remove.vmware.datacenter',
+      dataView: true,
+      args: ['zoneid'],
+      show: (record) => { return record.vmwaredcid }
     },
     {
       api: 'deleteZone',
       icon: 'delete',
       label: 'label.action.delete.zone',
       dataView: true,
-      args: [
-        'id'
-      ]
-    },
-    {
-      api: 'updateZone',
-      icon: 'disable',
-      label: 'label.edit',
-      dataView: true,
-      hidden: (record) => { return record.networktype === 'Advanced' },
-      args: [
-        'id', 'name', 'dns1', 'dns2', 'ip6dns1', 'ip6dns2', 'guestcidraddress', 'internaldns1', 'internaldns2', 'domain', 'localstorageenabled'
-      ]
-    },
-    {
-      api: 'updateZone',
-      icon: 'disable',
-      label: 'label.edit',
-      dataView: true,
-      hidden: (record) => { return record.networktype === 'Basic' },
-      args: [
-        'id', 'name', 'dns1', 'dns2', 'ip6dns1', 'ip6dns2', 'internaldns1', 'internaldns2', 'domain', 'localstorageenabled'
-      ]
-    },
-    {
-      api: 'disableOutOfBandManagementForZone',
-      icon: 'disableband',
-      label: 'label.outofbandmanagement.disable',
-      dataView: true,
-      hidden: (record) => { return !(record.resourcedetails && record.resourcedetails.outOfBandManagementEnabled && record.resourcedetails.outOfBandManagementEnabled === 'false') },
-      args: [
-        'zoneid'
-      ]
-    },
-    {
-      api: 'enableOutOfBandManagementForZone',
-      icon: 'enableband',
-      label: 'label.outofbandmanagement.enable',
-      dataView: true,
-      hidden: (record) => { return record.resourcedetails && record.resourcedetails.outOfBandManagementEnabled && record.resourcedetails.outOfBandManagementEnabled === 'false' },
-      args: [
-        'zoneid'
-      ]
-    },
-    {
-      api: 'disableHAForZone',
-      icon: 'disableha',
-      label: 'label.ha.disable',
-      dataView: true,
-      hidden: (record) => { return !(record.resourcedetails && record.resourcedetails.resourceHAEnabled && record.resourcedetails.resourceHAEnabled === 'false') },
-      args: [
-        'zoneid'
-      ]
-    },
-    {
-      api: 'enableHAForZone',
-      icon: 'enableha',
-      label: 'label.ha.enable',
-      dataView: true,
-      hidden: (record) => { return record.resourcedetails && record.resourcedetails.resourceHAEnabled && record.resourcedetails.resourceHAEnabled === 'false' },
-      args: [
-        'zoneid'
-      ]
-    },
-    {
-      api: 'addVmwareDc',
-      icon: 'addvmwdc',
-      label: 'label.add.vmware.datacenter',
-      dataView: true,
-      hidden: (record) => { return record.vmwaredcId === null },
-      args: [
-        'zoneid', 'name', 'vcenter', 'username', 'password'
-      ]
-    },
-    {
-      api: 'updateVmwareDc',
-      icon: 'addvmwdc',
-      label: 'label.update.vmware.datacenter',
-      dataView: true,
-      hidden: (record) => { return record.vmwaredcId !== null },
-      args: [
-        'zoneid', 'name', 'vcenter', 'username', 'password'
-      ]
-    },
-    {
-      api: 'removeVmwareDc',
-      icon: 'addvmwdc',
-      label: 'label.remove.vmware.datacenter',
-      dataView: true,
-      hidden: (record) => { return record.vmwaredcId !== null },
-      args: [
-        'zoneid'
-      ]
+      args: ['id']
     }
   ]
 }