feat(app): toggle features based on agent API version (#2378)

* feat(agent): get agent's version from ping

* feat(agent): add version to api url

* feat(agent): query agent with api version

* feat(agent): rename agent api version name on state

* feat(agent): disable feature based on agent's api version

* style(agent): rename ping rest service + remove whitespaces

* style(state): remove whitespace

* style(agent): add whitespace

* fix(agent): remove check for error status 403

* refactor(agent): rename ping file name

* refactor(agent): move old services to v1 folder

* refactor(agent): turn ping service to usual pattern

* refactor(agent): change version to a global variable

* refactor(agent): move ping to version2

* refactor(agent): restore ping to use root ping

* fix(volumes): add volumeID to browse api path

* feat(volume): add upload button to volume browser

app/docker/components/host-overview/host-overview.html

@@ -10,12 +10,12 @@
 
 <host-details-panel 
   host="$ctrl.hostDetails" 
-  is-agent="$ctrl.isAgent"
+  is-browse-enabled="$ctrl.isAgent && $ctrl.agentApiVersion > 1"
   browse-url="{{$ctrl.browseUrl}}"></host-details-panel>
 
 <engine-details-panel engine="$ctrl.engineDetails"></engine-details-panel>
 
-<devices-panel ng-if="$ctrl.isAgent" devices="$ctrl.devices"></devices-panel>
-<disks-panel ng-if="$ctrl.isAgent" disks="$ctrl.disks"></disks-panel>
+<devices-panel ng-if="$ctrl.isAgent && $ctrl.agentApiVersion > 1" devices="$ctrl.devices"></devices-panel>
+<disks-panel ng-if="$ctrl.isAgent && $ctrl.agentApiVersion > 1" disks="$ctrl.disks"></disks-panel>
 
 <ng-transclude></ng-transclude>

app/docker/components/host-overview/host-overview.js

@@ -6,6 +6,7 @@ angular.module('portainer.docker').component('hostOverview', {
     devices: '<',
     disks: '<',
     isAgent: '<',
+    agentApiVersion: '<',
     refreshUrl: '@',
     browseUrl: '@'
   },

app/docker/components/host-view-panels/host-details-panel/host-details-panel.html

@@ -26,7 +26,7 @@
               <td>Total memory</td>
               <td>{{ $ctrl.host.totalMemory | humansize }}</td>
             </tr>
-            <tr ng-if="$ctrl.isAgent">
+            <tr ng-if="$ctrl.isBrowseEnabled">
               <td colspan="2">
                 <button 
                   class="btn btn-primary btn-sm"

app/docker/components/host-view-panels/host-details-panel/host-details-panel.js

@@ -3,7 +3,7 @@ angular.module('portainer.docker').component('hostDetailsPanel', {
     'app/docker/components/host-view-panels/host-details-panel/host-details-panel.html',
   bindings: {
     host: '<',
-    isAgent: '<',
+    isBrowseEnabled: '<',
     browseUrl: '@'
   }
 });

app/docker/views/host/host-view-controller.js

@@ -10,10 +10,14 @@ angular.module('portainer.docker').controller('HostViewController', [
     
     this.engineDetails = {};
     this.hostDetails = {};
+    this.devices = null;
+    this.disks = null;
 
     function initView() {
       var applicationState = StateManager.getState();
       ctrl.state.isAgent = applicationState.endpoint.mode.agentProxy;
+      var agentApiVersion = applicationState.endpoint.agentApiVersion;
+      ctrl.state.agentApiVersion = agentApiVersion;
 
       $q.all({
         version: SystemService.version(),
@@ -23,7 +27,7 @@ angular.module('portainer.docker').controller('HostViewController', [
           ctrl.engineDetails = buildEngineDetails(data);
           ctrl.hostDetails = buildHostDetails(data.info);
 
-          if (ctrl.state.isAgent) {
+          if (ctrl.state.isAgent && agentApiVersion > 1) {
             return AgentService.hostInfo(data.info.Hostname).then(function onHostInfoLoad(agentHostInfo) {
               ctrl.devices = agentHostInfo.PCIDevices;
               ctrl.disks = agentHostInfo.PhysicalDisks;

app/docker/views/host/host-view.html

@@ -2,6 +2,7 @@
   engine-details="$ctrl.engineDetails"
   host-details="$ctrl.hostDetails"
   is-agent="$ctrl.state.isAgent"
+  agent-api-version="$ctrl.state.agentApiVersion"
   disks="$ctrl.disks"
   devices="$ctrl.devices"
 

app/docker/views/nodes/node-details/node-details-view-controller.js

@@ -20,12 +20,16 @@ angular.module('portainer.docker').controller('NodeDetailsViewController', [
         ctrl.engineDetails = buildEngineDetails(node);
         ctrl.nodeDetails = buildNodeDetails(node);
         if (ctrl.state.isAgent) {
-          AgentService.hostInfo(node.Hostname).then(function onHostInfoLoad(
-            agentHostInfo
-          ) {
-            ctrl.devices = agentHostInfo.PCIDevices;
-            ctrl.disks = agentHostInfo.PhysicalDisks;
-          });
+          var agentApiVersion = applicationState.endpoint.agentApiVersion;
+          ctrl.state.agentApiVersion = agentApiVersion;
+          if (agentApiVersion < 2) {
+            return;
+          }
+          AgentService.hostInfo(node.Hostname)
+            .then(function onHostInfoLoad(agentHostInfo) {
+                ctrl.devices = agentHostInfo.PCIDevices;
+                ctrl.disks = agentHostInfo.PhysicalDisks;
+              });
         }
       });
     }

app/docker/views/nodes/node-details/node-details-view.html

@@ -1,4 +1,5 @@
 <host-overview
+  agent-api-version="$ctrl.state.agentApiVersion"
   is-agent="$ctrl.state.isAgent"
   host-details="$ctrl.hostDetails"
   engine-details="$ctrl.engineDetails"

app/docker/views/volumes/browse/browseVolumeController.js

@@ -1,10 +1,11 @@
 angular.module('portainer.docker')
-.controller('BrowseVolumeController', ['$scope', '$transition$',
-function ($scope, $transition$) {
+.controller('BrowseVolumeController', ['$scope', '$transition$', 'StateManager',
+function ($scope, $transition$, StateManager) {
 
   function initView() {
     $scope.volumeId = $transition$.params().id;
     $scope.nodeName = $transition$.params().nodeName;
+    $scope.agentApiVersion = StateManager.getAgentApiVersion();
   }
 
   initView();

app/docker/views/volumes/browse/browsevolume.html

@@ -10,6 +10,8 @@
     <volume-browser
       volume-id="volumeId"
       node-name="nodeName"
+      
+      is-upload-enabled="agentApiVersion > 1"
     ></volume-browser>
   </div>
 </div>