Added Ga4 to reverse diagram

dvsa · Apr 4, 2024 · 94aa7be · 94aa7be
1 parent fe89018
commit 94aa7be
Show file tree

Hide file tree

Showing 3 changed files with 108 additions and 2 deletions.
diff --git a/...omponents/reverse-diagram-modal/__tests__/reverse-diagram-modal.analytics.effects.spec.ts b/...omponents/reverse-diagram-modal/__tests__/reverse-diagram-modal.analytics.effects.spec.ts
@@ -11,6 +11,10 @@ import {
   AnalyticsScreenNames,
   AnalyticsEventCategories,
   AnalyticsEvents,
+  GoogleAnalyticsEventPrefix,
+  GoogleAnalyticsEvents,
+  GoogleAnalyticsEventsTitles,
+  GoogleAnalyticsEventsValues,
 } from '@providers/analytics/analytics.model';
 import { AnalyticRecorded } from '@providers/analytics/analytics.actions';
 import { StoreModel } from '@shared/models/store.model';
@@ -73,6 +77,7 @@ describe('ReverseDiagramModalAnalyticsEffects', () => {
       // ASSERT
       effects.reverseDiagramViewDidEnter$.subscribe((result) => {
         expect(result.type).toEqual(AnalyticRecorded.type);
+        // TODO - MES-9495 - remove old analytics
         expect(analyticsProviderMock.addCustomDimension)
           .toHaveBeenCalledWith(AnalyticsDimensionIndices.TEST_CATEGORY, 'B+E');
         expect(analyticsProviderMock.addCustomDimension)
@@ -81,6 +86,16 @@ describe('ReverseDiagramModalAnalyticsEffects', () => {
           .toHaveBeenCalledWith(AnalyticsDimensionIndices.APPLICATION_REFERENCE, '123456789');
         expect(analyticsProviderMock.setCurrentPage)
           .toHaveBeenCalledWith(screenName);
+
+        // GA4 Analytics
+        expect(analyticsProviderMock.addGACustomDimension)
+          .toHaveBeenCalledWith(AnalyticsDimensionIndices.TEST_CATEGORY, 'B+E');
+        expect(analyticsProviderMock.addGACustomDimension)
+          .toHaveBeenCalledWith(AnalyticsDimensionIndices.CANDIDATE_ID, '1');
+        expect(analyticsProviderMock.addGACustomDimension)
+          .toHaveBeenCalledWith(AnalyticsDimensionIndices.APPLICATION_REFERENCE, '123456789');
+        expect(analyticsProviderMock.setGACurrentPage)
+          .toHaveBeenCalledWith(screenName);
         done();
       });
     });
@@ -95,6 +110,7 @@ describe('ReverseDiagramModalAnalyticsEffects', () => {
       // ASSERT
       effects.reverseDiagramViewDidEnter$.subscribe((result) => {
         expect(result.type).toEqual(AnalyticRecorded.type);
+        // TODO - MES-9495 - remove old analytics
         expect(analyticsProviderMock.addCustomDimension)
           .toHaveBeenCalledWith(AnalyticsDimensionIndices.TEST_CATEGORY, 'B+E');
         expect(analyticsProviderMock.addCustomDimension)
@@ -103,6 +119,16 @@ describe('ReverseDiagramModalAnalyticsEffects', () => {
           .toHaveBeenCalledWith(AnalyticsDimensionIndices.APPLICATION_REFERENCE, '123456789');
         expect(analyticsProviderMock.setCurrentPage)
           .toHaveBeenCalledWith(screenNamePracticeMode);
+
+        // GA4 Analytics
+        expect(analyticsProviderMock.addGACustomDimension)
+          .toHaveBeenCalledWith(AnalyticsDimensionIndices.TEST_CATEGORY, 'B+E');
+        expect(analyticsProviderMock.addGACustomDimension)
+          .toHaveBeenCalledWith(AnalyticsDimensionIndices.CANDIDATE_ID, '1');
+        expect(analyticsProviderMock.addGACustomDimension)
+          .toHaveBeenCalledWith(AnalyticsDimensionIndices.APPLICATION_REFERENCE, '123456789');
+        expect(analyticsProviderMock.setGACurrentPage)
+          .toHaveBeenCalledWith(`${GoogleAnalyticsEventPrefix.PRACTICE_MODE}_${screenName}`);
         done();
       });
     });
@@ -117,11 +143,19 @@ describe('ReverseDiagramModalAnalyticsEffects', () => {
       // ASSERT
       effects.reverseDiagramOpened$.subscribe((result) => {
         expect(result.type).toEqual(AnalyticRecorded.type);
+        // TODO - MES-9495 - remove old analytics
         expect(analyticsProviderMock.logEvent).toHaveBeenCalledTimes(1);
         expect(analyticsProviderMock.logEvent).toHaveBeenCalledWith(
           `${AnalyticsEventCategories.PRACTICE_TEST} - ${AnalyticsEventCategories.TEST_REPORT}`,
           `${AnalyticsEventCategories.PRACTICE_TEST} - ${AnalyticsEvents.REVERSE_DIAGRAM_OPENED}`,
         );
+        // GA4 Analytics
+        expect(analyticsProviderMock.logGAEvent).toHaveBeenCalledTimes(1);
+        expect(analyticsProviderMock.logGAEvent).toHaveBeenCalledWith(
+          GoogleAnalyticsEvents.NAVIGATION,
+          GoogleAnalyticsEventsTitles.OPENED,
+          GoogleAnalyticsEventsValues.REVERSE_DIAGRAM,
+        );
         done();
       });
     });
@@ -136,11 +170,19 @@ describe('ReverseDiagramModalAnalyticsEffects', () => {
       // ASSERT
       effects.reverseDiagramClosed$.subscribe((result) => {
         expect(result.type).toEqual(AnalyticRecorded.type);
+        // TODO - MES-9495 - remove old analytics
         expect(analyticsProviderMock.logEvent).toHaveBeenCalledTimes(1);
         expect(analyticsProviderMock.logEvent).toHaveBeenCalledWith(
           `${AnalyticsEventCategories.PRACTICE_TEST} - ${AnalyticsEventCategories.TEST_REPORT}`,
           `${AnalyticsEventCategories.PRACTICE_TEST} - ${AnalyticsEvents.REVERSE_DIAGRAM_CLOSED}`,
         );
+        // GA4 Analytics
+        expect(analyticsProviderMock.logGAEvent).toHaveBeenCalledTimes(1);
+        expect(analyticsProviderMock.logGAEvent).toHaveBeenCalledWith(
+          GoogleAnalyticsEvents.NAVIGATION,
+          GoogleAnalyticsEventsTitles.CLOSED,
+          GoogleAnalyticsEventsValues.REVERSE_DIAGRAM,
+        );
         done();
       });
     });
@@ -155,12 +197,22 @@ describe('ReverseDiagramModalAnalyticsEffects', () => {
       // ASSERT
       effects.reverseDiagramLengthChanged$.subscribe((result) => {
         expect(result.type).toEqual(AnalyticRecorded.type);
+        // TODO - MES-9495 - remove old analytics
         expect(analyticsProviderMock.logEvent).toHaveBeenCalledTimes(1);
         expect(analyticsProviderMock.logEvent).toHaveBeenCalledWith(
           `${AnalyticsEventCategories.PRACTICE_TEST} - ${AnalyticsEventCategories.TEST_REPORT}`,
           `${AnalyticsEventCategories.PRACTICE_TEST} - ${AnalyticsEvents.REVERSE_DIAGRAM_LENGTH_CHANGED}`,
           'from 100 to 10',
         );
+        // GA4 Analytics
+        expect(analyticsProviderMock.logGAEvent).toHaveBeenCalledTimes(1);
+        expect(analyticsProviderMock.logGAEvent).toHaveBeenCalledWith(
+          GoogleAnalyticsEvents.VEHICLE_LENGTH,
+          GoogleAnalyticsEventsTitles.CHANGED_FROM,
+          '100',
+          GoogleAnalyticsEventsTitles.CHANGED_TO,
+          '10',
+        );
         done();
       });
     });
@@ -175,12 +227,22 @@ describe('ReverseDiagramModalAnalyticsEffects', () => {
       // ASSERT
       effects.reverseDiagramWidthChanged$.subscribe((result) => {
         expect(result.type).toEqual(AnalyticRecorded.type);
+        // TODO - MES-9495 - remove old analytics
         expect(analyticsProviderMock.logEvent).toHaveBeenCalledTimes(1);
         expect(analyticsProviderMock.logEvent).toHaveBeenCalledWith(
           `${AnalyticsEventCategories.PRACTICE_TEST} - ${AnalyticsEventCategories.TEST_REPORT}`,
           `${AnalyticsEventCategories.PRACTICE_TEST} - ${AnalyticsEvents.REVERSE_DIAGRAM_WIDTH_CHANGED}`,
           'from 100 to 10',
         );
+        // GA4 Analytics
+        expect(analyticsProviderMock.logGAEvent).toHaveBeenCalledTimes(1);
+        expect(analyticsProviderMock.logGAEvent).toHaveBeenCalledWith(
+          GoogleAnalyticsEvents.VEHICLE_WIDTH,
+          GoogleAnalyticsEventsTitles.CHANGED_FROM,
+          '100',
+          GoogleAnalyticsEventsTitles.CHANGED_TO,
+          '10',
+        );
         done();
       });
     });

diff --git a/...s/test-report/components/reverse-diagram-modal/reverse-diagram-modal.analytics.effects.ts b/...s/test-report/components/reverse-diagram-modal/reverse-diagram-modal.analytics.effects.ts
@@ -7,7 +7,7 @@ import {
   AnalyticsScreenNames,
   AnalyticsDimensionIndices,
   AnalyticsEventCategories,
-  AnalyticsEvents,
+  AnalyticsEvents, GoogleAnalyticsEvents, GoogleAnalyticsEventsTitles, GoogleAnalyticsEventsValues,
 } from '@providers/analytics/analytics.model';
 import { StoreModel } from '@shared/models/store.model';
 import { Store, select } from '@ngrx/store';
@@ -17,7 +17,7 @@ import { getCandidate } from '@store/tests/journal-data/common/candidate/candida
 import { getCandidateId } from '@store/tests/journal-data/common/candidate/candidate.selector';
 import { TestsModel } from '@store/tests/tests.model';
 import { AnalyticRecorded } from '@providers/analytics/analytics.actions';
-import { formatAnalyticsText } from '@shared/helpers/format-analytics-text';
+import { analyticsEventTypePrefix, formatAnalyticsText } from '@shared/helpers/format-analytics-text';
 import {
   getApplicationReference,
 } from '@store/tests/journal-data/common/application-reference/application-reference.reducer';
@@ -70,12 +70,20 @@ export class ReverseDiagramModalAnalyticsEffects {
       [, tests, applicationReference, candidateId, category]:
       [ReturnType <typeof reverseDiagramActions.ReverseDiagramViewDidEnter>, TestsModel, string, number, CategoryCode],
     ) => {
+      // TODO - MES-9495 - remove old analytics
       this.analytics.addCustomDimension(AnalyticsDimensionIndices.TEST_CATEGORY, category);
       this.analytics.addCustomDimension(AnalyticsDimensionIndices.CANDIDATE_ID, `${candidateId}`);
       this.analytics.addCustomDimension(AnalyticsDimensionIndices.APPLICATION_REFERENCE, applicationReference);
       this.analytics.setCurrentPage(
         formatAnalyticsText(AnalyticsScreenNames.REVERSE_DIAGRAM, tests),
       );
+      // GA4 Analytics
+      this.analytics.addGACustomDimension(AnalyticsDimensionIndices.TEST_CATEGORY, category);
+      this.analytics.addGACustomDimension(AnalyticsDimensionIndices.CANDIDATE_ID, `${candidateId}`);
+      this.analytics.addGACustomDimension(AnalyticsDimensionIndices.APPLICATION_REFERENCE, applicationReference);
+      this.analytics.setGACurrentPage(
+        analyticsEventTypePrefix(AnalyticsScreenNames.REVERSE_DIAGRAM, tests),
+      );
       return of(AnalyticRecorded());
     }),
   ));
@@ -90,10 +98,17 @@ export class ReverseDiagramModalAnalyticsEffects {
       ),
     )),
     concatMap(([, tests]: [ReturnType <typeof reverseDiagramActions.ReverseDiagramOpened>, TestsModel]) => {
+      // TODO - MES-9495 - remove old analytics
       this.analytics.logEvent(
         formatAnalyticsText(AnalyticsEventCategories.TEST_REPORT, tests),
         formatAnalyticsText(AnalyticsEvents.REVERSE_DIAGRAM_OPENED, tests),
       );
+      // GA4 Analytics
+      this.analytics.logGAEvent(
+        GoogleAnalyticsEvents.NAVIGATION,
+        GoogleAnalyticsEventsTitles.OPENED,
+        GoogleAnalyticsEventsValues.REVERSE_DIAGRAM,
+      );
       return of(AnalyticRecorded());
     }),
   ));
@@ -108,10 +123,17 @@ export class ReverseDiagramModalAnalyticsEffects {
       ),
     )),
     concatMap(([, tests]: [ReturnType <typeof reverseDiagramActions.ReverseDiagramClosed>, TestsModel]) => {
+      // TODO - MES-9495 - remove old analytics
       this.analytics.logEvent(
         formatAnalyticsText(AnalyticsEventCategories.TEST_REPORT, tests),
         formatAnalyticsText(AnalyticsEvents.REVERSE_DIAGRAM_CLOSED, tests),
       );
+      // GA4 Analytics
+      this.analytics.logGAEvent(
+        GoogleAnalyticsEvents.NAVIGATION,
+        GoogleAnalyticsEventsTitles.CLOSED,
+        GoogleAnalyticsEventsValues.REVERSE_DIAGRAM,
+      );
       return of(AnalyticRecorded());
     }),
   ));
@@ -127,11 +149,20 @@ export class ReverseDiagramModalAnalyticsEffects {
     )),
     concatMap(([action, tests]:
     [ReturnType<typeof reverseDiagramActions.ReverseDiagramLengthChanged>, TestsModel]) => {
+      // TODO - MES-9495 - remove old analytics
       this.analytics.logEvent(
         formatAnalyticsText(AnalyticsEventCategories.TEST_REPORT, tests),
         formatAnalyticsText(AnalyticsEvents.REVERSE_DIAGRAM_LENGTH_CHANGED, tests),
         `from ${action.previousLength} to ${action.newLength}`,
       );
+      // GA4 Analytics
+      this.analytics.logGAEvent(
+        GoogleAnalyticsEvents.VEHICLE_LENGTH,
+        GoogleAnalyticsEventsTitles.CHANGED_FROM,
+        action.previousLength.toString(),
+        GoogleAnalyticsEventsTitles.CHANGED_TO,
+        action.newLength.toString(),
+      );
       return of(AnalyticRecorded());
     }),
   ));
@@ -146,11 +177,20 @@ export class ReverseDiagramModalAnalyticsEffects {
       ),
     )),
     concatMap(([action, tests]: [ReturnType <typeof reverseDiagramActions.ReverseDiagramWidthChanged>, TestsModel]) => {
+      // TODO - MES-9495 - remove old analytics
       this.analytics.logEvent(
         formatAnalyticsText(AnalyticsEventCategories.TEST_REPORT, tests),
         formatAnalyticsText(AnalyticsEvents.REVERSE_DIAGRAM_WIDTH_CHANGED, tests),
         `from ${action.previousWidth} to ${action.newWidth}`,
       );
+      // GA4 Analytics
+      this.analytics.logGAEvent(
+        GoogleAnalyticsEvents.VEHICLE_WIDTH,
+        GoogleAnalyticsEventsTitles.CHANGED_FROM,
+        action.previousWidth.toString(),
+        GoogleAnalyticsEventsTitles.CHANGED_TO,
+        action.newWidth.toString(),
+      );
       return of(AnalyticRecorded());
     }),
   ));

diff --git a/src/app/providers/analytics/analytics.model.ts b/src/app/providers/analytics/analytics.model.ts
@@ -292,6 +292,8 @@ export enum GoogleAnalyticsEvents {
   DUAL_CONTROLS = 'dual_controls',
   BIKE_CATEGORY_SELECTED = 'bike_category_selected',
   NAVIGATION = 'navigation',
+  VEHICLE_LENGTH = 'vehicle_length',
+  VEHICLE_WIDTH = 'vehicle_width',
   SET_TRANSMISSION = 'set_transmission',
   PDI_LOGBOOK = 'pdi_logbook',
   TRAINEE_LICENCE = 'trainee_licence',
@@ -335,6 +337,7 @@ export enum GoogleAnalyticsEventsTitles {
   COMMS_CHANNEL = 'comms_channel',
   FINALISATION_D255 = 'd255',
   OPENED = 'opened',
+  CLOSED = 'closed',
   SELECTION = 'selection',
   TRANSMISSION_TYPE = 'transmission_type',
   MOT_STATUS = 'mot_status',
@@ -348,6 +351,7 @@ export enum GoogleAnalyticsEventsTitles {
 }
 
 export enum GoogleAnalyticsEventsValues {
+  REVERSE_DIAGRAM = 'reverse_diagram',
   ECO = 'eco',
   CAR_TO_BIKE = 'car_to_bike',
   BIKE_TO_BIKE = 'bike_to_bike',