@meetelise/chat 1.43.41 → 1.44.0

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

@@ -29,6 +29,7 @@ import { DatePicker } from "./date-picker";
 import { MESelect } from "../me-select";
 import { TimePicker } from "./time-picker";
 import { LabeledOption } from "../../fetchBuildingInfo";
+import { LayoutOption } from "../../fetchBuildingWebchatView";
 import {
   isMobile,
   isValidEmail,
@@ -79,6 +80,8 @@ export class TourScheduler extends LitElement {
 
   @property({ attribute: false })
   tourTypeOptions: LabeledOption[] = [];
+  @property({ attribute: false })
+  layoutOptions: LayoutOption[] = [];
   @property({ attribute: true })
   chatId = "";
   @property({ type: Number })
@@ -191,6 +194,8 @@ export class TourScheduler extends LitElement {
   phoneInput!: HTMLInputElement;
   @query("me-select#leadSource")
   selectedLeadSource!: MESelect;
+  @query("me-select#layout")
+  selectedLayoutEl?: MESelect;
 
   @state()
   firstNameInputValue = "";
@@ -198,6 +203,8 @@ export class TourScheduler extends LitElement {
   lastNameInputValue = "";
   @state()
   leadSourceInputValue = "";
+  @state()
+  selectedLayoutValue = "";
 
   @state()
   errorGettingAvailabilities = false;
@@ -643,6 +650,8 @@ export class TourScheduler extends LitElement {
       this.lastNameInputValue = this.lastNameInput.value;
     }
     this.leadSourceInputValue = parsedLeadSource;
+    const selectedLayout =
+      this.selectedLayoutEl?.value || this.selectedLayoutValue || null;
     pushGtmEvent("scheduleTourSubmitted", {
       email: this.email,
       phone: `+1${this.phoneNumber.match(/\d/g)?.join("")}`,
@@ -652,6 +661,7 @@ export class TourScheduler extends LitElement {
       tourTime: `${this.selectedTime.datetime}${this.selectedTime.offset}`,
       originatingSource:
         leadSources.find((i) => i !== "property-website") || null,
+      layout: selectedLayout,
     });
     const data = {
       referrer: document.referrer,
@@ -672,6 +682,7 @@ export class TourScheduler extends LitElement {
       ],
       query_params: Object.fromEntries(queryParams.entries()),
       conversation_tracking_id: this.leadSourceClient?.chatId,
+      layouts: selectedLayout ? [selectedLayout] : undefined,
       lead_sources_with_timestamps: (
         this.leadSourceMultitouchClient?.getSafeLeadSourceTouchpointsWithDefault(
           {
@@ -1225,6 +1236,27 @@ export class TourScheduler extends LitElement {
             ? html`<p class="error-message">Invalid phone number</p>`
             : ""}
         </div>
+        ${this.layoutOptions.length > 0
+          ? html` <me-select
+              id="layout"
+              placeholder="Bedroom preference (optional)"
+              .options="${this.layoutOptions.map((o) => ({
+                label: o.label,
+                value: layoutValueToCanonical(o.value),
+              }))}"
+              @change=${() => {
+                const v = this.selectedLayoutEl?.value || "";
+                this.selectedLayoutValue = v;
+                if (v) {
+                  pushGtmEvent("tourLayoutSelected", {
+                    layout: v,
+                    buildingId: this.buildingId,
+                  });
+                }
+              }}
+            >
+            </me-select>`
+          : ""}
         ${this.leadSources.length > 0 &&
         (this.featureFlagShowDropdown === FeatureFlagsShowDropdown.always ||
           (this.featureFlagShowDropdown ===
@@ -1678,3 +1710,9 @@ const tourTypeForSubmission = {
   [TourType.Self]: "self-guided-tour",
   [TourType.Virtual]: "live-virtual-tour",
 };
+
+// LayoutOption.value is bedrooms * 10; EliseAI classifier expects `studio` / `Nbr`.
+function layoutValueToCanonical(value: number): string {
+  const bedrooms = Math.round(value / 10);
+  return bedrooms === 0 ? "studio" : `${bedrooms}br`;
+}

package/src/WebComponent/launcher/Launcher.ts

@@ -21,7 +21,7 @@ import {
 } from "../../themes";
 import "./mobile-launcher";
 import "../actions/collapse-expand-button";
-import { DesignConcepts } from "../../fetchBuildingWebchatView";
+import { DesignConcepts, LayoutOption } from "../../fetchBuildingWebchatView";
 import { isMobile, onMobileChange } from "../../utils";
 import classNames from "classnames";
 import LeadSourceClient from "../LeadSourceClient";
@@ -141,6 +141,9 @@ export class Launcher extends LitElement {
 
   @property({ attribute: false })
   tourTypeOptions: LabeledOption[] = [];
+
+  @property({ attribute: false })
+  layoutOptions: LayoutOption[] = [];
   @property({ attribute: true })
   hasDynamicSchedulingEnabled = false;
 
@@ -1299,6 +1302,7 @@ export class Launcher extends LitElement {
                 .hasDynamicSchedulingEnabled=${this.hasDynamicSchedulingEnabled}
                 .leadSources="${this.leadSources}"
                 .tourTypeOptions=${this.tourTypeOptions}
+                .layoutOptions=${this.layoutOptions}
                 .orgLegalName=${this.orgLegalName}
                 buildingId=${this.buildingId}
                 featureFlagShowDropdown="${this.featureFlagShowDropdown}"

package/src/WebComponent/me-chat.ts

@@ -59,6 +59,7 @@ import { updateRentgrataToken } from "../rentgrata";
 import { WidgetType } from "../main/MEChat";
 import { logCdnVersion } from "../logCdnVersion";
 import { replaceSelectButtonsWithNewLink } from "../replaceSelectButtonsWithNewLink";
+import { replaceOutdatedApplicationLinks } from "../replaceOutdatedApplicationLinks";
 import {
   overwriteCheckAvail,
   shouldOverwriteCheckAvail,
@@ -524,7 +525,7 @@ export class MEChat extends LitElement {
       this.buildingWebchatView?.isLiveOnApplications
     ) {
       const totalReplacements = replaceSelectButtonsWithNewLink(
-        `https://applications.eliseai.com/building/${this.buildingSlug}`,
+        `https://applications.eliseai.com/building/${this.buildingSlug}/units`,
         this.orgSlug,
         this.buildingSlug
       );
@@ -543,6 +544,15 @@ export class MEChat extends LitElement {
       }
     }
 
+    if (this.buildingSlug && this.orgSlug) {
+      try {
+        replaceOutdatedApplicationLinks(this.buildingSlug);
+      } catch {
+        // eslint-disable-next-line no-console
+        console.warn("Error replacing outdated application links");
+      }
+    }
+
     if (
       this.buildingSlug &&
       !!this.buildingWebchatView?.isLiveOnApplications &&
@@ -995,6 +1005,8 @@ export class MEChat extends LitElement {
                   .orgLegalName=${this.buildingWebchatView?.orgLegalName ?? ""}
                   .tourTypeOptions=${this.buildingWebchatView
                     ?.tourTypeOptions ?? []}
+                  .layoutOptions=${this.buildingWebchatView?.layoutOptions ??
+                  []}
                   .launcherStyles=${this.launcherStyles}
                   .primaryColor=${this.primaryColor}
                   .backgroundColor=${this.backgroundColor}

package/src/replaceOutdatedApplicationLinks.ts

@@ -0,0 +1,57 @@
+/**
+ * Some property websites embed hard-coded `applications.eliseai.com/building/<slug>/units`
+ * links whose slug has since been re-keyed in the backend. When the widget loads for the
+ * new slug, find those links on the host page and rewrite the slug to the current one,
+ * preserving query strings/hashes.
+ */
+
+// Keys: current/correct building slug.
+// Values: outdated slug that may still appear in URLs on the host page.
+export const OUTDATED_APPLICATION_BUILDING_SLUGS: Record<string, string> = {
+  "95ae958e-95db-11ed-9862-6f4db5533d3f":
+    "8008db60-45b7-11f1-88ac-635f686365da",
+  "95ae96b0-95db-11ed-9863-a7aa664fd985":
+    "72ed27c4-45b7-11f1-82d9-37b7db547687",
+};
+
+const APPLICATIONS_HOST = "https://applications.eliseai.com";
+
+export const replaceOutdatedApplicationLinks = (
+  currentBuildingSlug: string
+): number => {
+  const outdatedSlug = OUTDATED_APPLICATION_BUILDING_SLUGS[currentBuildingSlug];
+  if (!outdatedSlug) return 0;
+
+  const outdatedBase = `${APPLICATIONS_HOST}/building/${outdatedSlug}/units`;
+  const newBase = `${APPLICATIONS_HOST}/building/${currentBuildingSlug}/units`;
+  const pattern = new RegExp(
+    `https://applications\\.eliseai\\.com/building/${outdatedSlug}/units`,
+    "g"
+  );
+
+  let totalReplacements = 0;
+
+  const anchors = document.body.getElementsByTagName("a");
+  for (let i = 0; i < anchors.length; i++) {
+    const a = anchors[i];
+    const href = a.getAttribute("href");
+    if (!href || !href.includes(outdatedBase)) continue;
+    const newHref = href.replace(pattern, newBase);
+    if (newHref === href) continue;
+    a.setAttribute("href", newHref);
+    totalReplacements++;
+  }
+
+  const onclickElements =
+    document.body.querySelectorAll<HTMLElement>("[onclick]");
+  onclickElements.forEach((el) => {
+    const onclick = el.getAttribute("onclick");
+    if (!onclick || !onclick.includes(outdatedBase)) return;
+    const newOnclick = onclick.replace(pattern, newBase);
+    if (newOnclick === onclick) return;
+    el.setAttribute("onclick", newOnclick);
+    totalReplacements++;
+  });
+
+  return totalReplacements;
+};