@meetelise/chat 1.20.135 → 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

@@ -40,6 +40,11 @@ import "./actions/minimize-expand-button";
 import "./launcher/mobile-launcher";
 import "./pubnub-chat";
 import { getBuildingPhoneNumber } from "../getBuildingPhoneNumber";
+import {
+  clearChatStorageKey,
+  getChatStorageKey,
+  isChatKeyValid,
+} from "../handleChatIds";
 
 @customElement("me-chat")
 export class MEChat extends LitElement {
@@ -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/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,
+  };
+};