@meetelise/chat 1.51.15 → 1.52.0

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

@@ -63,6 +63,7 @@ import { getTimezoneAbbreviation } from "../../getTimezoneString";
 import startOfDay from "date-fns/startOfDay";
 import isSameDay from "date-fns/isSameDay";
 import { LeadSourceMultitouchClient } from "../LeadSourceMultitouchClient";
+import { readGoogleReserveReferral } from "../../googleReserve";
 import fetchBuildingUnitsSummary, {
   UnitSummary,
 } from "../../fetchBuildingUnitsSummary";
@@ -742,6 +743,7 @@ export class TourScheduler extends LitElement {
       unit: selectedUnit,
       conversationTrackingId: this.leadSourceClient?.chatId ?? null,
     });
+    const googleReferral = readGoogleReserveReferral();
     const data = {
       referrer: document.referrer,
       email_address: this.email,
@@ -774,6 +776,8 @@ export class TourScheduler extends LitElement {
           }
         ) ?? []
       ).map((source) => snakify({ ...source })),
+      google_rwg_token: googleReferral?.rwgToken,
+      google_referral_building_id: googleReferral?.buildingId,
     };
 
     const url = `https://app.meetelise.com/platformApi/state/create/v2/scheduleMe`;

package/src/WebComponent/launcher/Launcher.ts

@@ -1,4 +1,4 @@
-import { html, LitElement, TemplateResult, css } from "lit";
+import { html, LitElement, PropertyValues, TemplateResult, css } from "lit";
 import { customElement, property, state } from "lit/decorators.js";
 import { createRef, ref, Ref } from "lit/directives/ref.js";
 import { launcherStyles } from "./launcherStyles";
@@ -65,6 +65,9 @@ export class Launcher extends LitElement {
   @property({ type: Boolean })
   isFirstMount = false;
 
+  @property({ attribute: false })
+  openSSTWindowOnLoad = false;
+
   @property({ attribute: false })
   autoOpenChatWidget = false;
 
@@ -283,6 +286,15 @@ export class Launcher extends LitElement {
   tourSchedulerRef: Ref<TourScheduler> = createRef();
   calculatorWindowRef: Ref<FeeCalculator> = createRef();
 
+  willUpdate(changedProperties: PropertyValues<this>): void {
+    if (
+      changedProperties.has("openSSTWindowOnLoad") &&
+      this.openSSTWindowOnLoad
+    ) {
+      this.isSSTWindowOpen = true;
+    }
+  }
+
   updated = async (): Promise<void> => {
     this.attachOnClickToEmailUsWindow();
     this.attachOnClickToSSTWindow();

package/src/WebComponent/me-chat.ts

@@ -71,6 +71,10 @@ import {
 
 import "./chat-additional-actions";
 import { LeadSourceMultitouchClient } from "./LeadSourceMultitouchClient";
+import {
+  shouldOpenTourSchedulerFromUrl,
+  storeGoogleReserveReferral,
+} from "../googleReserve";
 
 @customElement("me-chat")
 export class MEChat extends LitElement {
@@ -187,6 +191,9 @@ export class MEChat extends LitElement {
   @state()
   private showTourNextToChat = false;
 
+  @state()
+  private openTourSchedulerOnLoad = false;
+
   @state()
   private displayPubnubChat = false;
 
@@ -321,19 +328,24 @@ export class MEChat extends LitElement {
 
     this.attachOnClickToLauncher();
 
-    if (this.shouldAutoOpenChat(this.webchatConfigHasAutoOpenChat)) {
+    storeGoogleReserveReferral(this.buildingWebchatView?.id ?? 0);
+
+    if (
+      shouldOpenTourSchedulerFromUrl() &&
+      (this.enabledChatWidgets.sstDesktop || this.enabledChatWidgets.sstMobile)
+    ) {
+      this.openTourSchedulerOnLoad = true;
+    } else if (this.shouldAutoOpenChat(this.webchatConfigHasAutoOpenChat)) {
       this.displayPubnubChat = true;
       this.hideLauncher = true;
       this.hasMounted = true;
       this.updateAlreadyAutoOpenedTimestamp();
-    }
-
-    this.isLoading = false;
-
-    if (localStorage.getItem("isChatOpen") === "true") {
+    } else if (localStorage.getItem("isChatOpen") === "true") {
       this.hideLauncher = true;
       this.displayPubnubChat = true;
     }
+
+    this.isLoading = false;
   };
 
   // The general info for the buildingg
@@ -1080,6 +1092,7 @@ export class MEChat extends LitElement {
                   virtualToursTypeOffered="${this.buildingWebchatView
                     .virtualToursTypeOffered ?? ""}"
                   .showTourNextToChat="${this.showTourNextToChat ?? ""}"
+                  .openSSTWindowOnLoad=${this.openTourSchedulerOnLoad}
                   @closeShowTourNextToChat=${() => {
                     this.showTourNextToChat = false;
                     this.hideLauncher = true;

package/src/googleReserve.test.ts

@@ -0,0 +1,60 @@
+import { expect } from "@esm-bundle/chai";
+import {
+  readGoogleReserveReferral,
+  shouldOpenTourSchedulerFromUrl,
+  storeGoogleReserveReferral,
+} from "./googleReserve";
+
+const STORAGE_KEY = "com.eliseai.webchat.googlereserve.referral";
+
+const visit = (search: string): void =>
+  history.replaceState(null, "", `${location.pathname}${search}`);
+
+describe("Google Reserve", () => {
+  const originalSearch = location.search;
+
+  beforeEach(() => {
+    localStorage.removeItem(STORAGE_KEY);
+  });
+
+  afterEach(() => {
+    localStorage.removeItem(STORAGE_KEY);
+    visit(originalSearch);
+  });
+
+  it("remembers a click from a Google listing, keeping the token intact", () => {
+    visit("?elise_open=tour&rwg_token=AFd1x%3D%3D");
+    storeGoogleReserveReferral(7);
+    visit("");
+
+    expect(readGoogleReserveReferral()).to.include({
+      rwgToken: "AFd1x==",
+      buildingId: 7,
+    });
+  });
+
+  it("has no referral without a token or once it has expired", () => {
+    visit("?utm_source=website");
+    storeGoogleReserveReferral(7);
+    expect(readGoogleReserveReferral()).to.equal(null);
+
+    localStorage.setItem(
+      STORAGE_KEY,
+      JSON.stringify({
+        rwgToken: "AFd1x==",
+        buildingId: 7,
+        expiresAt: Date.now() - 1,
+      })
+    );
+    expect(readGoogleReserveReferral()).to.equal(null);
+  });
+
+  it("opens the tour scheduler only when the URL asks for it", () => {
+    visit("?elise_open=tour");
+    expect(shouldOpenTourSchedulerFromUrl()).to.equal(true);
+    visit("?elise_open=chat");
+    expect(shouldOpenTourSchedulerFromUrl()).to.equal(false);
+    visit("");
+    expect(shouldOpenTourSchedulerFromUrl()).to.equal(false);
+  });
+});

package/src/googleReserve.ts

@@ -0,0 +1,48 @@
+// Google requires the referral token kept for 30 days after the click.
+const REFERRAL_TTL_MS = 30 * 24 * 60 * 60 * 1000;
+const REFERRAL_STORAGE_KEY = "com.eliseai.webchat.googlereserve.referral";
+// Google "Book" links to a customer's page add this so the widget opens the tour scheduler.
+const OPEN_PARAM = "elise_open";
+
+type GoogleReserveReferral = {
+  rwgToken: string;
+  buildingId: number;
+  expiresAt: number;
+};
+
+export const shouldOpenTourSchedulerFromUrl = (): boolean =>
+  new URLSearchParams(window.location.search).get(OPEN_PARAM) === "tour";
+
+/**
+ * Remembers a click from a building's Google listing, which arrives with an
+ * `rwg_token` query param, so a booking within 30 days can be reported back.
+ */
+export const storeGoogleReserveReferral = (buildingId: number): void => {
+  const rwgToken = new URLSearchParams(window.location.search).get("rwg_token");
+  if (!rwgToken || !buildingId) {
+    return;
+  }
+  const referral: GoogleReserveReferral = {
+    rwgToken,
+    buildingId,
+    expiresAt: Date.now() + REFERRAL_TTL_MS,
+  };
+  localStorage.setItem(REFERRAL_STORAGE_KEY, JSON.stringify(referral));
+};
+
+/**
+ * The visitor's click from a building's Google listing within the last 30 days,
+ * sent with a booking so the backend can report it to Google.
+ */
+export const readGoogleReserveReferral = (): GoogleReserveReferral | null => {
+  try {
+    const referral: GoogleReserveReferral | null = JSON.parse(
+      localStorage.getItem(REFERRAL_STORAGE_KEY) ?? "null"
+    );
+    return referral?.rwgToken && Date.now() < referral.expiresAt
+      ? referral
+      : null;
+  } catch {
+    return null;
+  }
+};