Changes from the feature/PM-56724-dl-thank-you (#232)

blocks/thank-you/thank-you.js

@@ -3,6 +3,7 @@ import {
   COOKIE_NAME_SAVED_OWNER_ID,
   deleteCookie,
 } from '../../scripts/24petwatch-utils.js';
+import { trackGTMEvent } from '../../scripts/lib-analytics.js';
 
 // prep for API calls
 const apiBaseUrl = await getAPIBaseUrl();
@@ -70,6 +71,18 @@ async function postEmailReceipt(ownerId) {
   }
 }
 
+// Step 7 - get transaction details
+async function getTransaction(paymentProcessorId) {
+  try {
+    const data = await APIClientObj.getTransaction(paymentProcessorId);
+    return data;
+  } catch (status) {
+    // eslint-disable-next-line no-console
+    console.log('Failed to get the transaction details:', status);
+    return [];
+  }
+}
+
 export default async function decorate() {
   // delete cookie with customer id
   deleteCookie(COOKIE_NAME_SAVED_OWNER_ID);
@@ -88,8 +101,13 @@ export default async function decorate() {
 
   await postEmailReceipt(getOwnerDetails.id);
 
+  const transactionDetails = await getTransaction(paymentProcessorId);
+  const { externalTransactionID, paymentMethod } = transactionDetails;
+
   const h1 = document.querySelector('h1');
-  const { firstName, lastName } = getOwnerDetails;
+  const {
+    cartFlow, firstName, lastName, nonInsPromoCode,
+  } = getOwnerDetails;
   const { petSummaries } = getPurchaseSummaryDetails;
   const contentColumn = document.querySelector('.thank-you-purchase .columns > div:nth-child(1) > div');
 
@@ -138,6 +156,23 @@ export default async function decorate() {
 
   contentColumn.appendChild(totals);
 
+  const trackingData = {
+    microchip_number: petSummaries[0].microChipNumber,
+    product_type: petSummaries[0].membershipName,
+    transaction_id: externalTransactionID,
+    affiliation: '24petwatch',
+    tax: summary.salesTaxes,
+    payment_type: paymentMethod,
+    value: summary.totalDueToday,
+    shipping: petSummaries[0].nonInsurancePetSummary.shipping,
+    coupon: nonInsPromoCode,
+    flow: cartFlow,
+    customerid: getOwnerDetails.id,
+  };
+
+  // send the GTM event
+  trackGTMEvent('purchase', trackingData);
+
   const printButton = document.createElement('button');
   printButton.classList.add('button');
   printButton.innerHTML = 'Print <span class="visually-hidden">this page</span>';

scripts/24petwatch-api.js

@@ -109,7 +109,7 @@ export default class APIClient {
   }
 
   getPaymentCustomerIDFromUUID(customerUUID) {
-    const path = '/Transaction/GetPaymentCustomerIDFromUUID';
+    const path = 'Transaction/GetPaymentCustomerIDFromUUID';
     const body = { CustomerUUID: customerUUID };
     return new Promise((resolve, reject) => {
       APIClient.callAPI(`${this.basePath}/${path}`, APIClient.METHOD_POST, body, null, resolve, reject, 'json');
@@ -131,6 +131,14 @@ export default class APIClient {
     });
   }
 
+  getTransaction(customerUUID) {
+    const path = 'Product/NonInsurance/GetTransaction';
+    const body = { CustomerUUID: customerUUID };
+    return new Promise((resolve, reject) => {
+      APIClient.callAPI(`${this.basePath}/${path}`, APIClient.METHOD_GET, body, null, resolve, reject, 'json');
+    });
+  }
+
   /** Creates or Updates an owner, depending on whether the ownerId is provided.
    * @param ownerId - if provided, the owner will be updated, otherwise a new owner will be created
    * @param email - string