Merge branch '11409-track-onboarding-events-in-snowplow' into 'master'

Resolve "Track onboarding events in Snowplow"

Closes #11409

See merge request gitlab-org/gitlab-ee!14333

ee/app/assets/javascripts/onboarding/onboarding_helper/components/app.vue

@@ -2,10 +2,13 @@
 import _ from 'underscore';
 import { mapState, mapActions, mapGetters } from 'vuex';
 import { redirectTo } from '~/lib/utils/url_utility';
+import Stats from 'ee/stats';
 import OnboardingHelper from './onboarding_helper.vue';
 import actionPopoverUtils from './../action_popover_utils';
 import eventHub from '../event_hub';
 
+const TRACKING_CATEGORY = 'onboarding';
+
 export default {
   components: {
     OnboardingHelper,
@@ -108,6 +111,10 @@ export default {
     },
     handleRestartStep() {
       this.showExitTourContent(false);
+      Stats.trackEvent(TRACKING_CATEGORY, 'click_link', {
+        label: this.getTrackingLabel(),
+        property: 'restart_this_step',
+      });
       eventHub.$emit('onboardingHelper.hideActionPopover');
     },
     handleSkipStep() {
@@ -115,6 +122,10 @@ export default {
         const { selector } = this.actionPopover;
         const popoverEl = selector ? document.querySelector(selector) : null;
         if (popoverEl) {
+          Stats.trackEvent(TRACKING_CATEGORY, 'click_link', {
+            label: this.getTrackingLabel(),
+            property: 'skip_this_step',
+          });
           popoverEl.click();
         }
       }
@@ -166,9 +177,20 @@ export default {
         return;
       }
 
-      // show action popover
+      Stats.trackEvent(TRACKING_CATEGORY, 'click_button', {
+        label: this.getTrackingLabel(),
+        property: 'got_it',
+      });
+
       this.showActionPopover();
     },
+    handleShowExitTourContent(showExitTour) {
+      Stats.trackEvent(TRACKING_CATEGORY, 'click_link', {
+        label: this.getTrackingLabel(),
+        property: 'exit_learn_gitlab',
+      });
+      this.showExitTourContent(showExitTour);
+    },
     showExitTourContent(showExitTour) {
       this.dismissPopover = false;
       this.showStepContent = true;
@@ -184,6 +206,10 @@ export default {
     afterAppearHook() {
       this.initialShowPopover = true;
     },
+    getTrackingLabel() {
+      const step = this.stepIndex + 1;
+      return `part_${this.tourKey}_step_${step}`;
+    },
   },
 };
 </script>
@@ -204,7 +230,7 @@ export default {
       @clickPopoverButton="handleClickPopoverButton"
       @restartStep="handleRestartStep"
       @skipStep="handleSkipStep"
-      @showExitTourContent="showExitTourContent"
+      @showExitTourContent="handleShowExitTourContent"
       @exitTour="handleExitTour"
     />
   </transition>

ee/app/views/explore/onboarding/index.html.haml

 .container.container-limited.limit-container-width.navless-container
-  #js-onboarding-welcome{ data: { user_avatar_url: avatar_icon_for_user(current_user), project_full_path: @project.web_url, skip_url: root_dashboard_path, from_help_menu: params[:from_help_menu] } }
+  #js-onboarding-welcome{ data: { user_avatar_url: avatar_icon_for_user(current_user), project_full_path: @project.web_url, skip_url: root_dashboard_path(nav_source: "onboarding"), from_help_menu: params[:from_help_menu] } }