fix(web.domain): update tracking for contact management

ref: MANAGER-15859 Signed-off-by: Guillaume Hyenne <[email protected]>
ovh · Jan 8, 2025 · 568652d · 568652d
1 parent 96b6ecf
commit 568652d
Show file tree

Hide file tree

Showing 9 changed files with 113 additions and 20 deletions.
diff --git a/packages/manager/apps/web/client/app/domain/contact/contact.constants.js b/packages/manager/apps/web/client/app/domain/contact/contact.constants.js
@@ -190,10 +190,27 @@ export const GUIDE_URLS = {
 
 export const LEGAL_FORM_INDIVIDUAL = 'individual';
 
+const TRACKING_PREFIX = 'web::domain::domain-name::';
+
+const TRACKING_CATEGORY_AND_THEME = {
+  page_category: 'dashboard',
+  page_theme: 'Domains',
+  page: { name: TRACKING_PREFIX },
+};
+
 export const CONTACT_MANAGEMENT_TRACKING = {
-  PREFIX: 'web::domain::domain-name::',
-  REASSIGN_CONTACT: 'page::button::reset_domain-name-contacts',
-  EDIT_CONTACT: 'tile::button::edit_{{contactType}}-contact',
+  PAGE: {
+    name: `${TRACKING_PREFIX}domain-name::dashboard::contact-management`,
+    ...TRACKING_CATEGORY_AND_THEME,
+  },
+  REASSIGN_CONTACT: {
+    name: `${TRACKING_PREFIX}page::button::reset_domain-name-contacts`,
+    ...TRACKING_CATEGORY_AND_THEME,
+  },
+  EDIT_CONTACT: {
+    name: `${TRACKING_PREFIX}tile::button::edit_{{contactType}}-contact`,
+    ...TRACKING_CATEGORY_AND_THEME,
+  },
 };
 
 export default {

diff --git a/packages/manager/apps/web/client/app/domain/contact/contact.controller.js b/packages/manager/apps/web/client/app/domain/contact/contact.controller.js
@@ -94,12 +94,13 @@ export default class DomainContactDashboardCtrl {
   }
 
   editContact(contactType) {
-    this.trackClick(
-      CONTACT_MANAGEMENT_TRACKING.EDIT_CONTACT.replace(
+    this.trackClick({
+      ...CONTACT_MANAGEMENT_TRACKING.EDIT_CONTACT,
+      name: CONTACT_MANAGEMENT_TRACKING.EDIT_CONTACT.name.replace(
         '{{contactType}}',
         contactType,
       ),
-    );
+    });
     if (contactType !== 'holder') {
       return window.open(this.USER_ACCOUNT_INFOS_LINK, '_blank');
     }
@@ -147,7 +148,7 @@ export default class DomainContactDashboardCtrl {
 
   trackClick(hit) {
     this.atInternet.trackClick({
-      name: `${CONTACT_MANAGEMENT_TRACKING.PREFIX}${hit}`,
+      ...hit,
       type: 'action',
     });
   }

diff --git a/packages/manager/apps/web/client/app/domain/contact/contact.routing.js b/packages/manager/apps/web/client/app/domain/contact/contact.routing.js
@@ -1,4 +1,5 @@
 import { PRODUCT_TYPE } from '../list/list-domain-layout.constants';
+import { CONTACT_MANAGEMENT_TRACKING } from './contact.constants';
 
 export default /* @ngInject */ ($stateProvider) => {
   $stateProvider.state('app.domain.product.contact', {
@@ -22,8 +23,10 @@ export default /* @ngInject */ ($stateProvider) => {
         $state.go('app.domain.product.zone'),
     },
     atInternet: {
-      rename:
-        'web::domain::domain-name::domain-name::dashboard::contact-management',
+      ignore: true,
+    },
+    onEnter: /* @ngInject */ (atInternet) => {
+      atInternet.trackPage(CONTACT_MANAGEMENT_TRACKING.PAGE);
     },
   });
 };
diff --git a/packages/manager/apps/web/client/app/domain/contact/edit/edit.constants.js b/packages/manager/apps/web/client/app/domain/contact/edit/edit.constants.js
@@ -110,11 +110,35 @@ export const REGEX = {
   PHONE: /^\+(\d{1,5}\.)?\d{1,15}$/,
 };
 
+const TRACKING_PREFIX = 'web::domain::domain-name::';
+
+const TRACKING_CATEGORY_AND_THEME = {
+  page_category: 'funnel',
+  page_theme: 'Domains',
+  page: { name: TRACKING_PREFIX },
+};
+
 export const CONTACT_MANAGEMENT_EDIT_TRACKING = {
-  PREFIX: 'web::domain::domain-name::funnel::',
-  SUBMIT: 'button::edit_holder-contact_confirm',
-  CANCEL: 'button::edit_holder-contact_cancel',
-  LINK: 'link::edit_holder_next',
+  PAGE: {
+    name: `${TRACKING_PREFIX}domain-name::funnel::edit_holder-contact`,
+    ...TRACKING_CATEGORY_AND_THEME,
+  },
+  BANNER: {
+    name: `${TRACKING_PREFIX}domain-name::funnel::edit_holder-contact::banner-{{bannerType}}::edit-holder-contact_{{bannerType}}`,
+    ...TRACKING_CATEGORY_AND_THEME,
+  },
+  SUBMIT: {
+    name: `${TRACKING_PREFIX}funnel::button::edit_holder-contact_confirm`,
+    ...TRACKING_CATEGORY_AND_THEME,
+  },
+  CANCEL: {
+    name: `${TRACKING_PREFIX}funnel::button::edit_holder-contact_cancel`,
+    ...TRACKING_CATEGORY_AND_THEME,
+  },
+  LINK: {
+    name: `${TRACKING_PREFIX}funnel::link::edit_holder_next`,
+    ...TRACKING_CATEGORY_AND_THEME,
+  },
 };
 
 export default {

diff --git a/packages/manager/apps/web/client/app/domain/contact/edit/edit.controller.js b/packages/manager/apps/web/client/app/domain/contact/edit/edit.controller.js
@@ -204,6 +204,7 @@ export default class DomainContactEditCtrl {
               ),
               'InfoErrors',
             );
+            this.trackErrorBanner();
           }),
       )
       .catch((error) => {
@@ -222,6 +223,7 @@ export default class DomainContactEditCtrl {
           }`,
           'InfoErrors',
         );
+        this.trackErrorBanner();
       })
       .finally(() => {
         this.isSubmitting = false;
@@ -235,8 +237,18 @@ export default class DomainContactEditCtrl {
 
   trackClick(hit) {
     this.atInternet.trackClick({
-      name: `${CONTACT_MANAGEMENT_EDIT_TRACKING.PREFIX}${hit}`,
+      ...hit,
       type: 'action',
     });
   }
+
+  trackErrorBanner() {
+    this.atInternet.trackPage({
+      ...CONTACT_MANAGEMENT_EDIT_TRACKING.BANNER,
+      name: CONTACT_MANAGEMENT_EDIT_TRACKING.BANNER.name.replace(
+        /{{bannerType}}/g,
+        'error',
+      ),
+    });
+  }
 }
diff --git a/packages/manager/apps/web/client/app/domain/contact/edit/edit.routing.js b/packages/manager/apps/web/client/app/domain/contact/edit/edit.routing.js
@@ -1,3 +1,5 @@
+import { CONTACT_MANAGEMENT_EDIT_TRACKING } from './edit.constants';
+
 export default /* @ngInject */ ($stateProvider) => {
   $stateProvider.state('app.domain.product.contact.edit', {
     url: '/edit-contact/:contactId/',
@@ -15,22 +17,37 @@ export default /* @ngInject */ ($stateProvider) => {
         $transition$.params().contactId,
       contactInformations: /* @ngInject */ (contactId, ContactService) =>
         ContactService.getDomainContactInformations(contactId),
-      goBack: /* @ngInject */ ($state, Alerter) => (
+      goBack: /* @ngInject */ ($state, Alerter, $timeout, atInternet) => (
         message = false,
         type = 'success',
       ) => {
-        const promise = $state.go('app.domain.product.contact');
+        const promise = $state.go('app.domain.product.contact', null, {
+          reload: !!message,
+        });
 
         if (message) {
-          promise.then(() => Alerter[type](message, 'dashboardContact'));
+          promise.then(() =>
+            $timeout(() => {
+              Alerter[type](message, 'dashboardContact');
+              atInternet.trackPage({
+                ...CONTACT_MANAGEMENT_EDIT_TRACKING.BANNER,
+                name: CONTACT_MANAGEMENT_EDIT_TRACKING.BANNER.name.replace(
+                  /{{bannerType}}/g,
+                  type,
+                ),
+              });
+            }, 1000),
+          );
         }
 
         return promise;
       },
     },
     atInternet: {
-      rename:
-        'web::domain::domain-name::domain-name::funnel::edit_holder-contact',
+      ignore: true,
+    },
+    onEnter: /* @ngInject */ (atInternet) => {
+      atInternet.trackPage(CONTACT_MANAGEMENT_EDIT_TRACKING.PAGE);
     },
   });
 };
diff --git a/packages/manager/apps/web/client/app/domain/dashboard/domain.constant.js b/packages/manager/apps/web/client/app/domain/dashboard/domain.constant.js
@@ -52,13 +52,21 @@ export const DOMAIN_OPTION_STATUS = {
   INACTIVE: 'released',
 };
 
+export const CONTACT_MANAGEMENT_TRACKING = {
+  name:
+    'web::domain::domain-name::main-tabnav::go-to-tab::contact-management_domain-name',
+  page_theme: 'Domains',
+  type: 'action',
+};
+
 export default {
   ALERTS,
   WHOIS_STATUS,
   WHOIS_ALL_CONTACT_OPTIN_RULE,
   DOMAIN_OPTION_STATUS,
   RENEW_URL,
   DOMAIN_SERVICE_STATUS,
+  CONTACT_MANAGEMENT_TRACKING,
 };
 
 angular.module('App').constant('DOMAIN', {

diff --git a/packages/manager/apps/web/client/app/domain/dashboard/domain.controller.js b/packages/manager/apps/web/client/app/domain/dashboard/domain.controller.js
@@ -1,7 +1,11 @@
 import filter from 'lodash/filter';
 import get from 'lodash/get';
 
-import { RENEW_URL, DOMAIN_SERVICE_STATUS } from './domain.constant';
+import {
+  RENEW_URL,
+  DOMAIN_SERVICE_STATUS,
+  CONTACT_MANAGEMENT_TRACKING,
+} from './domain.constant';
 
 angular.module('App').controller(
   'DomainCtrl',
@@ -16,6 +20,7 @@ angular.module('App').controller(
       $timeout,
       $translate,
       Alerter,
+      atInternet,
       constants,
       coreURLBuilder,
       Domain,
@@ -38,6 +43,7 @@ angular.module('App').controller(
       this.$timeout = $timeout;
       this.$translate = $translate;
       this.Alerter = Alerter;
+      this.atInternet = atInternet;
       this.constants = constants;
       this.Domain = Domain;
       this.coreURLBuilder = coreURLBuilder;
@@ -264,5 +270,9 @@ angular.module('App').controller(
     getState() {
       return this.isAllDom ? 'app.alldom.domain' : 'app.domain.product';
     }
+
+    trackClickContactManagement() {
+      this.atInternet.trackClick(CONTACT_MANAGEMENT_TRACKING);
+    }
   },
 );
diff --git a/packages/manager/apps/web/client/app/domain/dashboard/domain.html b/packages/manager/apps/web/client/app/domain/dashboard/domain.html
@@ -141,6 +141,7 @@
             <oui-header-tabs-item
                 data-state="app.domain.product.contact"
                 data-state-params="ctrlDomain.$stateParams"
+                data-ng-click="ctrlDomain.trackClickContactManagement()"
                 ><span data-translate="domain_tab_contact"></span>
             </oui-header-tabs-item>
         </oui-header-tabs>