@meetelise/chat 1.35.0 → 1.35.2

package/src/analytics.ts

@@ -0,0 +1,217 @@
+import axios from "axios";
+import { getCookieValue } from "./utils";
+
+declare global {
+  interface Window {
+    RCTPCampaign?: { CampaignDetails: { Source: string } };
+  }
+}
+
+export interface CampaignSources {
+  entrataCampaignSource: string | null;
+  yardiCampaignSource: string | null;
+  realpageCampaignSource: string | null;
+  utmCampaignSource: string | null;
+  bozzutoAdSource: string | null;
+}
+
+/**
+ * A connection to the MeetElise API to send analytics events
+ */
+export default class Analytics {
+  private org: string;
+  private building: string;
+  private featureFlags?: Record<string, boolean>;
+  public chatId: string;
+  private incomingProcessedLeadSource: string | null;
+
+  constructor(
+    org: string,
+    building: string,
+    chatId: string,
+    incomingProcessedLeadSource: string | null
+  ) {
+    this.org = org;
+    this.building = building;
+    this.chatId = chatId;
+    this.incomingProcessedLeadSource = incomingProcessedLeadSource;
+    this.featureFlags = {};
+  }
+
+  /**
+   * Store feature flag value(s) on the Analytics object to be sent with future pings. If `featureFlags` object is already present, the argument is merged into it.
+   */
+  setFeatureFlags(featureFlags: Record<string, boolean>): void {
+    this.featureFlags = {
+      ...this.featureFlags,
+      ...featureFlags,
+    };
+  }
+
+  /**
+   * Send an event. Takes one argument, the event type name.
+   */
+  ping(eventType: string): void {
+    fetch(
+      "https://app.meetelise.com/platformApi/connectors/talk_js/analytics",
+      {
+        method: "POST",
+        credentials: "omit", // Necessary for successful CORS
+        keepalive: true, // Analytics should not abort after browser close
+        headers: { "content-type": "application/json; charset=UTF-8" },
+        body: JSON.stringify({
+          eventType,
+          chatId: this.chatId,
+          url: location.href,
+          org: this.org,
+          building: this.building,
+          referrer: document.referrer,
+          featureFlags: this.featureFlags,
+          campaignSources: getCampaignSources(),
+          incomingProcessedLeadSource: this.incomingProcessedLeadSource, // if we already know the lead source, send it along
+          webchatVersion: process.env.npm_package_version ?? "1.20.155",
+        }),
+      }
+    );
+  }
+}
+
+export const getCampaignSources = (): CampaignSources => {
+  try {
+    const queryParams = new URL(window.location.href).searchParams;
+    const yardiCampaignSource =
+      window.RCTPCampaign?.CampaignDetails?.Source ?? null;
+    const entrataCampaignSource = queryParams.get("switch_cls[id]");
+    const realpageCampaignSource = queryParams.get("ilm");
+    const utmCampaignSource = queryParams.get("utm_source");
+    const bozzutoAdSource = getCookieValue("bozzuto_ad_source");
+
+    return {
+      entrataCampaignSource,
+      realpageCampaignSource,
+      utmCampaignSource,
+      yardiCampaignSource,
+      bozzutoAdSource,
+    };
+  } catch (e) {
+    /**
+     * Some clients have pages that overwrite the `URL` class and turn it into a string. This is a workaround for that.
+     * Example site: https://ther3.com
+     */
+    // eslint-disable-next-line no-console
+    console.warn(`Couldnt get campaign sources from url, error: ${e}`);
+    const iframe = document.createElement("iframe");
+    iframe.style.display = "none";
+    document.body.appendChild(iframe);
+    if (!iframe.contentWindow) {
+      return {
+        entrataCampaignSource: null,
+        realpageCampaignSource: null,
+        utmCampaignSource: null,
+        yardiCampaignSource: null,
+        bozzutoAdSource: null,
+      };
+    }
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const OriginalURL = (iframe.contentWindow as any).URL;
+    if (!OriginalURL) {
+      return {
+        entrataCampaignSource: null,
+        realpageCampaignSource: null,
+        utmCampaignSource: null,
+        yardiCampaignSource: null,
+        bozzutoAdSource: null,
+      };
+    }
+    const queryParams = new OriginalURL(window.location.href).searchParams;
+    const yardiCampaignSource =
+      window.RCTPCampaign?.CampaignDetails?.Source ?? null;
+    const entrataCampaignSource = queryParams.get("switch_cls[id]");
+    const realpageCampaignSource = queryParams.get("ilm");
+    const utmCampaignSource = queryParams.get("utm_source");
+    const bozzutoAdSource = getCookieValue("bozzuto_ad_source");
+
+    return {
+      entrataCampaignSource,
+      realpageCampaignSource,
+      utmCampaignSource,
+      yardiCampaignSource,
+      bozzutoAdSource,
+    };
+  }
+};
+
+export enum LogType {
+  error = "error",
+  info = "info",
+  warn = "warn",
+}
+
+export const sendLoggingEvent = async ({
+  logType,
+  buildingSlug,
+  orgSlug,
+  logTitle,
+  logData,
+}: {
+  logType?: LogType;
+  buildingSlug?: string;
+  orgSlug?: string;
+  logTitle: string;
+  logData: Record<string, unknown> | null;
+}): Promise<void> => {
+  const host = "https://app.meetelise.com";
+  await axios.post(
+    `${host}/platformApi/webchat/logging`,
+    {
+      ...logData,
+    },
+    {
+      headers: {
+        "Content-Type": "application/json",
+        "building-slug": buildingSlug ?? "",
+        "org-slug": orgSlug ?? "",
+        "log-type": logType ?? LogType.error,
+        "log-title": logTitle.toUpperCase().replace(/\s/g, "_"),
+      },
+    }
+  );
+};
+
+interface SignalLoggerProps {
+  org_slug: string;
+  building_slug: string;
+  chat_id?: string | null;
+  is_pixel_on_site?: boolean | null;
+  is_any_webchat_showing?: boolean | null;
+  is_form_override_success?: boolean | null;
+  is_dni_insert_override_success?: boolean | null;
+  is_application_link_replacement_success?: boolean | null;
+  extra_data?: Record<string, unknown> | null;
+}
+
+export const logSignal = async ({
+  params,
+  sampleRate,
+}: {
+  params: SignalLoggerProps;
+  sampleRate: number; // 0.05 is 5%
+}): Promise<void> => {
+  try {
+    if (Math.random() >= sampleRate) {
+      return;
+    }
+    await axios.post(
+      `https://app.meetelise.com/platformApi/webchat/log/signal`,
+      {
+        ...params,
+        website_origin: window.location.origin,
+        website_search: window.location.search,
+      }
+    );
+  } catch (error) {
+    // eslint-disable-next-line no-console
+    console.warn(error);
+  }
+};

package/src/assetUrls.ts

@@ -0,0 +1,6 @@
+export const glowBarMp4 =
+  "https://eliseusercontent.meetelise.com/webchat/HorizontalBar-Shadow.mp4";
+export const glowBarWebm =
+  "https://eliseusercontent.meetelise.com/webchat/HorizontalBar-Shadow.webm";
+export const glowBackgroundMp4 =
+  "https://eliseusercontent.meetelise.com/webchat/01-EliseAI-Hero_1.mp4";

package/src/disclaimers.ts

@@ -0,0 +1,301 @@
+import { html, TemplateResult } from "lit";
+import { styleMap } from "lit/directives/style-map.js";
+import { CheckboxEmpty } from "./svgIcons";
+import { HeyThereEmoji } from "./WebComponent/icons/HeyThereEmojiIcon";
+
+const disclaimerStyles = {
+  container: {
+    fontSize: "10px",
+    paddingTop: "4px",
+  },
+  link: {
+    color: "#4287f5",
+  },
+};
+
+export const CURRENT_CONSENT_ID = "currentConsentId";
+
+const formDisclaimer = ({
+  phoneNumberInput,
+  emailInput,
+  orgLegalName,
+  orgSlug,
+}: {
+  buildingName: string;
+  phoneNumberInput?: string;
+  emailInput?: string;
+  orgLegalName: string;
+  orgSlug: string;
+}): TemplateResult => {
+  if (phoneNumberInput && orgSlug === "greystar") {
+    return html`<div style=${styleMap(disclaimerStyles.container)}>
+      By providing your phone number and clicking send, you consent to receive
+      recurring marketing calls and voice and text messages from Greystar or on
+      its behalf at this number using artificial voice and/or an autodialer.
+      Messages may be AI or human-generated. Your phone number and
+      communications are shared with and recorded and used by EliseAI. You are
+      not required to provide your phone number or consent to these terms to
+      lease at this property. Msg & Data rates may apply. You consent to
+      <a
+        style=${styleMap(disclaimerStyles.link)}
+        href="https://www.greystar.com/privacy"
+        target="_blank"
+        rel="noopener noreferrer"
+        >Greystar’s Global Privacy Policy</a
+      >
+      and
+      <a
+        style=${styleMap(disclaimerStyles.link)}
+        href="http://bit.ly/me_privacy_policy"
+        target="_blank"
+        rel="noopener noreferrer"
+        >EliseAI’s Privacy Policy</a
+      >.
+    </div>`;
+  }
+  if (phoneNumberInput) {
+    return html` <div style=${styleMap(disclaimerStyles.container)}>
+      By providing your number and clicking send, you consent to receive
+      recurring marketing calls and voice and text messages from or on behalf of
+      ${orgLegalName} at this number using artificial voice or an autodialer
+      system. Messages may be AI or human generated. This consent is not
+      required to lease at this property. Msg & Data rates may apply. You
+      consent to this
+      <a
+        style=${styleMap(disclaimerStyles.link)}
+        href="http://bit.ly/me_privacy_policy"
+        target="_blank"
+        rel="noopener noreferrer"
+        >privacy policy</a
+      >, including having your number and communications recorded and used by a
+      third party.
+    </div>`;
+  }
+  if (emailInput) {
+    return html` <div style=${styleMap(disclaimerStyles.container)}>
+      By entering your email and clicking submit, you consent to this
+      <a
+        style=${styleMap(disclaimerStyles.link)}
+        href="http://bit.ly/me_privacy_policy"
+        target="_blank"
+        rel="noopener noreferrer"
+        >privacy policy</a
+      >, including having your email address and communications collected and
+      recorded and used by a third party.
+    </div>`;
+  }
+  return html``;
+};
+
+export const getConsentPreChatDisclaimer = (
+  orgSlug: string | null,
+  privacyPolicyUrl: string,
+  consentKey: string,
+  changeConsent: (hasConsent: boolean) => void
+): TemplateResult => {
+  if (orgSlug === "avb" && !localStorage.getItem(consentKey ?? "")) {
+    return html`
+      <div class="legal-confirmation-inner-container">
+        <div>${HeyThereEmoji()}</div>
+        <div>
+          <span style="font-weight: 600">Confirm to continue</span>
+          <p>
+            By using this feature you accept our
+            <a
+              href="https://www.avaloncommunities.com/terms-of-use"
+              target="_blank"
+              rel="noopener noreferrer"
+              class="privacy-policy-link"
+              >Terms</a
+            >,
+            <a
+              href="https://www.avaloncommunities.com/privacy-policy"
+              target="_blank"
+              rel="noopener noreferrer"
+              class="privacy-policy-link"
+              >Privacy Policy</a
+            >,
+            <a
+              href="https://www.avaloncommunities.com/us-state-privacy-notice"
+              target="_blank"
+              rel="noopener noreferrer"
+              class="privacy-policy-link"
+              >U.S. State Privacy Notice</a
+            >, and that chats may use automated or AI responses from a bot and
+            may be recorded and used by us and our vendors.
+          </p>
+        </div>
+
+        <button
+          class="agreeButton"
+          @click=${() => {
+            changeConsent(true);
+            const consentData = {
+              consentGiven: true,
+              timestamp: new Date().getTime(),
+              consentId: CURRENT_CONSENT_ID,
+            };
+            localStorage.setItem(consentKey ?? "", JSON.stringify(consentData));
+          }}
+        >
+          I agree
+        </button>
+      </div>
+    `;
+  }
+  if (orgSlug === "mill-creek") {
+    return html`<div class="legal-confirmation-inner-container">
+      <div>${HeyThereEmoji()}</div>
+      <div>
+        <span style="font-weight: 600">Confirm to continue</span>
+        <p>
+          Hello! I'm your virtual assistant, Milly, and I am here to help you
+          today. Before I can answer any questions, it is important that you
+          know I am a third-party bot, and I will be collecting our
+          communications and other information you provide, consistent with our
+          privacy policy.
+        </p>
+        <div class="confirmation-with-checkbox">
+          <div
+            class="checkbox"
+            @click=${() => {
+              changeConsent(true);
+            }}
+          >
+            ${CheckboxEmpty}
+          </div>
+          <p>
+            I agree to the
+            <a
+              href=${privacyPolicyUrl}
+              target="_blank"
+              rel="noopener noreferrer"
+              class="privacy-policy-link"
+            >
+              privacy policy</a
+            >
+            and terms and conditions, Let's go!
+          </p>
+        </div>
+      </div>
+    </div>`;
+  }
+  return html` <div class="legal-confirmation-inner-container">
+    <div>${HeyThereEmoji()}</div>
+    <div>
+      <span style="font-weight: 600">Confirm to continue</span>
+      <p>
+        Hello, before I can answer questions for you, it's important that I let
+        you know that I am a third-party AI Assistant that will collect our
+        conversation and other information you provide, consistent with our
+        <a
+          href=${privacyPolicyUrl}
+          target="_blank"
+          rel="noopener noreferrer"
+          class="privacy-policy-link"
+        >
+          privacy policy</a
+        >.
+      </p>
+    </div>
+
+    <button
+      class="agreeButton"
+      @click=${() => {
+        changeConsent(true);
+      }}
+    >
+      I agree
+    </button>
+  </div>`;
+};
+
+export const inChatThreadDisclaimer = ({
+  orgSlug,
+  buildingState,
+  type,
+}: {
+  orgSlug: string;
+  buildingState: string | null;
+  type: "healthcare" | "utilities" | "leasing";
+}): TemplateResult => {
+  if (type === "utilities") {
+    return html` <p class="utilities-disclaimer-inner">
+      By interacting with this system, you consent to
+      <a
+        href="http://bit.ly/me_privacy_policy"
+        target="_blank"
+        rel="noopener noreferrer"
+      >
+        this privacy policy</a
+      >
+      , including being contacted by AI or a human & having your conversation
+      recorded and used by a third party.
+    </p>`;
+  }
+  if (type === "healthcare") {
+    return html`
+      <p class="healthcare-disclaimer-inner">
+        By interacting with this system, you consent to
+        <a
+          href="http://bit.ly/me_privacy_policy"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          this privacy policy
+        </a>
+        , including being contacted by AI or a human & having your conversation
+        recorded and used by a third party.
+      </p>
+    `;
+  }
+  if (type === "leasing") {
+    if (orgSlug === "avb") {
+      return html`
+        <li class="message-container disclaimer-message">
+          <p class="disclaimer-inner">
+            Chats may be recorded by us and our vendors.
+          </p>
+        </li>
+      `;
+    }
+    if (buildingState && buildingState.toUpperCase() === "UT") {
+      return html`
+        <li class="message-container disclaimer-message">
+          <p class="disclaimer-inner">
+            By interacting with this system, you consent to
+            <a
+              href="http://bit.ly/me_privacy_policy"
+              target="_blank"
+              rel="noopener noreferrer"
+            >
+              this privacy policy
+            </a>
+            and to interacting with generative AI or a human & having your
+            conversation recorded and used by a third party.
+          </p>
+        </li>
+      `;
+    }
+
+    return html`
+      <li class="message-container disclaimer-message">
+        <p class="disclaimer-inner">
+          By interacting with this system, you consent to
+          <a
+            href="http://bit.ly/me_privacy_policy"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            this privacy policy
+          </a>
+          , including being contacted by AI or a human & having your
+          conversation recorded and used by a third party.
+        </p>
+      </li>
+    `;
+  }
+  return html``;
+};
+
+export default formDisclaimer;

package/src/fetchBuildingABTestType.ts

@@ -0,0 +1,21 @@
+import axios from "axios";
+interface BuildingABType {
+  abTestType: string;
+}
+export enum abTestTypes {
+  "ConceptEmoji" = "Concept 2 (Blue/White)",
+}
+export default async function fetchBuildingABTestType(
+  buildingSlug: string
+): Promise<BuildingABType | null> {
+  const host = "https://app.meetelise.com";
+  try {
+    const abTestTypeResponse = await axios.get(
+      `${host}/platformApi/webchat/${buildingSlug}/ab-test-type`
+    );
+    //return { abTestType: "Concept 2 (Blue/White)" };
+    return abTestTypeResponse.data;
+  } catch (_) {
+    return null;
+  }
+}

package/src/fetchBuildingInfo.ts

@@ -0,0 +1,88 @@
+import axios from "axios";
+
+export interface LabeledOption {
+  label: string;
+  value: string | number;
+}
+
+/**
+ * @deprecated Use BuildingWebchatView instead.
+ * The response from the API.
+ */
+export interface Building {
+  id: number;
+  themeId: string;
+  avatarSrc: string | null;
+  avatarType: "image" | "initials" | null;
+  chatSubtitle: string | null;
+  chatTitle: string | null;
+  name: string;
+  userFirstName: string;
+  userId: number;
+  welcomeMessage: string | null;
+  systemWelcomeMessage: string | null;
+  launchedDateTime: string | null;
+  orgId: number;
+  phoneNumber: string;
+  tourTypeOptions: LabeledOption[];
+  chatWidgets?: string[] | null;
+  chatCallUsHeader?: string;
+  autoOpenChatWidget: boolean;
+  sgtUrl: string;
+  escortedToursLink: string;
+  virtualToursLink: string;
+  active: number;
+  usesDynamicScheduling: boolean;
+  textWithUsPhoneNumber: string | null;
+  orgLegalName: string;
+  webchatScopeConfigured: boolean;
+  virtualTourEnabled: boolean;
+  escortedTourEnabled: boolean;
+  selfGuidedTourEnabled: boolean;
+  escortedToursTypeOffered: string;
+  virtualToursTypeOffered: string;
+  selfGuidedToursTypeOffered: string;
+  state: string | null;
+}
+
+export type UnitV2 = {
+  name: string;
+  layout: string;
+  availabilityStage: number;
+  active: number;
+  occupied: boolean;
+};
+
+/**
+ * Load the publicly-available info for a building.
+ * @deprecated Use fetchBuildingAndConfig instead.
+ * @param orgSlug - The org slug, e.g. "big-prop-co"
+ * @param buildingSlug - The buidling slug, e.g. "gravity-falls"
+ * @returns The building's ID, name, theme, and agent.
+ */
+export default async function fetchBuildingInfo(
+  orgSlug: string,
+  buildingSlug: string
+): Promise<Building> {
+  const host = "https://app.meetelise.com";
+  const buildingUrl = `${host}/api/pub/v1/organization/${orgSlug}/building/${buildingSlug}`;
+
+  const buildingResponse = await axios.get(buildingUrl);
+
+  const building: Building = buildingResponse.data;
+  try {
+    building.welcomeMessage = replaceName(
+      building.welcomeMessage ?? "",
+      building.userFirstName
+    );
+  } catch (e) {
+    // eslint-disable-next-line no-console
+    console.error(e);
+  }
+  return building;
+}
+
+const replaceName = (originalText: string, newName: string) => {
+  const regex = /elise/gi;
+  return originalText.replace(regex, newName);
+};