From f6d9a4c7c120f19033bb90b33c61bb675afb5136 Mon Sep 17 00:00:00 2001
From: Brian Kabiro <brian.kabiro@andela.com>
Date: Thu, 4 Oct 2018 02:07:31 +0300
Subject: [PATCH] feat(nodes): display node name when available (#2328)

- check if the name of a node is available, otherwise default to the Hostname
---
 .../components/datatables/nodes-datatable/nodesDatatable.html | 4 ++--
 app/docker/views/swarm/visualizer/swarmvisualizer.html        | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/docker/components/datatables/nodes-datatable/nodesDatatable.html b/app/docker/components/datatables/nodes-datatable/nodesDatatable.html
index 20f575f41..0a647868d 100644
--- a/app/docker/components/datatables/nodes-datatable/nodesDatatable.html
+++ b/app/docker/components/datatables/nodes-datatable/nodesDatatable.html
@@ -68,8 +68,8 @@
           <tbody>
             <tr dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))" ng-class="{active: item.Checked}">
               <td>
-                <a ui-sref="docker.nodes.node({id: item.Id})" ng-if="$ctrl.accessToNodeDetails">{{ item.Hostname }}</a>
-                <span ng-if="!$ctrl.accessToNodeDetails">{{ item.Hostname }}</span>
+                <a ui-sref="docker.nodes.node({id: item.Id})" ng-if="$ctrl.accessToNodeDetails">{{ item.Name || item.Hostname }}</a>
+                <span ng-if="!$ctrl.accessToNodeDetails">{{ item.Name || item.Hostname }}</span>
               </td>
               <td>{{ item.Role }}</td>
               <td>{{ item.CPUs / 1000000000 }}</td>
diff --git a/app/docker/views/swarm/visualizer/swarmvisualizer.html b/app/docker/views/swarm/visualizer/swarmvisualizer.html
index 70716f2e6..612354e25 100644
--- a/app/docker/views/swarm/visualizer/swarmvisualizer.html
+++ b/app/docker/views/swarm/visualizer/swarmvisualizer.html
@@ -84,7 +84,7 @@
             <div class="node_info">
               <div>
                 <div>
-                  <b>{{ node.Hostname }}</b>
+                  <b>{{ node.Name || node.Hostname }}</b>
                   <span class="node_platform">
                     <i class="fab fa-linux" aria-hidden="true" ng-if="node.PlatformOS === 'linux'"></i>
                     <i class="fab fa-windows" aria-hidden="true" ng-if="node.PlatformOS === 'windows'"></i>