Backport: Issue sidebar tracking

Added snowplow event tracking to Edit buttons

4 files changed, 28 insertions, 3 deletions

diff --git a/app/assets/javascripts/sidebar/components/assignees/assignee_title.vue b/app/assets/javascripts/sidebar/components/assignees/assignee_title.vue
index fa6b6bfaef1..63b93a80ead 100644
--- a/app/assets/javascripts/sidebar/components/assignees/assignee_title.vue
+++ b/app/assets/javascripts/sidebar/components/assignees/assignee_title.vue
@@ -1,5 +1,6 @@
 <script>
 import { n__ } from '~/locale';
+import { trackEvent } from 'ee_else_ce/event_tracking/issue_sidebar';
 
 export default {
   name: 'AssigneeTitle',
@@ -29,13 +30,23 @@ export default {
       return n__('Assignee', `%d Assignees`, assignees);
     },
   },
+  methods: {
+    trackEdit() {
+      trackEvent('click_edit_button', 'assignee');
+    },
+  },
 };
 </script>
 <template>
   <div class="title hide-collapsed">
     {{ assigneeTitle }}
     <i v-if="loading" aria-hidden="true" class="fa fa-spinner fa-spin block-loading"></i>
-    <a v-if="editable" class="js-sidebar-dropdown-toggle edit-link float-right" href="#">
+    <a
+      v-if="editable"
+      class="js-sidebar-dropdown-toggle edit-link float-right"
+      href="#"
+      @click.prevent="trackEdit"
+    >
       {{ __('Edit') }}
     </a>
     <a
diff --git a/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue b/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue
index 597b723a9d9..1c75b6148e8 100644
--- a/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue
+++ b/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue
@@ -5,6 +5,7 @@ import tooltip from '~/vue_shared/directives/tooltip';
 import Icon from '~/vue_shared/components/icon.vue';
 import eventHub from '~/sidebar/event_hub';
 import editForm from './edit_form.vue';
+import { trackEvent } from 'ee_else_ce/event_tracking/issue_sidebar';
 
 export default {
   components: {
@@ -51,6 +52,11 @@ export default {
     toggleForm() {
       this.edit = !this.edit;
     },
+    onEditClick() {
+      this.toggleForm();
+
+      trackEvent('click_edit_button', 'confidentiality');
+    },
     updateConfidentialAttribute(confidential) {
       this.service
         .update('issue', { confidential })
@@ -82,7 +88,7 @@ export default {
         v-if="isEditable"
         class="float-right confidential-edit"
         href="#"
-        @click.prevent="toggleForm"
+        @click.prevent="onEditClick"
       >
         {{ __('Edit') }}
       </a>
diff --git a/app/assets/javascripts/sidebar/components/lock/lock_issue_sidebar.vue b/app/assets/javascripts/sidebar/components/lock/lock_issue_sidebar.vue
index c5cfa92f3c8..ec2a7b93a98 100644
--- a/app/assets/javascripts/sidebar/components/lock/lock_issue_sidebar.vue
+++ b/app/assets/javascripts/sidebar/components/lock/lock_issue_sidebar.vue
@@ -6,6 +6,7 @@ import issuableMixin from '~/vue_shared/mixins/issuable';
 import Icon from '~/vue_shared/components/icon.vue';
 import eventHub from '~/sidebar/event_hub';
 import editForm from './edit_form.vue';
+import { trackEvent } from 'ee_else_ce/event_tracking/issue_sidebar';
 
 export default {
   components: {
@@ -65,7 +66,11 @@ export default {
     toggleForm() {
       this.mediator.store.isLockDialogOpen = !this.mediator.store.isLockDialogOpen;
     },
+    onEditClick() {
+      this.toggleForm();
 
+      trackEvent('click_edit_button', 'lock_issue');
+    },
     updateLockedAttribute(locked) {
       this.mediator.service
         .update(this.issuableType, {
@@ -109,7 +114,7 @@ export default {
         v-if="isEditable"
         class="float-right lock-edit"
         type="button"
-        @click.prevent="toggleForm"
+        @click.prevent="onEditClick"
       >
         {{ __('Edit') }}
       </button>
diff --git a/app/assets/javascripts/sidebar/components/subscriptions/subscriptions.vue b/app/assets/javascripts/sidebar/components/subscriptions/subscriptions.vue
index 0d1faceef11..1f5f19d1931 100644
--- a/app/assets/javascripts/sidebar/components/subscriptions/subscriptions.vue
+++ b/app/assets/javascripts/sidebar/components/subscriptions/subscriptions.vue
@@ -4,6 +4,7 @@ import icon from '~/vue_shared/components/icon.vue';
 import toggleButton from '~/vue_shared/components/toggle_button.vue';
 import tooltip from '~/vue_shared/directives/tooltip';
 import eventHub from '../../event_hub';
+import { trackEvent } from 'ee_else_ce/event_tracking/issue_sidebar';
 
 const ICON_ON = 'notifications';
 const ICON_OFF = 'notifications-off';
@@ -63,6 +64,8 @@ export default {
 
       // Component event emission.
       this.$emit('toggleSubscription', this.id);
+
+      trackEvent('toggle_button', 'notifications', this.subscribed ? 0 : 1);
     },
     onClickCollapsedIcon() {
       this.$emit('toggleSidebar');