Formatting duration in hpc views
diff --git a/views/ngXosLib/xosHelpers/spec/ui/table.test.js b/views/ngXosLib/xosHelpers/spec/ui/table.test.js
index 321a476..0ecdd2f 100644
--- a/views/ngXosLib/xosHelpers/spec/ui/table.test.js
+++ b/views/ngXosLib/xosHelpers/spec/ui/table.test.js
@@ -292,6 +292,7 @@
                 {categories: ['Film', 'Music']}
               ];
               scope.config = {
+                filter: 'field',
                 columns: [
                   {
                     label: 'Categories',
@@ -342,11 +343,17 @@
             });
 
             it('should format data using the formatter property', () => {
-              let td1 = $(element).find('tbody tr:first-child')[0];
+              let td1 = $(element).find('tbody:last-child tr:first-child')[0];
               expect($(td1).text().trim()).toEqual('Formatted Content');
               // the custom formatted should receive the entire object, otherwise is not so custom
               expect(formatterFn).toHaveBeenCalledWith({categories: ['Film', 'Music']});
             });
+
+            it('should not render the filter field', () => {
+              // displayed value is different from model val, filter would not work
+              let filter = $(element).find('tbody tr td')[0];
+              expect($(filter)).not.toContainElement('input');
+            });
           });
 
           describe('and is icon', () => {
diff --git a/views/ngXosLib/xosHelpers/src/ui_components/dumbComponents/table/table.component.js b/views/ngXosLib/xosHelpers/src/ui_components/dumbComponents/table/table.component.js
index 94e2ab3..1e60458 100644
--- a/views/ngXosLib/xosHelpers/src/ui_components/dumbComponents/table/table.component.js
+++ b/views/ngXosLib/xosHelpers/src/ui_components/dumbComponents/table/table.component.js
@@ -369,7 +369,7 @@
                 <tr>
                   <td ng-repeat="col in vm.columns">
                     <input
-                      ng-if="col.type !== 'boolean' && col.type !== 'array' && col.type !== 'object'"
+                      ng-if="col.type !== 'boolean' && col.type !== 'array' && col.type !== 'object' && col.type !== 'custom'"
                       class="form-control"
                       placeholder="Type to search by {{col.label}}"
                       type="text"
diff --git a/views/ngXosViews/hpc/src/css/main.css b/views/ngXosViews/hpc/src/css/main.css
index e69de29..24f5982 100644
--- a/views/ngXosViews/hpc/src/css/main.css
+++ b/views/ngXosViews/hpc/src/css/main.css
@@ -0,0 +1,2 @@
+#xosHpc .btn.btn-reload {
+  margin-top: 20px; }
diff --git a/views/ngXosViews/hpc/src/js/main.js b/views/ngXosViews/hpc/src/js/main.js
index 3cb769e..ca6a5a0 100644
--- a/views/ngXosViews/hpc/src/js/main.js
+++ b/views/ngXosViews/hpc/src/js/main.js
@@ -38,6 +38,23 @@
     templateUrl: 'templates/hpc-list.tpl.html',
     controller: function(Hpc){
 
+      const secondsToHms = d => {
+        d = Number(d);
+        var h = Math.floor(d / 3600);
+        var m = Math.floor(d % 3600 / 60);
+        var s = Math.floor(d % 3600 % 60);
+        return ((h > 0 ? h + 'h ' + (m < 10 ? '0' :'') :'') + m + 'm ' + (s < 10 ? '0' :'') + s + 's');
+      };
+
+      const toDuration = (property) => {
+        return (item) => {
+          if(!angular.isNumber(item[property])){
+            return item[property]
+          }
+          return secondsToHms(item[property]);
+        }
+      };
+
       this.routerConfig = {
         filter: 'field',
         order: true,
@@ -57,15 +74,19 @@
           {
             label: 'Name Servers',
             prop: 'nameservers',
-            type: 'arrray'
+            type: 'array'
           },
           {
             label: 'Dns Demux Config Age',
-            prop: 'dnsdemux_config_age'
+            prop: 'dnsdemux_config_age',
+            type: 'custom',
+            formatter: toDuration('dnsdemux_config_age')
           },
           {
             label: 'Dns Redir Config Age',
-            prop: 'dnsredir_config_age'
+            prop: 'dnsredir_config_age',
+            type: 'custom',
+            formatter: toDuration('dnsredir_config_age')
           }
         ]
       };
@@ -88,20 +109,26 @@
           },
           {
             label: 'Config Age',
-            prop: 'config_age'
+            prop: 'config_age',
+            type: 'custom',
+            formatter: toDuration('config_age')
           }
         ]
       };
-      
-      // retrieving user list
-      Hpc.query().$promise
-      .then((hpcs) => {
-        this.routers = hpcs[0].dnsdemux;
-        this.caches = hpcs[0].hpc;
-      })
-      .catch((e) => {
-        throw new Error(e);
-      });
+
+
+      this.fetch = () => {
+        Hpc.query().$promise
+        .then((hpcs) => {
+          this.routers = hpcs[0].dnsdemux;
+          this.caches = hpcs[0].hpc;
+        })
+        .catch((e) => {
+          throw new Error(e);
+        });
+      };
+
+      this.fetch();
     }
   };
 });
\ No newline at end of file
diff --git a/views/ngXosViews/hpc/src/sass/main.scss b/views/ngXosViews/hpc/src/sass/main.scss
index a2e3cbe..c646843 100644
--- a/views/ngXosViews/hpc/src/sass/main.scss
+++ b/views/ngXosViews/hpc/src/sass/main.scss
@@ -1,5 +1,7 @@
 @import '../../../../style/sass/lib/_variables.scss';
 
 #xosHpc {
-  
+  .btn.btn-reload {
+    margin-top: $line-height-computed;
+  }
 }
\ No newline at end of file
diff --git a/views/ngXosViews/hpc/src/templates/hpc-list.tpl.html b/views/ngXosViews/hpc/src/templates/hpc-list.tpl.html
index 9626563..138323f 100644
--- a/views/ngXosViews/hpc/src/templates/hpc-list.tpl.html
+++ b/views/ngXosViews/hpc/src/templates/hpc-list.tpl.html
@@ -1,14 +1,28 @@
 <div class="container-fluid">
     <div class="row">
-        <h1>Request Routers</h1>
+        <div class="col-xs-10">
+            <h1>Request Routers</h1>
+        </div>
+        <div class="col-xs-2 text-right">
+            <a href="" ng-click="vm.fetch()" class="btn btn-primary btn-reload">
+                <i class="glyphicon glyphicon-refresh"></i>
+                Refresh
+            </a>
+        </div>
     </div>
     <div class="row">
-        <xos-table config="vm.routerConfig" data="vm.routers"></xos-table>
+        <div class="col-xs-12">
+            <xos-table config="vm.routerConfig" data="vm.routers"></xos-table>
+        </div>
     </div>
     <div class="row">
-        <h1>HyperCache</h1>
+        <div class="col-xs-12">
+            <h1>HyperCache</h1>
+        </div>
     </div>
     <div class="row">
-        <xos-table config="vm.cacheConfig" data="vm.caches"></xos-table>
+        <div class="col-xs-12">
+            <xos-table config="vm.cacheConfig" data="vm.caches"></xos-table>
+        </div>
     </div>
 </div>
\ No newline at end of file