@meetelise/chat 1.20.73 → 1.20.75

package/src/MEChat.ts

@@ -273,6 +273,7 @@ const overrideContactUsForm = async (
       "Missing the following form elements: " + missingElements.join(", ")
     );
   }
+  const originalButtonText = btn.textContent;
 
   // Replace the original form element with the cloned one
   const clonedButton = btn.cloneNode(true) as HTMLButtonElement;
@@ -282,6 +283,9 @@ const overrideContactUsForm = async (
     if (!isValid()) return;
     event.preventDefault();
 
+    clonedButton.textContent = "Processing request...";
+    clonedButton.disabled = true;
+
     const formValues: { [key: string]: string | undefined } = {};
     Object.entries(getFormElements()).forEach(
       ([key, val]) => (formValues[key] = val?.value)
@@ -325,21 +329,25 @@ const overrideContactUsForm = async (
         "org-slug": orgSlug,
       },
       body: jsonData,
-    }).then((response) => {
-      if (!response.ok) {
-        throw new Error(`HTTP error ${response.status}`);
-      }
+    })
+      .then((response) => {
+        if (!response.ok) {
+          throw new Error(`HTTP error ${response.status}`);
+        }
+
+        form.reset();
+        Object.values(getFormElements()).forEach((el) => {
+          if (!el) return;
+          el.disabled = true;
+        });
+        clonedButton.textContent = "Submitted";
+        clonedButton.disabled = true;
 
-      form.reset();
-      Object.values(getFormElements()).forEach((el) => {
-        if (!el) return;
-        el.disabled = true;
+        return response.json();
+      })
+      .catch(() => {
+        clonedButton.textContent = originalButtonText;
       });
-      clonedButton.textContent = "Submitted";
-      clonedButton.disabled = true;
-
-      return response.json();
-    });
   };
 };
 

package/src/WebComponent/Scheduler/tour-scheduler.ts

@@ -30,6 +30,7 @@ import { InputStyles } from "../actions/InputStyles";
 import { classMap } from "lit/directives/class-map.js";
 import postLeadSources from "../../postLeadSources";
 import { FeatureFlagsShowDropdown } from "../../fetchFeatureFlag";
+import { pushGtmEvent } from "../../gtm";
 
 const getHumanReadableLayout = (layout: string) => {
   if (layout == "studio") return "Studio";
@@ -373,6 +374,30 @@ export class TourScheduler extends LitElement {
         ? this.selectedLeadSource.value
         : this.currentLeadSource;
 
+    const leadSources = [
+      ...new Set(
+        parsedLeadSource
+          ? [parsedLeadSource, "property-website"]
+          : ["property-website"]
+      ),
+    ];
+    pushGtmEvent("scheduleTourSubmitted", {
+      email: this.email,
+      phone: `+1${this.phoneNumber.match(/\d/g)?.join("")}`,
+      firstName: this.firstNameInput.value,
+      lastName: this.lastNameInput.value,
+      tourType: tourTypeForSubmission[this.tourType],
+      tourTime: `${this.selectedTime.datetime}${this.selectedTime.offset}`,
+      layouts: this.layoutTypeSelect.value
+        ? [this.layoutTypeSelect.value]
+        : null,
+      unitNumbers:
+        this.unitTypeSelect && this.unitTypeSelect.value
+          ? [this.unitTypeSelect.value]
+          : null,
+      originatingSource:
+        leadSources.find((i) => i !== "property-website") || null,
+    });
     const data = {
       referrer: document.referrer,
       email_address: this.email,

package/src/WebComponent/actions/email-us-window.ts

@@ -15,6 +15,7 @@ import {
 import { InputStyles } from "./InputStyles";
 import axios from "axios";
 import { FeatureFlagsShowDropdown } from "../../fetchFeatureFlag";
+import { pushGtmEvent } from "../../gtm";
 
 @customElement("email-us-window")
 export class EmailUsWindow extends LitElement {
@@ -488,7 +489,15 @@ const createEmail = async (
     // @ts-ignore
     query_params: Object.fromEntries(queryParams.entries()),
   };
-
+  pushGtmEvent("emailUsSubmitted", {
+    firstName,
+    lastName,
+    email,
+    phone: formattedPhoneNumber,
+    message,
+    originatingSource:
+      leadSources.find((i) => i !== "property-website") || null,
+  });
   await axios.post(
     "https://app.meetelise.com/platformApi/state/create/emailMe",
     requestBody,

package/src/WebComponent/actions/text-us-window.ts

@@ -10,6 +10,7 @@ import {
 } from "./formatPhoneNumber";
 import { InputStyles } from "./InputStyles";
 import axios from "axios";
+import { pushGtmEvent } from "../../gtm";
 
 @customElement("text-us-window")
 export class TextUsWindow extends LitElement {
@@ -266,7 +267,11 @@ const createTextWithUs = async (
     // @ts-ignore
     query_params: Object.fromEntries(queryParams.entries()),
   };
-
+  pushGtmEvent("textUsSubmitted", {
+    phone: formattedPhoneNumber,
+    originatingSource:
+      leadSources.find((i) => i !== "property-website") || null,
+  });
   await axios.post(
     "https://app.meetelise.com/platformApi/state/create/textMe",
     requestBody,

package/src/gtm.ts

@@ -0,0 +1,17 @@
+declare global {
+  interface Window {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    dataLayer: any[];
+  }
+}
+
+export const pushGtmEvent = (
+  eventName: string,
+  event: Record<string, unknown> = {}
+): void => {
+  window.dataLayer = window.dataLayer || [];
+  window.dataLayer.push({
+    event: eventName,
+    ...event,
+  });
+};