@meetelise/chat 1.35.0 → 1.35.1

package/src/getAvailabilities.ts

@@ -0,0 +1,189 @@
+import formatISO from "date-fns/formatISO";
+import startOfToday from "date-fns/startOfToday";
+import endOfDay from "date-fns/endOfDay";
+import addDays from "date-fns/addDays";
+import format from "date-fns/format";
+import axios from "axios";
+
+import {
+  TourAvailabilityResponse,
+  TourAvailabilityResponseRankOrderedSupportedTourTypesEnum,
+} from "./types/rest-sdk.types";
+import groupBy from "lodash/groupBy";
+import { TourType } from "./WebComponent/Scheduler/tour-scheduler";
+import isPast from "date-fns/isPast";
+import parseISO from "date-fns/parseISO";
+import isValid from "date-fns/isValid";
+
+const availabilitiesCache: {
+  buildingId?: number | null;
+  availabilities: { [buildingId: number]: TourAvailabilityResponse };
+} = { buildingId: null, availabilities: {} };
+
+export const resetAvailabilitiesCache = (): void => {
+  availabilitiesCache.buildingId = null;
+  availabilitiesCache.availabilities = {};
+};
+
+/**
+ * Returns the raw availabilities.
+ *
+ * If no `buildingId` is provided, it will use a cached buildingId from the previous call.
+ * If there is none cached, it will throw an error.
+ */
+export const getRawAvailabilities = async (
+  buildingId?: number
+): Promise<TourAvailabilityResponse> => {
+  if (buildingId) {
+    availabilitiesCache.buildingId = buildingId;
+  }
+  const buildingIdToUse = availabilitiesCache.buildingId;
+  if (!buildingIdToUse) {
+    throw new Error(
+      "No buildingId was provided to getRawAvailabilities and there is no buildingId cached."
+    );
+  }
+  const availabilities = availabilitiesCache.availabilities;
+  if (availabilities[buildingIdToUse]) {
+    return availabilities[buildingIdToUse];
+  }
+  const startTime = startOfToday();
+  const endTime = formatISO(endOfDay(addDays(startTime, 30)));
+
+  // We MUST encode the URI components because a positive timezone offset counts as a space in urls!
+  const timeParams = `startTime=${encodeURIComponent(
+    formatISO(startTime)
+  )}&endTime=${encodeURIComponent(endTime)}`;
+  const url = `https://app.meetelise.com/api/pub/v1/buildings/${buildingIdToUse}/tour/availabilities?${timeParams}`;
+
+  const result = await axios.get<TourAvailabilityResponse>(url);
+  availabilitiesCache.availabilities[buildingIdToUse] = result.data;
+  // The endpoint INCORRECTLY states that these are returned as dates. They are, in fact, strings.
+  return result.data;
+};
+
+export const getTimezoneForBuilding = async (
+  buildingId: number
+): Promise<string> => {
+  const availabilities = await getRawAvailabilities(buildingId);
+  return (
+    (availabilities.calendarTimeZone as string | undefined) ??
+    Intl.DateTimeFormat().resolvedOptions().timeZone
+  ); // the type for calendrTimeZone is outdated. it's just a string, not this weird object thing
+};
+
+export const getAvailabilitiesForTourType = async (
+  tourType: TourAvailabilityResponseRankOrderedSupportedTourTypesEnum,
+  buildingId?: number
+): Promise<{
+  /**
+   *
+   * @type {number}
+   * @memberof TourTypeAvailability
+   */
+  tourDurationInMinutes?: number;
+  /**
+   *
+   * @type {Array<string>}
+   * @memberof TourTypeAvailability
+   */
+  availableTourStartTimes?: Array<string>;
+} | null> => {
+  // The endpoint INCORRECTLY states that these are returned as dates. They are, in fact, strings.
+  const availabilities = await getRawAvailabilities(buildingId);
+  const availableTimes = availabilities.availability?.[tourType]
+    ? (availabilities.availability?.[tourType]
+        .availableTourStartTimes as unknown as string[])
+    : [];
+  return availabilities.availability
+    ? {
+        ...availabilities.availability[tourType],
+        availableTourStartTimes: availableTimes,
+      }
+    : null;
+};
+
+export interface DateWithTimeZoneOffset {
+  datetime: string;
+  offset: string;
+}
+
+/**
+ * Returns an object that reveals whether each tour type supported by
+ * `tour-scheduler` has availabilities (time slots available for scheduling) in
+ * the time window of interest.
+ *
+ * Note that the existence of current availabilities is distinct from the
+ * question of whether the community supports the tour type at all. The first
+ * implies the second but not vice versa.
+ */
+export const getExistenceOfAvailabilitiesByTourType = async (): Promise<{
+  [TourType.Guided]: boolean;
+  [TourType.Self]: boolean;
+  [TourType.Virtual]: boolean;
+}> => {
+  return {
+    [TourType.Guided]: !!(
+      await getAvailabilitiesForTourType(
+        TourAvailabilityResponseRankOrderedSupportedTourTypesEnum.WithAgent
+      )
+    )?.availableTourStartTimes?.length,
+    [TourType.Self]: !!(
+      await getAvailabilitiesForTourType(
+        TourAvailabilityResponseRankOrderedSupportedTourTypesEnum.SelfGuided
+      )
+    )?.availableTourStartTimes?.length,
+    [TourType.Virtual]: !!(
+      await getAvailabilitiesForTourType(
+        TourAvailabilityResponseRankOrderedSupportedTourTypesEnum.VirtualShowing
+      )
+    )?.availableTourStartTimes?.length,
+  };
+};
+
+export const getAvailabilitiesGroupedByDay = async (
+  tourType: TourAvailabilityResponseRankOrderedSupportedTourTypesEnum,
+  buildingId?: number
+): Promise<{ [day: string]: DateWithTimeZoneOffset[] }> => {
+  const availabilitiesForTourTypeRaw = await getAvailabilitiesForTourType(
+    tourType,
+    buildingId
+  );
+
+  if (!availabilitiesForTourTypeRaw) {
+    return {};
+  }
+  // Specify offset for each datetime in case availabilities span a daylight savings boundary, when offset will change.
+  // Cast availableTourStartTimes to string[], since the Date[] typing of the API is incorrect
+  const availabilitiesForTourType: {
+    availableTourStartTimes: DateWithTimeZoneOffset[] | undefined;
+  } = {
+    availableTourStartTimes:
+      (availabilitiesForTourTypeRaw.availableTourStartTimes
+        ? (
+            availabilitiesForTourTypeRaw.availableTourStartTimes as unknown as string[]
+          ).filter((dt) => isValid(parseISO(dt)) && !isPast(parseISO(dt)))
+        : []
+      )?.map((dateString) => dateStringToDateWithTimeZoneOffset(dateString)),
+  };
+
+  return groupBy(
+    availabilitiesForTourType.availableTourStartTimes ?? [],
+    (startTime) => format(new Date(startTime.datetime), "yyyy-MM-dd")
+  );
+};
+
+/**
+ * Takes an ISO 8601 date string with time zone offset and returns
+ * an object of our custom type DateWithTimeZoneOffset.
+ *
+ * @example
+ * // returns { datetime: '2022-06-27T09:00:00', offset: '-07:00' }
+ * dateStringToDateWithTimeZoneOffset('2022-06-27T09:00:00-07:00')
+ *  */
+const dateStringToDateWithTimeZoneOffset = (
+  dateString: string
+): DateWithTimeZoneOffset => ({
+  datetime: dateString.slice(0, 19),
+  offset: dateString.slice(19),
+});

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/getShouldAllowScheduling.ts

@@ -0,0 +1,16 @@
+import axios from "axios";
+
+export const getShouldAllowScheduling = async (
+  buildingId: number,
+  isDynamicSchedulingEnabled = false
+): Promise<boolean> => {
+  const host = "https://app.meetelise.com";
+  const url = `${host}/eliseCrmApi/building/${buildingId}/scheduling_status?observe_dynamic_scheduling=${isDynamicSchedulingEnabled}`;
+
+  try {
+    const response = await axios.get(url);
+    return response.data.is_enabled;
+  } catch (e) {
+    return false;
+  }
+};

package/src/getShouldShowWebchat.ts

@@ -0,0 +1,114 @@
+import { logSignal } from "./analytics";
+import { BuildingWebchatView } from "./fetchBuildingWebchatView";
+import { fetchFeatureFlagMaintenanceMode } from "./fetchFeatureFlag";
+import { WebchatNoShowReason } from "./types/webchat-no-show-reason";
+
+const getShouldShowWebchat = async (
+  buildingWebchatView: BuildingWebchatView | null,
+  buildingSlug: string,
+  orgSlug: string
+): Promise<boolean> => {
+  const sampleRateForWebchat = 0.01;
+
+  if (!buildingWebchatView) {
+    // eslint-disable-next-line no-console
+    console.warn("MeetElise Chat will NOT appear. Building does NOT exist.");
+    log(
+      orgSlug,
+      buildingSlug,
+      true,
+      false,
+      "building_does_not_exist",
+      sampleRateForWebchat
+    );
+    return false;
+  }
+  if (!buildingWebchatView.launchedDateTime) {
+    // eslint-disable-next-line no-console
+    console.warn(
+      "MeetElise Chat will NOT appear. Building is NOT launched (based on launched date time)."
+    );
+    log(
+      orgSlug,
+      buildingSlug,
+      true,
+      false,
+      "building_not_launched",
+      sampleRateForWebchat
+    );
+    return false;
+  }
+
+  if (!buildingWebchatView.active) {
+    // eslint-disable-next-line no-console
+    console.warn("MeetElise Chat will NOT appear. Building is NOT active.");
+    log(
+      orgSlug,
+      buildingSlug,
+      true,
+      false,
+      "building_not_active",
+      sampleRateForWebchat
+    );
+    return false;
+  }
+  if (!buildingWebchatView.webchatScopeConfigured) {
+    // eslint-disable-next-line no-console
+    console.warn(
+      "MeetElise Chat will NOT appear. Building is NOT webchat scope configured."
+    );
+    log(
+      orgSlug,
+      buildingSlug,
+      true,
+      false,
+      "building_not_webchat_scope_configured",
+      sampleRateForWebchat
+    );
+    return false;
+  }
+
+  const leasingMaintenanceMode = await fetchFeatureFlagMaintenanceMode(
+    buildingSlug
+  );
+  // https://app.launchdarkly.com/projects/default/flags/webchat-leasing-in-maintenance-mode/targeting?env=production&selected-env=production
+  if (leasingMaintenanceMode) {
+    // eslint-disable-next-line no-console
+    console.warn(
+      "MeetElise Chat will NOT appear. Chat is in maintenance mode."
+    );
+    log(
+      orgSlug,
+      buildingSlug,
+      true,
+      false,
+      "building_in_maintenance_mode",
+      sampleRateForWebchat
+    );
+    return false;
+  }
+  return true;
+};
+
+const log = (
+  orgSlug: string,
+  buildingSlug: string,
+  isPixelOnSite = true,
+  isAnyWebchatShowing = false,
+  webchatNoShowReason: WebchatNoShowReason,
+  sampleRate = 0.01
+) =>
+  logSignal({
+    params: {
+      org_slug: orgSlug,
+      building_slug: buildingSlug,
+      is_pixel_on_site: isPixelOnSite,
+      is_any_webchat_showing: isAnyWebchatShowing,
+      extra_data: {
+        webchat_no_show_reason: webchatNoShowReason,
+      },
+    },
+    sampleRate,
+  });
+
+export default getShouldShowWebchat;

package/src/getTimezoneString.ts

@@ -0,0 +1,40 @@
+const isDaylightSavingTime = (date: Date): boolean => {
+  const jan = new Date(date.getFullYear(), 0, 1);
+  const jul = new Date(date.getFullYear(), 6, 1);
+  const stdTimezoneOffset = Math.max(
+    jan.getTimezoneOffset(),
+    jul.getTimezoneOffset()
+  );
+
+  return date.getTimezoneOffset() < stdTimezoneOffset;
+};
+
+export const getTimezoneAbbreviation = (timeZone?: string): string => {
+  const date = new Date();
+  const timeZoneToUse =
+    timeZone ?? Intl.DateTimeFormat().resolvedOptions().timeZone;
+  const isDST = isDaylightSavingTime(date);
+
+  switch (timeZoneToUse) {
+    case "America/New_York":
+      return isDST ? "EDT" : "EST";
+    case "America/Chicago":
+      return isDST ? "CDT" : "CST";
+    case "America/Denver":
+      return isDST ? "MDT" : "MST";
+    case "America/Los_Angeles":
+      return isDST ? "PDT" : "PST";
+    case "America/Anchorage":
+      return isDST ? "AKDT" : "AKST";
+    case "America/Honolulu":
+      return "HST";
+    case "America/Phoenix":
+      return "MST";
+    case "America/Indiana/Indianapolis":
+      return isDST ? "EDT" : "EST";
+    case "America/Indiana/Knox":
+      return isDST ? "CDT" : "CST";
+    default:
+      return "Unknown";
+  }
+};

package/src/globals.ts

@@ -0,0 +1,3 @@
+export const BASE_DOMAIN = "https://app.meetelise.com";
+
+export const TODAY = new Date();

package/src/gtm.ts

@@ -0,0 +1,17 @@
+declare global {
+  interface Window {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    dataLayer: any[];
+  }
+}
+
+export const pushGtmEvent = (
+  eventName: string,
+  event: Record<string, unknown> = {}
+): void => {
+  window.dataLayer = window.dataLayer || [];
+  window.dataLayer.push({
+    event: eventName,
+    ...event,
+  });
+};

package/src/handleChatId.ts

@@ -0,0 +1,101 @@
+import parseISO from "date-fns/parseISO";
+import { v4 as uuid } from "uuid";
+import formatISO from "date-fns/formatISO";
+import { isTimestampExpired } from "./utils";
+import isBefore from "date-fns/isBefore";
+
+export interface ChatStorageKey {
+  leadId: string | null;
+  timestamp: Date | null;
+  buildingSlug: string | null;
+  initiatedChat: boolean;
+}
+
+export const ttlHours = 24;
+
+export const clearChatStorageKey = (buildingSlug: string): void =>
+  localStorage.removeItem("com.elise.webchat.slug=" + buildingSlug);
+
+export const createChatStorageKey = (
+  buildingSlug: string,
+  withChatinitialized: boolean,
+  leadId?: string
+): ChatStorageKey => {
+  const storageTimestamp = formatISO(new Date());
+
+  // must preface with lead for BE to extract lead id
+  const leadUserId = leadId ? leadId : `lead_${uuid()}`;
+  localStorage.setItem(
+    "com.elise.webchat.slug=" + buildingSlug,
+    JSON.stringify({
+      buildingSlug: buildingSlug,
+      leadId: leadUserId,
+      timestamp: storageTimestamp,
+      initiatedChat: withChatinitialized,
+    })
+  );
+  return {
+    leadId: leadUserId,
+    timestamp: parseISO(storageTimestamp),
+    buildingSlug: buildingSlug,
+    initiatedChat: withChatinitialized,
+  };
+};
+
+export const getChatStorageKey = (buildingSlug: string): ChatStorageKey => {
+  const eliseaiLocalStorageValue = localStorage.getItem(
+    "com.elise.webchat.slug=" + buildingSlug
+  );
+  if (eliseaiLocalStorageValue) {
+    try {
+      const eliseaiLocalStorageValueParsed = JSON.parse(
+        eliseaiLocalStorageValue
+      );
+      const newStorageKey = {
+        leadId: eliseaiLocalStorageValueParsed.leadId,
+        timestamp: new Date(eliseaiLocalStorageValueParsed.timestamp),
+        buildingSlug: eliseaiLocalStorageValueParsed.buildingSlug,
+        initiatedChat: eliseaiLocalStorageValueParsed.initiatedChat,
+      };
+      if (isChatKeyValid(buildingSlug, newStorageKey)) {
+        return newStorageKey;
+      }
+    } catch (_) {
+      // eslint-disable-next-line no-console
+      console.warn("Error getting chat storage key");
+    }
+  }
+
+  return {
+    leadId: null,
+    timestamp: null,
+    buildingSlug: null,
+    initiatedChat: false,
+  };
+};
+export const isChatKeyValid = (
+  buildingSlug: string,
+  storageValue: ChatStorageKey
+): boolean => {
+  // If we want to do force invalidation
+  try {
+    if (storageValue.timestamp && storageValue.initiatedChat) {
+      const topBoundaryTimestamp = new Date("2024-06-06T21:30:00Z");
+      if (isBefore(storageValue.timestamp, topBoundaryTimestamp)) {
+        return false;
+      }
+    }
+  } catch (_) {
+    // eslint-disable-next-line no-console
+    console.warn("Error checking chat storage key validity");
+  }
+
+  if (
+    storageValue.buildingSlug !== buildingSlug ||
+    !storageValue.leadId ||
+    !storageValue.timestamp
+  ) {
+    return false;
+  }
+  return !isTimestampExpired(storageValue.timestamp, ttlHours);
+};

package/src/insertDNIIntoWebsite.ts

@@ -0,0 +1,146 @@
+/**
+ * General script to find all phone numbers on a page and replace them with a
+ * DNI phone number.
+ */
+
+import { LogType, sendLoggingEvent } from "./analytics";
+
+export const insertDNIIntoWebsite = (
+  cleanPhoneNumber: string, // format of 1234567890
+  orgSlug: string,
+  buildingSlug?: string
+): number => {
+  const newHrefNumber = `tel:${cleanPhoneNumber}`;
+  const newHrefSmsNumber = `sms:${cleanPhoneNumber}`;
+  const newWhatsAppNumber = `whatsapp://send?phone=${cleanPhoneNumber}}`;
+  const newFacetimeNumber = `facetime:${cleanPhoneNumber}`;
+  const newFacetimeAudioNumber = `facetime-audio:${cleanPhoneNumber}`;
+
+  const phoneNumberPattern = /(?:\(\d{3}\)\s|\d{3}-)\d{3}-\d{4}/g;
+  const hrefNumberPattern = /(tel|sms):(?:\(\d{3}\)\s|\d{3}-)\d{3}-\d{4}/g;
+
+  const whatsappNumberPattern = /whatsapp:\/\/send\?phone=\d+/g;
+  const facetimeNumberPattern = /(facetime|facetime-audio):\d+/g;
+
+  const allHTMLItems = document.body.getElementsByTagName("*");
+
+  let foundPhoneNumber = false;
+
+  // from a phone format of 1234567890 to (123) 456-7890
+  const newPhoneNumber = cleanPhoneNumber.replace(
+    /(\d{3})(\d{3})(\d{4})/,
+    "($1) $2-$3"
+  );
+
+  let shouldLogTextInsertionError = false;
+  let shouldLogHrefInsertionError = false;
+
+  let totalReplacements = 0;
+
+  for (let i = 0; i < allHTMLItems.length; i++) {
+    if (allHTMLItems[i].nodeType !== Node.ELEMENT_NODE) {
+      continue;
+    }
+
+    // Handles the actual display phone number
+    if (
+      allHTMLItems[i].childNodes.length === 1 &&
+      allHTMLItems[i].childNodes[0].nodeType == Node.TEXT_NODE
+    ) {
+      const oldInnerHTML = allHTMLItems[i].innerHTML;
+      const newInnerHTML = oldInnerHTML.replace(
+        phoneNumberPattern,
+        newPhoneNumber
+      );
+      if (oldInnerHTML !== newInnerHTML) {
+        totalReplacements++;
+      }
+      allHTMLItems[i].innerHTML = newInnerHTML;
+
+      foundPhoneNumber = true;
+
+      if (!shouldLogTextInsertionError) {
+        shouldLogTextInsertionError = true;
+      }
+    }
+
+    // Handles the href phone number (so when you click the link, it will call the phone number)
+    if (allHTMLItems[i].hasAttribute("href")) {
+      const href = allHTMLItems[i].getAttribute("href");
+      if (!href) {
+        continue;
+      }
+
+      let newHrefValue = "";
+      let currentPattern = hrefNumberPattern;
+
+      if (href.startsWith("sms:")) {
+        newHrefValue = newHrefSmsNumber;
+      } else if (href.startsWith("whatsapp:")) {
+        newHrefValue = newWhatsAppNumber;
+        currentPattern = whatsappNumberPattern;
+      } else if (href.startsWith("facetime:")) {
+        newHrefValue = newFacetimeNumber;
+        currentPattern = facetimeNumberPattern;
+      } else if (href.startsWith("facetime-audio:")) {
+        newHrefValue = newFacetimeAudioNumber;
+        currentPattern = facetimeNumberPattern;
+      } else {
+        newHrefValue = newHrefNumber;
+      }
+
+      const newHref = href.replace(currentPattern, newHrefValue);
+      allHTMLItems[i].setAttribute("href", newHref);
+
+      if (!shouldLogHrefInsertionError) {
+        shouldLogHrefInsertionError = true;
+      }
+    }
+  }
+
+  // We could make these logs more specific but for now we'll just log the
+  // if there is even a single error to limit the error logs we throw
+
+  if (shouldLogTextInsertionError) {
+    sendLoggingEvent({
+      logTitle: "DNI_WEBSITE_INSERTION",
+      logData: {
+        type: "text-insertion",
+        newPhoneNumber,
+        website: window.location.href,
+      },
+      logType: LogType.info,
+      buildingSlug,
+      orgSlug,
+    });
+  }
+
+  if (shouldLogHrefInsertionError) {
+    sendLoggingEvent({
+      logTitle: "DNI_WEBSITE_INSERTION",
+      logData: {
+        type: "href-insertion",
+        newPhoneNumber,
+        website: window.location.href,
+      },
+      logType: LogType.info,
+      buildingSlug,
+      orgSlug,
+    });
+  }
+
+  if (!foundPhoneNumber) {
+    sendLoggingEvent({
+      logTitle: "DNI_WEBSITE_INSERTION",
+      logData: {
+        type: "no-phone-number-found",
+        website: window.location.href,
+      },
+      logType: LogType.warn,
+      buildingSlug,
+      orgSlug,
+    });
+  }
+
+  return totalReplacements;
+};