From 73ffe6005232345ef142eadecdf9504823e74709 Mon Sep 17 00:00:00 2001
From: vhhoang-axonivy <hoang.vuhuy@axonactive.com>
Date: Fri, 29 Nov 2024 10:54:24 +0700
Subject: [PATCH] Bring back Matomo tracking code (#245)

Co-authored-by: Hoang Vu Huy <vhhoang@axonactive.com>
---
 marketplace-ui/src/app/app.config.ts              | 15 ++++++++-------
 .../product-detail-version-action.component.html  | 12 ++++++++++++
 .../product-detail-version-action.component.ts    |  2 ++
 .../product-filter/product-filter.component.html  |  6 +++++-
 .../product-filter/product-filter.component.ts    |  3 ++-
 .../src/environments/environment.development.ts   |  5 ++---
 .../src/environments/environment.staging.ts       |  5 ++---
 marketplace-ui/src/environments/environment.ts    |  5 ++---
 8 files changed, 35 insertions(+), 18 deletions(-)

diff --git a/marketplace-ui/src/app/app.config.ts b/marketplace-ui/src/app/app.config.ts
index 2b8b2a52..262cf8a0 100644
--- a/marketplace-ui/src/app/app.config.ts
+++ b/marketplace-ui/src/app/app.config.ts
@@ -7,6 +7,8 @@ import { MARKED_OPTIONS, MarkdownModule } from 'ngx-markdown';
 import { markedOptionsFactory } from './core/configs/markdown.config';
 import { httpLoaderFactory } from './core/configs/translate.config';
 import { apiInterceptor } from './core/interceptors/api.interceptor';
+import { provideMatomo, withRouter } from 'ngx-matomo-client';
+import { environment } from '../environments/environment';
 
 const scrollConfig: InMemoryScrollingOptions = {
   scrollPositionRestoration: 'disabled',
@@ -22,13 +24,12 @@ export const appConfig: ApplicationConfig = {
     provideRouter(routes, inMemoryScrollingFeature),
     provideHttpClient(withFetch(), withInterceptors([apiInterceptor])),
 
-    //  Disabled for later HTTPS implementation
-    // provideMatomo({
-    //   siteId: environment.matomoSiteId,
-    //   trackerUrl: environment.matomoTrackerUrl,
-    //   },
-    //   withRouter(),
-    // ),
+    provideMatomo({
+      siteId: environment.matomoSiteId,
+      trackerUrl: environment.matomoTrackerUrl,
+      },
+      withRouter(),
+    ),
     importProvidersFrom(
       TranslateModule.forRoot({
         loader: {
diff --git a/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.html b/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.html
index c12554e9..4fb9bca6 100644
--- a/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.html
+++ b/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.html
@@ -5,6 +5,9 @@
         id="install-button"
         name="Install button"
         #installButton
+        [matomoClickCategory]="MatomoCategory.BUTTON"
+        [matomoClickAction]="MatomoAction.CLICK"
+        [matomoClickName]="installButton.name + ' - ' + getTrackingEnvironmentBasedOnActionType()"
         [lang]="languageService.selectedLanguage()"
         class="btn btn__install flex-grow-1 me-lg-2"
         data-bs-toggle="tooltip"
@@ -30,6 +33,9 @@
           id="download-button"
           name="Download button"
           #artifactDownloadButton
+          [matomoClickCategory]="MatomoCategory.BUTTON"
+          [matomoClickAction]="MatomoAction.CLICK"
+          [matomoClickName]="artifactDownloadButton.name + ' - ' + getTrackingEnvironmentBasedOnActionType()"
           [lang]="languageService.selectedLanguage()"
           class="btn btn__download btn-secondary primary-bg flex-grow-1"
           type="button"
@@ -116,6 +122,9 @@
       <button id="install-button"
               name="Install button"
               #installButton
+              [matomoClickCategory]="MatomoCategory.BUTTON"
+              [matomoClickAction]="MatomoAction.CLICK"
+              [matomoClickName]="installButton.name + ' - ' + getTrackingEnvironmentBasedOnActionType()"
               [lang]="languageService.selectedLanguage()"
               class="btn btn__install flex-grow-1 install-designer-button m-0 col-4" id="install-button"
               (click)="onUpdateInstallationCountForDesigner()" onClick="function installInDesigner() {
@@ -135,6 +144,9 @@
             id="contact-us-button"
             name="Contact us button"
             #contactUsButton
+            [matomoClickCategory]="MatomoCategory.BUTTON"
+            [matomoClickAction]="MatomoAction.CLICK"
+            [matomoClickName]="contactUsButton.name + ' - ' + getTrackingEnvironmentBasedOnActionType()"
             [lang]="languageService.selectedLanguage()"
             class="btn row btn_contact-us"
             (click)="onNavigateToContactPage()"
diff --git a/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.ts b/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.ts
index 55efdfcb..7df82821 100644
--- a/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.ts
+++ b/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.ts
@@ -34,6 +34,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 import { ROUTER } from '../../../../shared/constants/router.constant';
 import { MatomoCategory, MatomoAction } from '../../../../shared/enums/matomo-tracking.enum';
 import { MATOMO_TRACKING_ENVIRONMENT } from '../../../../shared/constants/matomo.constant';
+import { MATOMO_DIRECTIVES } from 'ngx-matomo-client';
 
 const showDevVersionCookieName = 'showDevVersions';
 
@@ -46,6 +47,7 @@ const showDevVersionCookieName = 'showDevVersions';
     FormsModule,
     CommonDropdownComponent,
     LoadingSpinnerComponent,
+    MATOMO_DIRECTIVES
   ],
   templateUrl: './product-detail-version-action.component.html',
   styleUrl: './product-detail-version-action.component.scss'
diff --git a/marketplace-ui/src/app/modules/product/product-filter/product-filter.component.html b/marketplace-ui/src/app/modules/product/product-filter/product-filter.component.html
index ed3eddfe..4da94da7 100644
--- a/marketplace-ui/src/app/modules/product/product-filter/product-filter.component.html
+++ b/marketplace-ui/src/app/modules/product/product-filter/product-filter.component.html
@@ -59,7 +59,11 @@ <h4 [lang]="languageService.selectedLanguage()" class="sort-container__label tex
     <input #productFilter autocomplete="on" [(ngModel)]="searchText" (ngModelChange)="onSearchChanged($event)" type="text"
       [lang]="languageService.selectedLanguage()" class="form-control input__search bg-secondary border-0 rounded-start-0 ps-0 search-input"
       [placeholder]="translateService.get('common.search.placeholder') | async"
-      [ariaLabel]="translateService.get('common.search.placeholder') | async" aria-describedby="search"
+      [ariaLabel]="translateService.get('common.search.placeholder') | async" aria-describedby="search" 
+      [matomoTracker]="MatomoTracker.CHANGE"
+      [matomoCategory]="MatomoCategory.INPUT"
+      [matomoAction]="MatomoAction.PRODUCT_SEARCH"
+      [matomoName]="productFilter.value"
     />
   </div>
 </div>
diff --git a/marketplace-ui/src/app/modules/product/product-filter/product-filter.component.ts b/marketplace-ui/src/app/modules/product/product-filter/product-filter.component.ts
index d888fbf1..345c47ef 100644
--- a/marketplace-ui/src/app/modules/product/product-filter/product-filter.component.ts
+++ b/marketplace-ui/src/app/modules/product/product-filter/product-filter.component.ts
@@ -11,11 +11,12 @@ import { CommonDropdownComponent } from '../../../shared/components/common-dropd
 import { CommonUtils } from '../../../shared/utils/common.utils';
 import { ItemDropdown } from '../../../shared/models/item-dropdown.model';
 import { MatomoAction, MatomoCategory, MatomoTracker } from '../../../shared/enums/matomo-tracking.enum';
+import { MATOMO_DIRECTIVES } from 'ngx-matomo-client';
 
 @Component({
   selector: 'app-product-filter',
   standalone: true,
-  imports: [CommonModule, FormsModule, TranslateModule, CommonDropdownComponent],
+  imports: [CommonModule, FormsModule, TranslateModule, CommonDropdownComponent, MATOMO_DIRECTIVES],
   templateUrl: './product-filter.component.html',
   styleUrl: './product-filter.component.scss'
 })
diff --git a/marketplace-ui/src/environments/environment.development.ts b/marketplace-ui/src/environments/environment.development.ts
index f2f2e9b0..03d1a8d0 100644
--- a/marketplace-ui/src/environments/environment.development.ts
+++ b/marketplace-ui/src/environments/environment.development.ts
@@ -4,7 +4,6 @@ export const environment = {
   githubClientId: 'Iv23livu9HbsC4Q24eSC',
   githubAuthCallbackPath: '/auth/github/callback',
   dayInMiliseconds: 86400000,
-  // Disabled for later HTTPS implementation
-  // matomoSiteId: 1,
-  // matomoTrackerUrl: '//marketplace.server.ivy-cloud.com:8085'
+  matomoSiteId: 3,
+  matomoTrackerUrl: '//market.axonivy.com/matomo-web'
 };
diff --git a/marketplace-ui/src/environments/environment.staging.ts b/marketplace-ui/src/environments/environment.staging.ts
index bd9e3ea1..3553bf16 100644
--- a/marketplace-ui/src/environments/environment.staging.ts
+++ b/marketplace-ui/src/environments/environment.staging.ts
@@ -4,7 +4,6 @@ export const environment = {
   githubClientId: 'Iv23livu9HbsC4Q24eSC',
   githubAuthCallbackPath: '/auth/github/callback',
   dayInMiliseconds: 86400000,
-  // Disabled for later HTTPS implementation
-  // matomoSiteId: 1,
-  // matomoTrackerUrl: '//marketplace.server.ivy-cloud.com:8085'
+  matomoSiteId: 2,
+  matomoTrackerUrl: '//market.axonivy.com/matomo-web'
 };
diff --git a/marketplace-ui/src/environments/environment.ts b/marketplace-ui/src/environments/environment.ts
index dc7cfbe6..7dce8a59 100644
--- a/marketplace-ui/src/environments/environment.ts
+++ b/marketplace-ui/src/environments/environment.ts
@@ -4,7 +4,6 @@ export const environment = {
   githubClientId: 'Ov23liK1GCV3aAmN8kby',
   githubAuthCallbackPath: '/auth/github/callback',
   dayInMiliseconds: 86400000,
-  // Disabled for later HTTPS implementation
-  // matomoSiteId: 1,
-  // matomoTrackerUrl: '//marketplace.server.ivy-cloud.com:8085'
+  matomoSiteId: 1,
+  matomoTrackerUrl: '//market.axonivy.com/matomo-web'
 };