Add latest changes from gitlab-org/gitlab@master

2 files changed, 24 insertions, 2 deletions

diff --git a/app/assets/javascripts/security_configuration/components/training_provider_list.vue b/app/assets/javascripts/security_configuration/components/training_provider_list.vue
index 7a4c0205569..dea94503e62 100644
--- a/app/assets/javascripts/security_configuration/components/training_provider_list.vue
+++ b/app/assets/javascripts/security_configuration/components/training_provider_list.vue
@@ -1,7 +1,12 @@
 <script>
 import { GlAlert, GlCard, GlToggle, GlLink, GlSkeletonLoader } from '@gitlab/ui';
 import * as Sentry from '@sentry/browser';
+import Tracking from '~/tracking';
 import { __ } from '~/locale';
+import {
+  TRACK_TOGGLE_TRAINING_PROVIDER_ACTION,
+  TRACK_TOGGLE_TRAINING_PROVIDER_LABEL,
+} from '~/security_configuration/constants';
 import dismissUserCalloutMutation from '~/graphql_shared/mutations/dismiss_user_callout.mutation.graphql';
 import securityTrainingProvidersQuery from '../graphql/security_training_providers.query.graphql';
 import configureSecurityTrainingProvidersMutation from '../graphql/configure_security_training_providers.mutation.graphql';
@@ -23,6 +28,7 @@ export default {
     GlLink,
     GlSkeletonLoader,
   },
+  mixins: [Tracking.mixin()],
   inject: ['projectFullPath'],
   apollo: {
     securityTrainingProviders: {
@@ -93,9 +99,14 @@ export default {
         .filter(({ isEnabled }) => isEnabled)
         .map(({ id }) => id);
 
-      this.storeEnabledProviders(toggledProviders, enabledProviderIds);
+      const { isEnabled: selectedProviderIsEnabled } = toggledProviders.find(
+        (provider) => provider.id === selectedProviderId,
+      );
+
+      this.trackProviderToggle(selectedProviderId, selectedProviderIsEnabled);
+      this.storeEnabledProviders(enabledProviderIds);
     },
-    async storeEnabledProviders(toggledProviders, enabledProviderIds) {
+    async storeEnabledProviders(enabledProviderIds) {
       this.toggleLoading = true;
 
       try {
@@ -125,6 +136,15 @@ export default {
         this.toggleLoading = false;
       }
     },
+    trackProviderToggle(providerId, providerIsEnabled) {
+      this.track(TRACK_TOGGLE_TRAINING_PROVIDER_ACTION, {
+        label: TRACK_TOGGLE_TRAINING_PROVIDER_LABEL,
+        property: providerId,
+        extra: {
+          providerIsEnabled,
+        },
+      });
+    },
   },
   i18n,
 };
diff --git a/app/assets/javascripts/security_configuration/constants.js b/app/assets/javascripts/security_configuration/constants.js
new file mode 100644
index 00000000000..dc76436e91d
--- /dev/null
+++ b/app/assets/javascripts/security_configuration/constants.js
@@ -0,0 +1,2 @@
+export const TRACK_TOGGLE_TRAINING_PROVIDER_ACTION = 'toggle_security_training_provider';
+export const TRACK_TOGGLE_TRAINING_PROVIDER_LABEL = 'update_security_training_provider';