feat(kompose): hide kompose [EE-4562] (#8084)

app/portainer/models/settings.js

@@ -20,6 +20,7 @@ export function SettingsViewModel(data) {
   this.EnforceEdgeID = data.EnforceEdgeID;
   this.AgentSecret = data.AgentSecret;
   this.EdgePortainerUrl = data.EdgePortainerUrl;
+  this.ShowKomposeBuildOption = data.ShowKomposeBuildOption;
 }
 
 export function PublicSettingsViewModel(settings) {
@@ -36,6 +37,7 @@ export function PublicSettingsViewModel(settings) {
   this.Features = settings.Features;
   this.Edge = new EdgeSettingsViewModel(settings.Edge);
   this.DefaultRegistry = settings.DefaultRegistry;
+  this.ShowKomposeBuildOption = settings.ShowKomposeBuildOption;
 }
 
 export function InternalAuthSettingsViewModel(data) {

app/portainer/views/settings/settings.html

@@ -184,6 +184,16 @@
               tooltip="'Hides the \'Add with form\' buttons and prevents adding/editing of resources via forms'"
             ></por-switch-field>
           </div>
+          <div class="form-group">
+            <por-switch-field
+              label="'Allow docker-compose format Kubernetes manifests'"
+              checked="formValues.ShowKomposeBuildOption"
+              name="'toggle_showKomposeBuildOption'"
+              on-change="(onToggleShowKompose)"
+              field-class="'col-sm-12'"
+              label-class="'col-sm-3 col-lg-2'"
+            ></por-switch-field>
+          </div>
           <!-- !deployment options -->
           <!-- actions -->
           <div class="form-group">

app/portainer/views/settings/settingsController.js

@@ -1,18 +1,22 @@
 import angular from 'angular';
 
 import { FeatureId } from '@/react/portainer/feature-flags/enums';
+// import trackEvent directly because the event only fires once with $analytics.trackEvent
+import { trackEvent } from '@/angulartics.matomo/analytics-services';
 import { options } from './options';
 
 angular.module('portainer.app').controller('SettingsController', [
   '$scope',
+  '$analytics',
   '$state',
   'Notifications',
   'SettingsService',
+  'ModalService',
   'StateManager',
   'BackupService',
   'FileSaver',
   'Blob',
-  function ($scope, $state, Notifications, SettingsService, StateManager, BackupService, FileSaver) {
+  function ($scope, $analytics, $state, Notifications, SettingsService, ModalService, StateManager, BackupService, FileSaver) {
     $scope.customBannerFeatureId = FeatureId.CUSTOM_LOGIN_BANNER;
     $scope.s3BackupFeatureId = FeatureId.S3_BACKUP_SETTING;
     $scope.enforceDeploymentOptions = FeatureId.ENFORCE_DEPLOYMENT_OPTIONS;
@@ -53,6 +57,7 @@ angular.module('portainer.app').controller('SettingsController', [
 
     $scope.formValues = {
       customLogo: false,
+      ShowKomposeBuildOption: false,
       KubeconfigExpiry: undefined,
       HelmRepositoryURL: undefined,
       BlackListedLabels: [],
@@ -64,6 +69,8 @@ angular.module('portainer.app').controller('SettingsController', [
       backupFormType: $scope.BACKUP_FORM_TYPES.FILE,
     };
 
+    $scope.initialFormValues = {};
+
     $scope.onToggleEnableTelemetry = function onToggleEnableTelemetry(checked) {
       $scope.$evalAsync(() => {
         $scope.formValues.enableTelemetry = checked;
@@ -76,6 +83,33 @@ angular.module('portainer.app').controller('SettingsController', [
       });
     };
 
+    $scope.onToggleShowKompose = async function onToggleShowKompose(checked) {
+      if (checked) {
+        ModalService.confirmWarn({
+          title: 'Are you sure?',
+          message: `<p>In a forthcoming Portainer release, we plan to remove support for docker-compose format manifests for Kubernetes deployments, and the Kompose conversion tool which enables this. The reason for this is because Kompose now poses a security risk, since it has a number of Common Vulnerabilities and Exposures (CVEs).</p>
+              <p>Unfortunately, while the Kompose project has a maintainer and is part of the CNCF, it is not being actively maintained. Releases are very infrequent and new pull requests to the project (including ones we've submitted) are taking months to be merged, with new CVEs arising in the meantime.</p>`,
+          buttons: {
+            confirm: {
+              label: 'Ok',
+              className: 'btn-warning',
+            },
+          },
+          callback: function (confirmed) {
+            $scope.setShowCompose(confirmed);
+          },
+        });
+        return;
+      }
+      $scope.setShowCompose(checked);
+    };
+
+    $scope.setShowCompose = function setShowCompose(checked) {
+      return $scope.$evalAsync(() => {
+        $scope.formValues.ShowKomposeBuildOption = checked;
+      });
+    };
+
     $scope.onToggleAutoBackups = function onToggleAutoBackups(checked) {
       $scope.$evalAsync(() => {
         $scope.formValues.scheduleAutomaticBackups = checked;
@@ -152,8 +186,13 @@ angular.module('portainer.app').controller('SettingsController', [
         KubeconfigExpiry: $scope.formValues.KubeconfigExpiry,
         HelmRepositoryURL: $scope.formValues.HelmRepositoryURL,
         GlobalDeploymentOptions: $scope.formValues.GlobalDeploymentOptions,
+        ShowKomposeBuildOption: $scope.formValues.ShowKomposeBuildOption,
       };
 
+      if (kubeSettingsPayload.ShowKomposeBuildOption !== $scope.initialFormValues.ShowKomposeBuildOption && $scope.initialFormValues.enableTelemetry) {
+        trackEvent('kubernetes-allow-compose', { category: 'kubernetes', metadata: { 'kubernetes-allow-compose': kubeSettingsPayload.ShowKomposeBuildOption } });
+      }
+
       $scope.state.kubeSettingsActionInProgress = true;
       updateSettings(kubeSettingsPayload, 'Kubernetes settings updated');
     };
@@ -165,6 +204,8 @@ angular.module('portainer.app').controller('SettingsController', [
           StateManager.updateLogo(settings.LogoURL);
           StateManager.updateSnapshotInterval(settings.SnapshotInterval);
           StateManager.updateEnableTelemetry(settings.EnableTelemetry);
+          $scope.initialFormValues.ShowKomposeBuildOption = response.ShowKomposeBuildOption;
+          $scope.initialFormValues.enableTelemetry = response.EnableTelemetry;
           $scope.formValues.BlackListedLabels = response.BlackListedLabels;
         })
         .catch(function error(err) {
@@ -193,6 +234,12 @@ angular.module('portainer.app').controller('SettingsController', [
           $scope.formValues.KubeconfigExpiry = settings.KubeconfigExpiry;
           $scope.formValues.HelmRepositoryURL = settings.HelmRepositoryURL;
           $scope.formValues.BlackListedLabels = settings.BlackListedLabels;
+          if (settings.ShowKomposeBuildOption) {
+            $scope.formValues.ShowKomposeBuildOption = settings.ShowKomposeBuildOption;
+          }
+
+          $scope.initialFormValues.ShowKomposeBuildOption = settings.ShowKomposeBuildOption;
+          $scope.initialFormValues.enableTelemetry = settings.EnableTelemetry;
         })
         .catch(function error(err) {
           Notifications.error('Failure', err, 'Unable to retrieve application settings');