@meetelise/chat 1.20.84 → 1.20.86

package/public/dist/index.js.LICENSE.txt

@@ -10,6 +10,23 @@ object-assign
   http://jedwatson.github.io/classnames
 */
 
+/*! *****************************************************************************
+    Copyright (c) Microsoft Corporation.
+
+    Permission to use, copy, modify, and/or distribute this software for any
+    purpose with or without fee is hereby granted.
+
+    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+    PERFORMANCE OF THIS SOFTWARE.
+    ***************************************************************************** */
+
+/*! lil-uuid - v0.1 - MIT License - https://github.com/lil-js/uuid */
+
 /**
  * @license
  * Copyright 2017 Google LLC

package/src/MyPubnub.ts

@@ -0,0 +1,319 @@
+import { AxiosError } from "axios";
+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";
+
+interface TokenResponse {
+  auth: {
+    result: {
+      token: string;
+    };
+  };
+  keys: {
+    subscribe_key: string;
+    publish_key: string;
+  };
+}
+
+export interface ChatMessage {
+  channel: string;
+  message: {
+    text: string;
+    customType: string;
+  };
+  publisher: string;
+  subscription: string;
+  timetoken: number;
+}
+
+interface ChatInfo {
+  leadId: string | null;
+  timestamp: Date | null;
+  buildingSlug: string | null;
+}
+
+class MyPubnub {
+  private apiHost = "https://app.meetelise.com";
+
+  private building: Building | null = null;
+  private buildingSlug: string;
+  private ttlHours = 24;
+
+  pubnub: Pubnub | null = null;
+  leadUserId = "";
+  channel = "";
+
+  chatListener:
+    | ((res: { messages: ChatMessage[]; isLoading: boolean }) => void)
+    | null = null;
+
+  messages: ChatMessage[] = [];
+  listenerParams: ListenerParameters = {
+    message: (messageEvent: MessageEvent) => {
+      this.messages = [
+        ...this.messages,
+        {
+          channel: messageEvent.channel,
+          message: messageEvent.message,
+          publisher: messageEvent.publisher,
+          subscription: messageEvent.subscription,
+          timetoken: +messageEvent.timetoken,
+        },
+      ];
+      const isWaitingForEliseResponse = messageEvent.publisher !== "eliseai";
+      this.chatListener?.({
+        messages: this.messages,
+        isLoading: isWaitingForEliseResponse,
+      });
+      this.isLoadingMessages = isWaitingForEliseResponse;
+    },
+  };
+  isLoadingMessages = false;
+
+  constructor(buildingSlug: string, buildingDetails: Building) {
+    this.buildingSlug = buildingSlug;
+    this.building = buildingDetails;
+  }
+
+  addChatListener(
+    listener: (response: {
+      messages: ChatMessage[];
+      isLoading: boolean;
+    }) => void
+  ): void {
+    this.chatListener = listener;
+  }
+
+  async initializePubnub(): Promise<Pubnub | undefined> {
+    const storedChatKeyValues = this.getChatStorageKey();
+    if (!storedChatKeyValues.leadId) {
+      // eslint-disable-next-line no-console
+      console.error("Error getting chat storage key...");
+      return;
+    }
+
+    this.leadUserId = storedChatKeyValues.leadId;
+    this.channel = `webchat_${this.leadUserId}`;
+
+    // If the user comes back to the page after closing it out, we get a new token to persist
+    //  the chat for another this.ttlHours hours.
+    if (
+      storedChatKeyValues.timestamp &&
+      isAfter(
+        storedChatKeyValues.timestamp,
+        addHours(new Date(), this.ttlHours)
+      )
+    ) {
+      this.createChatStorageKey(this.leadUserId);
+    }
+
+    const pubnubToken = await this.fetchToken(this.leadUserId, this.channel);
+
+    // These keys are OK to expose live, the authKey generated by the BE is what
+    // is used to authenticate the user. Ideally, should also add rate limiting
+    // and/or IP whitelisting to the BE endpoint that generates the token.
+    this.pubnub = new Pubnub({
+      publishKey: pubnubToken.keys.publish_key,
+      subscribeKey: pubnubToken.keys.subscribe_key,
+      userId: this.leadUserId,
+      authKey: pubnubToken.auth.result.token,
+    });
+    this.withAuthToken(() => new Promise(() => this.handleChatListeners()));
+    await this.withAuthToken(() => this.getChannelHistory());
+    return this.pubnub;
+  }
+  async fetchToken(lead: string, channel: string): Promise<TokenResponse> {
+    const response = await axios.get(
+      `${this.apiHost}/platformApi/webchat/pn/request-token?user_id=${lead}&channel=${channel}`
+    );
+    return response.data;
+  }
+  async fetchChannelExists(channel: string): Promise<boolean> {
+    const response = await axios.get(
+      `${this.apiHost}/platformApi/webchat/check-channel-exists?channel_name=${channel}`
+    );
+    return response.data;
+  }
+
+  async withAuthToken(apiRequestFunc: () => Promise<void>): Promise<void> {
+    try {
+      await apiRequestFunc();
+    } catch (error: unknown) {
+      // only want to retry with new token if the error is a 403
+      if (
+        error instanceof AxiosError &&
+        error &&
+        error.response &&
+        error.response.status === 403
+      ) {
+        try {
+          if (!this.pubnub || !this.leadUserId || !this.channel) return;
+
+          const newToken = await this.fetchToken(this.leadUserId, this.channel);
+          if (!newToken) return;
+
+          this.pubnub.setAuthKey(newToken.auth.result.token);
+
+          await apiRequestFunc();
+        } catch (retryError) {
+          //onsole.error(retryError);
+        }
+      }
+    }
+  }
+
+  async getChannelHistory(): Promise<void> {
+    try {
+      const response: Pubnub.FetchMessagesResponse = await new Promise(
+        (resolve, reject) => {
+          if (!this.pubnub || !this.channel) return;
+          this.pubnub.fetchMessages(
+            {
+              channels: [this.channel],
+              count: 100,
+            },
+            (status, response) => {
+              if (status.error) {
+                reject(status);
+              } else {
+                resolve(response);
+              }
+            }
+          );
+        }
+      );
+
+      if (this.channel && Object.keys(response.channels).length !== 0) {
+        const currentChannelMessages = response.channels[this.channel];
+        const parsedCurrentChannelMessages: ChatMessage[] = [];
+        currentChannelMessages.forEach((message) => {
+          if (message.uuid) {
+            parsedCurrentChannelMessages.push({
+              channel: message.channel,
+              message: message.message,
+              publisher: message.uuid,
+              subscription: message.channel,
+              timetoken: +message.timetoken,
+            });
+          }
+        });
+        this.messages = parsedCurrentChannelMessages;
+        this.chatListener?.({ messages: this.messages, isLoading: false });
+      }
+    } catch (error) {
+      // Handle the error here
+    }
+  }
+
+  handleChatListeners = (): void => {
+    if (!this.pubnub || !this.channel) return;
+    this.pubnub.subscribe({ channels: [this.channel] });
+    this.pubnub.addListener(this.listenerParams);
+  };
+  removeChatListeners = (): void => {
+    if (this.pubnub && this.channel) {
+      this.pubnub.unsubscribe({ channels: [this.channel] });
+      this.pubnub.removeListener(this.listenerParams);
+    }
+  };
+
+  sendMessage = async (message: string): Promise<void> => {
+    if (message) {
+      if (!this.pubnub) {
+        // ONLY create/gets a chat session if user actually wants to chat
+        const myPubnub = await this.initializePubnub();
+        if (!myPubnub) return;
+      }
+
+      await this.withAuthToken(async () => {
+        if (!this.pubnub || !this.channel) return;
+        await this.pubnub.publish({
+          channel: this.channel,
+          message: {
+            text: message,
+            customType: "lead_message",
+            buildingId: this.building?.id,
+            buildingSlug: this.buildingSlug,
+            userId: this.building?.userId, // this userid is actually the AI user!
+          },
+        });
+      });
+      if (this.isLoadingMessages === false) this.isLoadingMessages = true;
+    }
+  };
+  isLeadMessage = (message: ChatMessage): boolean =>
+    message.publisher.includes("lead_") &&
+    message.message.customType === "lead_message";
+
+  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 = (): 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");
+      }
+    }
+
+    return this.createChatStorageKey();
+  };
+  isChatKeyValid = (storageValueDeconstructed: ChatInfo): boolean => {
+    if (
+      storageValueDeconstructed.buildingSlug !== this.buildingSlug ||
+      !storageValueDeconstructed.leadId ||
+      !storageValueDeconstructed.timestamp
+    ) {
+      return false;
+    }
+
+    const expirationDate = addHours(new Date(), this.ttlHours);
+    return isBefore(storageValueDeconstructed.timestamp, expirationDate);
+  };
+}
+
+export default MyPubnub;