@meetelise/chat 1.20.134 → 1.20.136

package/src/MyPubnub.ts

@@ -3,14 +3,12 @@ import Pubnub, { ListenerParameters, MessageEvent } from "pubnub";
 
 import axios from "axios";
 import { Building } from "./fetchBuildingInfo";
-import parseISO from "date-fns/parseISO";
-import { v4 as uuid } from "uuid";
 import addHours from "date-fns/addHours";
 import isAfter from "date-fns/isAfter";
-import formatISO from "date-fns/formatISO";
-import isBefore from "date-fns/isBefore";
 import { LogType, sendLoggingEvent } from "./analytics";
 
+import { createChatStorageKey, getChatStorageKey } from "./handleChatIds";
+
 interface TokenResponse {
   auth: {
     result: {
@@ -40,7 +38,7 @@ export interface ChatMessage {
   timetoken: number;
 }
 
-interface ChatInfo {
+export interface ChatInfo {
   leadId: string | null;
   timestamp: Date | null;
   buildingSlug: string | null;
@@ -116,7 +114,7 @@ class MyPubnub {
   }
 
   async initializePubnub(): Promise<Pubnub | undefined> {
-    const storedChatKeyValues = this.getChatStorageKey();
+    const storedChatKeyValues = getChatStorageKey(true, this.buildingSlug);
     if (!storedChatKeyValues.leadId) {
       // eslint-disable-next-line no-console
       sendLoggingEvent({
@@ -145,9 +143,8 @@ class MyPubnub {
         addHours(new Date(), this.ttlHours)
       )
     ) {
-      this.createChatStorageKey(this.leadUserId);
+      createChatStorageKey(this.buildingSlug, this.leadUserId);
     }
-
     const pubnubToken = await this.fetchToken(this.leadUserId, this.channel);
     if (!pubnubToken) return;
 
@@ -382,80 +379,6 @@ class MyPubnub {
   isLeadMessage = (message: ChatMessage): boolean =>
     message.publisher.includes("lead_") &&
     message.message.customType === "lead_message";
-
-  clearChatStorageKey = (): void =>
-    localStorage.removeItem("com.eliseai.webchat.slug=" + this.buildingSlug);
-
-  createChatStorageKey = (existingUserId?: string): ChatInfo => {
-    const storageTimestamp = formatISO(new Date());
-    const leadUserId = existingUserId ?? `lead_${uuid()}_${this.buildingSlug}`;
-    localStorage.setItem(
-      "com.eliseai.webchat.slug=" + this.buildingSlug,
-      JSON.stringify({
-        buildingSlug: this.buildingSlug,
-        leadId: leadUserId,
-        timestamp: storageTimestamp,
-      })
-    );
-    return {
-      leadId: leadUserId,
-      timestamp: parseISO(storageTimestamp),
-      buildingSlug: this.buildingSlug,
-    };
-  };
-  getChatStorageKey = (createNewIfNotExist = true): ChatInfo => {
-    const eliseaiLocalStorageValue = localStorage.getItem(
-      "com.eliseai.webchat.slug=" + this.buildingSlug
-    );
-    if (eliseaiLocalStorageValue) {
-      try {
-        const eliseaiLocalStorageValueParsed = JSON.parse(
-          eliseaiLocalStorageValue
-        );
-        const lsBuildingSlug = eliseaiLocalStorageValueParsed.buildingSlug;
-        const lsLeadId = eliseaiLocalStorageValueParsed.leadId;
-        const lsExpiration = new Date(eliseaiLocalStorageValueParsed.timestamp);
-
-        if (
-          this.isChatKeyValid({
-            leadId: lsLeadId,
-            timestamp: lsExpiration,
-            buildingSlug: lsBuildingSlug,
-          })
-        )
-          return {
-            leadId: lsLeadId,
-            timestamp: lsExpiration,
-            buildingSlug: lsBuildingSlug,
-          };
-      } catch (_) {
-        // eslint-disable-next-line no-console
-        console.warn("Error getting chat storage key");
-      }
-    }
-
-    if (createNewIfNotExist) return this.createChatStorageKey();
-    return {
-      leadId: null,
-      timestamp: null,
-      buildingSlug: null,
-    };
-  };
-  isChatKeyValid = (storageValueDeconstructed: ChatInfo): boolean => {
-    if (
-      storageValueDeconstructed.buildingSlug !== this.buildingSlug ||
-      !storageValueDeconstructed.leadId ||
-      !storageValueDeconstructed.timestamp
-    ) {
-      return false;
-    }
-
-    const expirationDate = addHours(
-      storageValueDeconstructed.timestamp,
-      this.ttlHours
-    );
-    return !isBefore(expirationDate, Date.now());
-  };
 }
 
 export default MyPubnub;

package/src/WebComponent/me-chat.ts

@@ -39,7 +39,12 @@ import { insertDNIIntoWebsite } from "../insertDNIIntoWebsite";
 import "./actions/minimize-expand-button";
 import "./launcher/mobile-launcher";
 import "./pubnub-chat";
-import { getRegisteredPhoneNumbers } from "../getRegisteredPhoneNumbers";
+import { getBuildingPhoneNumber } from "../getBuildingPhoneNumber";
+import {
+  clearChatStorageKey,
+  getChatStorageKey,
+  isChatKeyValid,
+} from "../handleChatIds";
 
 @customElement("me-chat")
 export class MEChat extends LitElement {
@@ -210,7 +215,7 @@ export class MEChat extends LitElement {
     this.currentLeadSource = currentLeadSource;
     this.featureFlagShowDropdown = featureFlagShowDropdown;
 
-    const registeredPhoneNumbers = await getRegisteredPhoneNumbers(building.id);
+    const buildingPhoneNumber = await getBuildingPhoneNumber(this.buildingSlug);
 
     this.enabledChatWidgets = {
       call:
@@ -229,7 +234,7 @@ export class MEChat extends LitElement {
         (webchatSettings && !webchatSettings.isGlobalDefault
           ? webchatSettings.config.shouldShowText
           : this.building?.chatWidgets?.includes("SMS") ?? true) &&
-        registeredPhoneNumbers.length > 0,
+        !!buildingPhoneNumber,
       sst:
         webchatSettings && !webchatSettings.isGlobalDefault
           ? webchatSettings.config.shouldShowSst
@@ -316,7 +321,13 @@ export class MEChat extends LitElement {
       this.orgSlug,
       this.currentLeadSource
     );
-    if (this.myPubnub.isChatKeyValid(this.myPubnub.getChatStorageKey(false))) {
+    if (
+      // handle if we already have a valid session to open up to
+      isChatKeyValid(
+        getChatStorageKey(false, this.buildingSlug),
+        this.buildingSlug
+      )
+    ) {
       await this.myPubnub.initializePubnub();
     }
     this.attachOnClickToLauncher();
@@ -343,18 +354,22 @@ export class MEChat extends LitElement {
   };
 
   private async handleChatInitializeAnalytics(): Promise<void> {
+    // Although we may create the chat id here, we DO NOT create a channel here. We only create a channel when the user
+    // actually sends a message. This is to prevent unnecessary channels from being created.
     this.analytics = new Analytics(
       this.orgSlug,
       this.buildingSlug,
-      this.myPubnub?.channel ?? "", // this will be empty if the user does not have a current chat session.
+      `webchat_lead_${getChatStorageKey(true, this.buildingSlug).leadId}`, // important to get unique visitors to the website
       this.currentLeadSource
     );
+    // ping both the load and the heartbeat events for legacy support
+    this.analytics.ping("load");
     this.analytics.ping("webchat_heartbeat");
   }
 
   public async restartConversation(): Promise<void> {
     this.myPubnub?.handleDisconnect();
-    this.myPubnub?.clearChatStorageKey();
+    clearChatStorageKey(this.buildingSlug);
     this.myPubnub = null;
     this.displayPubnubChat = false;
     await this.initializeChatVariables();

package/src/getBuildingPhoneNumber.ts

@@ -0,0 +1,26 @@
+import axios from "axios";
+import { LogType, sendLoggingEvent } from "./analytics";
+
+export const getBuildingPhoneNumber = async (
+  buildingSlug: string
+): Promise<string | null> => {
+  try {
+    const host = "https://app.meetelise.com";
+    const webchatPreferencesResponse = await axios.get(
+      `${host}/platformApi/webchat/${buildingSlug}/phone-number`
+    );
+    if (webchatPreferencesResponse.data) {
+      return webchatPreferencesResponse.data;
+    }
+  } catch (error) {
+    sendLoggingEvent({
+      logType: LogType.error,
+      buildingSlug,
+      logTitle: "[ERROR_GETTING_PHONE_NUMBERS]",
+      logData: { error },
+    });
+
+    return null;
+  }
+  return null;
+};

package/src/handleChatIds.ts

@@ -0,0 +1,98 @@
+import isBefore from "date-fns/isBefore";
+import addHours from "date-fns/addHours";
+import { ChatInfo } from "./MyPubnub";
+
+import parseISO from "date-fns/parseISO";
+import { v4 as uuid } from "uuid";
+
+import formatISO from "date-fns/formatISO";
+
+export const ttlHoursChat = 24;
+
+export const isChatKeyValid = (
+  storageValueDeconstructed: ChatInfo,
+  buildingSlug: string
+): boolean => {
+  if (
+    storageValueDeconstructed.buildingSlug !== buildingSlug ||
+    !storageValueDeconstructed.leadId ||
+    !storageValueDeconstructed.timestamp
+  ) {
+    return false;
+  }
+
+  const expirationDate = addHours(
+    storageValueDeconstructed.timestamp,
+    ttlHoursChat
+  );
+  return !isBefore(expirationDate, Date.now());
+};
+
+export const getChatStorageKey = (
+  createNewIfNotExist = true,
+  buildingSlug: string
+): ChatInfo => {
+  const eliseaiLocalStorageValue = localStorage.getItem(
+    "com.eliseai.webchat.slug=" + buildingSlug
+  );
+  if (eliseaiLocalStorageValue) {
+    try {
+      const eliseaiLocalStorageValueParsed = JSON.parse(
+        eliseaiLocalStorageValue
+      );
+      const lsBuildingSlug = eliseaiLocalStorageValueParsed.buildingSlug;
+      const lsLeadId = eliseaiLocalStorageValueParsed.leadId;
+      const lsExpiration = new Date(eliseaiLocalStorageValueParsed.timestamp);
+
+      if (
+        isChatKeyValid(
+          {
+            leadId: lsLeadId,
+            timestamp: lsExpiration,
+            buildingSlug: lsBuildingSlug,
+          },
+          buildingSlug
+        )
+      )
+        return {
+          leadId: lsLeadId,
+          timestamp: lsExpiration,
+          buildingSlug: lsBuildingSlug,
+        };
+    } catch (_) {
+      // eslint-disable-next-line no-console
+      console.warn("Error getting chat storage key");
+    }
+  }
+
+  if (createNewIfNotExist) return createChatStorageKey(buildingSlug);
+  return {
+    leadId: null,
+    timestamp: null,
+    buildingSlug: null,
+  };
+};
+
+export const clearChatStorageKey = (buildingSlug: string): void =>
+  localStorage.removeItem("com.eliseai.webchat.slug=" + buildingSlug);
+
+export const createChatStorageKey = (
+  buildingSlug: string,
+  existingUserId?: string
+): ChatInfo => {
+  const storageTimestamp = formatISO(new Date());
+  const leadUserId = existingUserId ?? `lead_${uuid()}_${buildingSlug}`;
+  localStorage.setItem(
+    "com.eliseai.webchat.slug=" + buildingSlug,
+    JSON.stringify({
+      buildingSlug: buildingSlug,
+      leadId: leadUserId,
+      timestamp: storageTimestamp,
+    })
+  );
+  return {
+    leadId: leadUserId,
+    timestamp: parseISO(storageTimestamp),
+    buildingSlug: buildingSlug,
+  };
+};

package/src/getRegisteredPhoneNumbers.ts

@@ -1,66 +0,0 @@
-import axios from "axios";
-import { LogType, sendLoggingEvent } from "./analytics";
-
-export interface ManagementSmsNumber {
-  id: number;
-  userId: number;
-  timeCreated: string;
-  active: number;
-  phoneNumber: string;
-  phoneNumberType: string;
-  description: string;
-  api: string;
-  buildingIds: number[];
-  source: string;
-  deleted: number;
-  buildingGroupId: number;
-  ivrRecordLink: number;
-  ivrFlowType: number;
-  numberToForwardTo: string | null;
-  customTimeout: number;
-  customOptionsRecording: string | null;
-  customOptionsUrl: string | null;
-  voiceMailRecipient: string | null;
-  callCenterNumber: string | null;
-  initialPauseInSeconds: number;
-  voiceUrl: string;
-  alternativeBuildingId: string | null;
-  timezone: string | null;
-  buildingId: number;
-  ivrFlowConfiguration: {
-    flowName: string;
-    callCenterNumber: string;
-    leasingOfficeNumber: string;
-    marketingSourceCallCenterNumber: string | null;
-    globalCallCenterNumber: string | null;
-    buildingIntroMp3Url: string | null;
-    buildingOptionsMp3Url: string | null;
-    textYouShortlyMp3Url: string | null;
-  };
-  v2Number: boolean;
-}
-
-const registeredPhoneNumbersCache: {
-  [buildingId: number]: ManagementSmsNumber[];
-} = {};
-
-export const getRegisteredPhoneNumbers = async (
-  buildingId: number
-): Promise<ManagementSmsNumber[]> => {
-  if (registeredPhoneNumbersCache[buildingId]) {
-    return registeredPhoneNumbersCache[buildingId];
-  }
-  try {
-    const url = `https://app.meetelise.com/sms_management_numbers/webchat/building/${buildingId}/numbers`;
-    const result = await axios.get<ManagementSmsNumber[]>(url);
-    registeredPhoneNumbersCache[buildingId] = result.data;
-    return result.data;
-  } catch (error) {
-    sendLoggingEvent({
-      logTitle: "ERROR_LOADING_PHONE_NUMBERS",
-      logData: { error, buildingId },
-      logType: LogType.error,
-    });
-    return [];
-  }
-};