@microsoft/omnichannel-chat-widget 1.7.4-main.c3fef22 → 1.7.4-main.e66bbe9

package/lib/esm/common/facades/FacadeChatSDK.js

@@ -0,0 +1,291 @@
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+import { BroadcastEvent, LogLevel, TelemetryEvent } from "../telemetry/TelemetryConstants";
+import { getAuthClientFunction, handleAuthentication } from "../../components/livechatwidget/common/authHelper";
+import { BroadcastService } from "@microsoft/omnichannel-chat-components";
+import { TelemetryHelper } from "../telemetry/TelemetryHelper";
+import { isNullOrEmptyString } from "../utils";
+export class FacadeChatSDK {
+  isSDKMocked() {
+    return this.sdkMocked;
+  }
+  getChatSDK() {
+    return this.chatSDK;
+  }
+  destroy() {
+    this.token = null;
+    this.expiration = 0;
+  }
+  isTokenSet() {
+    return !isNullOrEmptyString(this.token);
+  }
+  constructor(input) {
+    _defineProperty(this, "chatSDK", void 0);
+    _defineProperty(this, "chatConfig", void 0);
+    _defineProperty(this, "token", "");
+    _defineProperty(this, "expiration", 0);
+    _defineProperty(this, "isAuthenticated", void 0);
+    _defineProperty(this, "getAuthToken", void 0);
+    _defineProperty(this, "sdkMocked", void 0);
+    this.chatSDK = input.chatSDK;
+    this.chatConfig = input.chatConfig;
+    this.getAuthToken = input.getAuthToken;
+    this.isAuthenticated = input.isAuthenticated;
+    this.sdkMocked = input.isSDKMocked;
+  }
+
+  //set default expiration to zero, for undefined or missed exp in jwt
+  convertExpiration() {
+    let expiration = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
+    // Converting expiration to seconds, if contains decimals or is identified as milliseconds
+    if (expiration.toString().length === 13) {
+      return Math.floor(expiration / 1000);
+    }
+    // If the epoch value is already in seconds, return it as is
+    return expiration;
+  }
+  isTokenExpired() {
+    // if expiration is 0, token is not going to be validated ( this is to cover the case of token with no expiration)
+    if (this.expiration === 0) {
+      return false;
+    }
+
+    // obtain current time in seconds
+    const now = Math.floor(Date.now() / 1000);
+
+    // compare expiration time with current time
+    if (now > this.expiration) {
+      console.log("Token is expired", now, this.expiration, now > this.expiration);
+      return true;
+    }
+    return false;
+  }
+  async setToken(token) {
+    // token must be not null, and must be new
+    if (!isNullOrEmptyString(token) && token !== this.token) {
+      var _this$token;
+      const instant = Math.floor(Date.now() / 1000);
+      this.token = token;
+      // decompose token
+      const tokenParts = (_this$token = this.token) === null || _this$token === void 0 ? void 0 : _this$token.split(".");
+      if (!tokenParts || tokenParts.length <= 1) {
+        TelemetryHelper.logFacadeChatSDKEvent(LogLevel.ERROR, {
+          Event: TelemetryEvent.NewTokenFailed,
+          Description: "Invalid token format",
+          ExceptionDetails: "Token must be in JWT format"
+        });
+        throw new Error("Invalid token format, must be in JWT format");
+      }
+      // decode token
+      const tokenDecoded = JSON.parse(atob(tokenParts[1]));
+      // calculate expiration time
+      this.expiration = this.convertExpiration(tokenDecoded.exp);
+
+      // this is a control , in case the getAuthToken function returns same token
+      if (this.expiration > 0 && this.expiration < instant) {
+        TelemetryHelper.logFacadeChatSDKEvent(LogLevel.ERROR, {
+          Event: TelemetryEvent.NewTokenExpired,
+          Description: "New token is already expired",
+          ExceptionDetails: {
+            "Instant": instant,
+            "Expiration": this.expiration
+          }
+        });
+        throw new Error("New token is already expired, with epoch time " + this.expiration);
+      }
+    }
+  }
+  async tokenRing() {
+    // this is needed for storybooks, specifically for reconnect pane which requires authentication bypass
+    if (this.sdkMocked === true) {
+      return {
+        result: true,
+        message: "Authentication not needed"
+      };
+    }
+    if (!this.isAuthenticated) {
+      return {
+        result: true,
+        message: "Authentication not needed"
+      };
+    }
+    if (this.isTokenSet() && !this.isTokenExpired()) {
+      return {
+        result: true,
+        message: "Token is valid"
+      };
+    }
+    if (this.getAuthToken === undefined) {
+      TelemetryHelper.logFacadeChatSDKEvent(LogLevel.ERROR, {
+        Event: TelemetryEvent.NewTokenFailed,
+        Description: "GetAuthToken function is not present",
+        ExceptionDetails: "Missing function : " + getAuthClientFunction(this.chatConfig)
+      });
+      return {
+        result: false,
+        message: "GetAuthToken function is not present"
+      };
+    }
+
+    // if token is not set, or token is already expired , then go to grab a token
+    this.token = "";
+    this.expiration = 0;
+    try {
+      const ring = await handleAuthentication(this.chatSDK, this.chatConfig, this.getAuthToken);
+      if (ring.result === true && ring.token) {
+        await this.setToken(ring.token);
+        TelemetryHelper.logFacadeChatSDKEvent(LogLevel.INFO, {
+          Event: TelemetryEvent.NewTokenSuccess,
+          Description: "New Token obtained",
+          Data: {
+            "Token_Expiration": this.expiration
+          }
+        });
+        return {
+          result: true,
+          message: "New Token obtained"
+        };
+      } else {
+        var _ring$error, _ring$error2;
+        console.error("Failed to get token", ring);
+        TelemetryHelper.logFacadeChatSDKEvent(LogLevel.ERROR, {
+          Event: TelemetryEvent.NewTokenFailed,
+          Description: (_ring$error = ring.error) === null || _ring$error === void 0 ? void 0 : _ring$error.message,
+          ExceptionDetails: ring.error
+        });
+        return {
+          result: false,
+          message: ((_ring$error2 = ring.error) === null || _ring$error2 === void 0 ? void 0 : _ring$error2.message) || "Failed to get token"
+        };
+      }
+    } catch (e) {
+      console.error("Unexpected error while getting token", e);
+      TelemetryHelper.logFacadeChatSDKEvent(LogLevel.ERROR, {
+        Event: TelemetryEvent.NewTokenFailed,
+        Description: "Unexpected error while getting token",
+        ExceptionDetails: e
+      });
+      return {
+        result: false,
+        message: "Unexpected error while getting token"
+      };
+    }
+  }
+  async validateAndExecuteCall(functionName, fn) {
+    const pingResponse = await this.tokenRing();
+    if (pingResponse.result === true) {
+      return fn();
+    }
+    const executionErrorMessage = `Authentication failed: Process to get a token failed for ${functionName}, ${pingResponse.message}`;
+    //telemetry is already logged in tokenRing, so no need to log again, just return the error and communicate to the console
+    console.error(executionErrorMessage);
+    BroadcastService.postMessage({
+      eventName: BroadcastEvent.OnWidgetError,
+      payload: {
+        errorMessage: executionErrorMessage
+      }
+    });
+    throw new Error(executionErrorMessage);
+  }
+  async initialize() {
+    let optionalParams = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    return this.validateAndExecuteCall("initialize", () => this.chatSDK.initialize(optionalParams));
+  }
+  async getChatReconnectContext() {
+    let optionalParams = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    return this.validateAndExecuteCall("getChatReconnectContext", () => this.chatSDK.getChatReconnectContext(optionalParams));
+  }
+  async startChat() {
+    let optionalParams = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    return this.validateAndExecuteCall("startChat", () => this.chatSDK.startChat(optionalParams));
+  }
+  async endChat() {
+    let optionalParams = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    return this.validateAndExecuteCall("endChat", () => this.chatSDK.endChat(optionalParams));
+  }
+  async getCurrentLiveChatContext() {
+    return this.validateAndExecuteCall("getCurrentLiveChatContext", () => this.chatSDK.getCurrentLiveChatContext());
+  }
+  async getConversationDetails() {
+    let optionalParams = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    return this.validateAndExecuteCall("getConversationDetails", () => this.chatSDK.getConversationDetails(optionalParams));
+  }
+
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  async getPreChatSurvey() {
+    let parse = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+    //prechat survey is obtained from config object, which is not required to be authenticated
+    // removing the tokenRing function from this call for backward compatibility
+    // TODO ::  wrap this function around authentication
+    return this.chatSDK.getPreChatSurvey(parse);
+  }
+  async getLiveChatConfig(optionalParams) {
+    return this.validateAndExecuteCall("getLiveChatConfig", () => this.chatSDK.getLiveChatConfig(optionalParams));
+  }
+  async getChatToken() {
+    let cached = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+    let optionalParams = arguments.length > 1 ? arguments[1] : undefined;
+    return this.validateAndExecuteCall("getChatToken", () => this.chatSDK.getChatToken(cached, optionalParams));
+  }
+  async getCallingToken() {
+    return this.validateAndExecuteCall("getCallingToken", () => this.chatSDK.getCallingToken());
+  }
+  async getMessages() {
+    return this.validateAndExecuteCall("getMessages", () => this.chatSDK.getMessages());
+  }
+  async getDataMaskingRules() {
+    return this.validateAndExecuteCall("getDataMaskingRules", () => this.chatSDK.getDataMaskingRules());
+  }
+  async sendMessage(message) {
+    return this.validateAndExecuteCall("sendMessage", () => this.chatSDK.sendMessage(message));
+  }
+  async onNewMessage(onNewMessageCallback) {
+    let optionalParams = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    return this.validateAndExecuteCall("onNewMessage", () => this.chatSDK.onNewMessage(onNewMessageCallback, optionalParams));
+  }
+  async sendTypingEvent() {
+    return this.validateAndExecuteCall("sendTypingEvent", () => this.chatSDK.sendTypingEvent());
+  }
+  async onTypingEvent(onTypingEventCallback) {
+    return this.validateAndExecuteCall("onTypingEvent", () => this.chatSDK.onTypingEvent(onTypingEventCallback));
+  }
+  async onAgentEndSession(onAgentEndSessionCallback) {
+    return this.validateAndExecuteCall("onAgentEndSession", () => this.chatSDK.onAgentEndSession(onAgentEndSessionCallback));
+  }
+  async uploadFileAttachment(fileInfo) {
+    return this.validateAndExecuteCall("uploadFileAttachment", () => this.chatSDK.uploadFileAttachment(fileInfo));
+  }
+  async downloadFileAttachment(fileMetadata) {
+    return this.validateAndExecuteCall("downloadFileAttachment", () => this.chatSDK.downloadFileAttachment(fileMetadata));
+  }
+  async emailLiveChatTranscript(body) {
+    let optionalParams = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    return this.validateAndExecuteCall("emailLiveChatTranscript", () => this.chatSDK.emailLiveChatTranscript(body, optionalParams));
+  }
+  async getLiveChatTranscript() {
+    let optionalParams = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    return this.validateAndExecuteCall("getLiveChatTranscript", () => this.chatSDK.getLiveChatTranscript(optionalParams));
+  }
+
+  // response from origin is unknown, but this definition breaks create adapter for shimAdapter, switching to any until type is returned from origin
+  async createChatAdapter() {
+    let optionalParams = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    return this.validateAndExecuteCall("createChatAdapter", () => this.chatSDK.createChatAdapter(optionalParams));
+  }
+  async isVoiceVideoCallingEnabled() {
+    this.tokenRing();
+    return this.chatSDK.isVoiceVideoCallingEnabled();
+  }
+  async getVoiceVideoCalling() {
+    let params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    return this.validateAndExecuteCall("getVoiceVideoCalling", () => this.chatSDK.getVoiceVideoCalling(params));
+  }
+  async getPostChatSurveyContext() {
+    return this.validateAndExecuteCall("getPostChatSurveyContext", () => this.chatSDK.getPostChatSurveyContext());
+  }
+  async getAgentAvailability() {
+    let optionalParams = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    return this.validateAndExecuteCall("getAgentAvailability", () => this.chatSDK.getAgentAvailability(optionalParams));
+  }
+}

package/lib/esm/common/facades/types/IFacadeChatSDKInput.js

@@ -0,0 +1 @@
+export {};

package/lib/esm/common/telemetry/TelemetryConstants.js

@@ -182,6 +182,7 @@ export let TelemetryEvent;
   TelemetryEvent["SendTypingIndicatorSucceeded"] = "SendTypingIndicatorSucceeded";
   TelemetryEvent["SendTypingIndicatorFailed"] = "SendTypingIndicatorFailed";
   TelemetryEvent["WebChatEvent"] = "WebChatEvent";
+  TelemetryEvent["FacadeChatSDKEvent"] = "FacadeChatSDKEvent";
   TelemetryEvent["PreChatSurveyStartChatMethodFailed"] = "PreChatSurveyStartChatMethodFailed";
   TelemetryEvent["ChatAlreadyTriggered"] = "ChatAlreadyTriggered";
   TelemetryEvent["StartProactiveChatEventReceived"] = "StartProactiveChatEventReceived";
@@ -212,6 +213,10 @@ export let TelemetryEvent;
   TelemetryEvent["ChatDisconnectThreadEventReceived"] = "ChatDisconnectThreadEventReceived";
   TelemetryEvent["HiddenAdaptiveCardMessageReceived"] = "HiddenAdaptiveCardMessageReceived";
   TelemetryEvent["EndingAdapterAfterDisconnectionError"] = "EndingAdapterAfterDisconnectionError";
+  TelemetryEvent["NewTokenSuccess"] = "NewTokenSuccess";
+  TelemetryEvent["NewTokenFailed"] = "NewTokenFailed";
+  TelemetryEvent["NewTokenExpired"] = "NewTokenExpired";
+  TelemetryEvent["TokenEmptyOrSame"] = "TokenEmptyOrSame";
 })(TelemetryEvent || (TelemetryEvent = {}));
 export class TelemetryConstants {
   static map(eventTypeOrScenarioType) {

package/lib/esm/common/telemetry/TelemetryHelper.js

@@ -257,4 +257,14 @@ _defineProperty(TelemetryHelper, "logWebChatEvent", (logLevel, payload) => {
     }
   };
   BroadcastService.postMessage(telemetryEvent);
+});
+_defineProperty(TelemetryHelper, "logFacadeChatSDKEvent", (logLevel, payload) => {
+  const telemetryEvent = {
+    eventName: (payload === null || payload === void 0 ? void 0 : payload.Event) ?? TelemetryEvent.FacadeChatSDKEvent,
+    logLevel: logLevel,
+    payload: {
+      ...payload
+    }
+  };
+  BroadcastService.postMessage(telemetryEvent);
 });

package/lib/esm/common/utils.js

@@ -357,7 +357,7 @@ export const isThisSessionPopout = href => {
   return false;
 };
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-export const getConversationDetailsCall = async function (chatSDK) {
+export const getConversationDetailsCall = async function (facadeChatSDK) {
   let liveChatContext = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
   let conversationDetails = undefined; // eslint-disable-line @typescript-eslint/no-explicit-any
   const optionalParams = {}; // eslint-disable-line @typescript-eslint/no-explicit-any
@@ -370,7 +370,7 @@ export const getConversationDetailsCall = async function (chatSDK) {
       Event: TelemetryEvent.GetConversationDetailsCallStarted,
       Description: "Conversation details call started"
     });
-    conversationDetails = await chatSDK.getConversationDetails(optionalParams);
+    conversationDetails = await facadeChatSDK.getConversationDetails(optionalParams);
   } catch (error) {
     checkContactIdError(error);
     TelemetryHelper.logSDKEvent(LogLevel.ERROR, {

package/lib/esm/components/callingcontainerstateful/CallingContainerStateful.js

@@ -4,15 +4,11 @@ import { CallingContainer } from "@microsoft/omnichannel-chat-components";
 import { LiveChatWidgetActionType } from "../../contexts/common/LiveChatWidgetActionType";
 import { TelemetryHelper } from "../../common/telemetry/TelemetryHelper";
 import useChatContextStore from "../../hooks/useChatContextStore";
-import useChatSDKStore from "../../hooks/useChatSDKStore";
+import useFacadeSDKStore from "../../hooks/useFacadeChatSDKStore";
 export const CallingContainerStateful = props => {
   var _props$controlProps, _props$controlProps2, _props$controlProps2$, _props$controlProps3, _props$controlProps3$, _props$controlProps3$2, _props$controlProps4, _props$controlProps4$, _props$controlProps4$2, _props$controlProps5;
-  //TODO : Close button confirmation implmentation is pending
-
   const [state, dispatch] = useChatContextStore();
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const chatSDK = useChatSDKStore();
-
+  const [facadeChatSDK] = useFacadeSDKStore();
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const {
     voiceVideoCallingSdk
@@ -45,7 +41,7 @@ export const CallingContainerStateful = props => {
   useEffect(() => {
     const init = async () => {
       try {
-        var _controlProps$current, _controlProps$current2, _controlProps$current3, _controlProps$current4;
+        var _controlProps$current, _controlProps$current2, _controlProps$current3, _controlProps$current4, _facadeChatSDK$getCha;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         TelemetryHelper.callId = callId;
         await voiceVideoCallingSdk.initialize({
@@ -54,7 +50,7 @@ export const CallingContainerStateful = props => {
           // HTML element id where video stream of the agent will be rendered
           remoteVideoHTMLElementId: (_controlProps$current3 = controlProps.currentCallControlProps) === null || _controlProps$current3 === void 0 ? void 0 : (_controlProps$current4 = _controlProps$current3.nonActionIds) === null || _controlProps$current4 === void 0 ? void 0 : _controlProps$current4.remoteVideoTileId,
           // HTML element id where video stream of the customer will be rendered
-          OCClient: chatSDK === null || chatSDK === void 0 ? void 0 : chatSDK.OCClient
+          OCClient: (_facadeChatSDK$getCha = facadeChatSDK.getChatSDK()) === null || _facadeChatSDK$getCha === void 0 ? void 0 : _facadeChatSDK$getCha.OCClient
         });
       } catch (e) {
         TelemetryHelper.logCallingEvent(LogLevel.ERROR, {

package/lib/esm/components/emailtranscriptpanestateful/EmailTranscriptPaneStateful.js

@@ -8,16 +8,15 @@ import { NotificationHandler } from "../webchatcontainerstateful/webchatcontroll
 import { NotificationScenarios } from "../webchatcontainerstateful/webchatcontroller/enums/NotificationScenarios";
 import { Regex } from "../../common/Constants";
 import { TelemetryHelper } from "../../common/telemetry/TelemetryHelper";
-import useChatContextStore from "../../hooks/useChatContextStore";
-import useChatSDKStore from "../../hooks/useChatSDKStore";
 import { defaultMiddlewareLocalizedTexts } from "../webchatcontainerstateful/common/defaultProps/defaultMiddlewareLocalizedTexts";
+import useChatContextStore from "../../hooks/useChatContextStore";
+import useFacadeSDKStore from "../../hooks/useFacadeChatSDKStore";
 export const EmailTranscriptPaneStateful = props => {
   var _props$controlProps;
   const initialTabIndexMap = new Map();
   let elements = [];
   const [state, dispatch] = useChatContextStore();
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const chatSDK = useChatSDKStore();
+  const [facadeChatSDK] = useFacadeSDKStore();
   const [initialEmail, setInitialEmail] = useState("");
   const closeEmailTranscriptPane = () => {
     dispatch({
@@ -45,7 +44,7 @@ export const EmailTranscriptPaneStateful = props => {
       attachmentMessage: (props === null || props === void 0 ? void 0 : props.attachmentMessage) ?? "The following attachment was uploaded during the conversation:"
     };
     try {
-      await (chatSDK === null || chatSDK === void 0 ? void 0 : chatSDK.emailLiveChatTranscript(chatTranscriptBody, {
+      await (facadeChatSDK === null || facadeChatSDK === void 0 ? void 0 : facadeChatSDK.emailLiveChatTranscript(chatTranscriptBody, {
         liveChatContext
       }));
       NotificationHandler.notifySuccess(NotificationScenarios.EmailAddressSaved, defaultMiddlewareLocalizedTexts === null || defaultMiddlewareLocalizedTexts === void 0 ? void 0 : defaultMiddlewareLocalizedTexts.MIDDLEWARE_BANNER_FILE_EMAIL_ADDRESS_RECORDED_SUCCESS);
@@ -63,7 +62,7 @@ export const EmailTranscriptPaneStateful = props => {
       const message = formatTemplateString(defaultMiddlewareLocalizedTexts.MIDDLEWARE_BANNER_FILE_EMAIL_ADDRESS_RECORDED_ERROR, [email]);
       NotificationHandler.notifyError(NotificationScenarios.EmailTranscriptError, (props === null || props === void 0 ? void 0 : props.bannerMessageOnError) ?? message);
     }
-  }, [props.attachmentMessage, props.bannerMessageOnError, chatSDK, state.domainStates.liveChatContext]);
+  }, [props.attachmentMessage, props.bannerMessageOnError, facadeChatSDK, state.domainStates.liveChatContext]);
   const controlProps = {
     id: "oclcw-emailTranscriptDialogContainer",
     dir: state.domainStates.globalDir,

package/lib/esm/components/footerstateful/FooterStateful.js

@@ -2,6 +2,7 @@ import { LogLevel, TelemetryEvent } from "../../common/telemetry/TelemetryConsta
 import React, { useEffect } from "react";
 import AudioNotificationStateful from "./audionotificationstateful/AudioNotificationStateful";
 import { Constants } from "../../common/Constants";
+import { ConversationState } from "../../contexts/common/ConversationState";
 import { Footer } from "@microsoft/omnichannel-chat-components";
 import { LiveChatWidgetActionType } from "../../contexts/common/LiveChatWidgetActionType";
 import { NewMessageNotificationSoundBase64 } from "../../assets/Audios";
@@ -10,8 +11,7 @@ import { NotificationScenarios } from "../webchatcontainerstateful/webchatcontro
 import { TelemetryHelper } from "../../common/telemetry/TelemetryHelper";
 import { downloadTranscript } from "./downloadtranscriptstateful/DownloadTranscriptStateful";
 import useChatContextStore from "../../hooks/useChatContextStore";
-import useChatSDKStore from "../../hooks/useChatSDKStore";
-import { ConversationState } from "../../contexts/common/ConversationState";
+import useFacadeSDKStore from "../../hooks/useFacadeChatSDKStore";
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export const FooterStateful = props => {
@@ -26,8 +26,7 @@ export const FooterStateful = props => {
     audioNotificationProps,
     hideFooterDisplay
   } = props;
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const chatSDK = useChatSDKStore();
+  const [facadeChatSDK] = useFacadeSDKStore();
   const controlProps = {
     id: "oc-lcw-footer",
     dir: state.domainStates.globalDir,
@@ -37,7 +36,7 @@ export const FooterStateful = props => {
           Event: TelemetryEvent.DownloadTranscriptButtonClicked,
           Description: "Download Transcript button clicked."
         });
-        await downloadTranscript(chatSDK, downloadTranscriptProps, state);
+        await downloadTranscript(facadeChatSDK, downloadTranscriptProps, state);
       } catch (ex) {
         TelemetryHelper.logActionEvent(LogLevel.ERROR, {
           Event: TelemetryEvent.DownloadTranscriptFailed,

package/lib/esm/components/footerstateful/downloadtranscriptstateful/DownloadTranscriptStateful.js

@@ -1,13 +1,13 @@
 import { Constants, TranscriptConstants } from "../../../common/Constants";
-import { NotificationScenarios } from "../../webchatcontainerstateful/webchatcontroller/enums/NotificationScenarios";
+import { LogLevel, TelemetryEvent } from "../../../common/telemetry/TelemetryConstants";
+import { createFileAndDownload, isNullOrUndefined } from "../../../common/utils";
+import DOMPurify from "dompurify";
+import { LiveChatWidgetActionType } from "../../../contexts/common/LiveChatWidgetActionType";
 import { NotificationHandler } from "../../webchatcontainerstateful/webchatcontroller/notification/NotificationHandler";
+import { NotificationScenarios } from "../../webchatcontainerstateful/webchatcontroller/enums/NotificationScenarios";
 import { TelemetryHelper } from "../../../common/telemetry/TelemetryHelper";
-import { LogLevel, TelemetryEvent } from "../../../common/telemetry/TelemetryConstants";
 import createChatTranscript from "../../../plugins/createChatTranscript";
-import DOMPurify from "dompurify";
-import { createFileAndDownload, isNullOrUndefined } from "../../../common/utils";
 import { executeReducer } from "../../../contexts/createReducer";
-import { LiveChatWidgetActionType } from "../../../contexts/common/LiveChatWidgetActionType";
 const processDisplayName = displayName => {
   // if displayname matches "teamsvisitor:<some alphanumeric string>", we replace it with "Customer"
   const displayNameRegex = ".+:.+";
@@ -156,9 +156,7 @@ const beautifyChatTranscripts = (chatTranscripts, renderMarkDown, attachmentMess
   const str = docTypeTag + docStartTag + docMetaTag + bodyStartTag + mainTranscriptSection + beautifiedChats + divEndTag + bodyEndTag + docEndTag;
   return str;
 };
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export const downloadTranscript = async (chatSDK, downloadTranscriptProps, state) => {
+export const downloadTranscript = async (facadeChatSDK, downloadTranscriptProps, state) => {
   var _state$domainStates;
   // Need to keep existing live chat context for scenarios when transcript is downloaded after endchat
   let liveChatContext = state === null || state === void 0 ? void 0 : (_state$domainStates = state.domainStates) === null || _state$domainStates === void 0 ? void 0 : _state$domainStates.liveChatContext;
@@ -169,7 +167,7 @@ export const downloadTranscript = async (chatSDK, downloadTranscriptProps, state
     });
     liveChatContext = inMemoryState.domainStates.liveChatContext;
   }
-  let data = await (chatSDK === null || chatSDK === void 0 ? void 0 : chatSDK.getLiveChatTranscript({
+  let data = await (facadeChatSDK === null || facadeChatSDK === void 0 ? void 0 : facadeChatSDK.getLiveChatTranscript({
     liveChatContext
   }));
   if (typeof data === Constants.String) {
@@ -187,7 +185,7 @@ export const downloadTranscript = async (chatSDK, downloadTranscriptProps, state
       const transcriptOptions = {
         ...webChatTranscript
       };
-      await createChatTranscript(data[Constants.ChatMessagesJson], chatSDK, false, transcriptOptions);
+      await createChatTranscript(data[Constants.ChatMessagesJson], facadeChatSDK, false, transcriptOptions);
     } else {
       // Legacy Transcript
       const chatTranscripts = window.btoa(encodeURIComponent(beautifyChatTranscripts(data[Constants.ChatMessagesJson], renderMarkDown, attachmentMessage)));

package/lib/esm/components/livechatwidget/LiveChatWidget.js

@@ -2,25 +2,48 @@ import React, { useReducer, useState } from "react";
 import { ChatAdapterStore } from "../../contexts/ChatAdapterStore";
 import { ChatContextStore } from "../../contexts/ChatContextStore";
 import { ChatSDKStore } from "../../contexts/ChatSDKStore";
+import { FacadeChatSDK } from "../../common/facades/FacadeChatSDK";
+import { FacadeChatSDKStore } from "../../contexts/FacadeChatSDKStore";
 import LiveChatWidgetStateful from "./livechatwidgetstateful/LiveChatWidgetStateful";
 import { createReducer } from "../../contexts/createReducer";
 import { getLiveChatWidgetContextInitialState } from "../../contexts/common/LiveChatWidgetContextInitialState";
 import { getMockChatSDKIfApplicable } from "./common/getMockChatSDKIfApplicable";
+import { isNullOrUndefined } from "../../common/utils";
 import overridePropsOnMockIfApplicable from "./common/overridePropsOnMockIfApplicable";
 export const LiveChatWidget = props => {
-  var _props$mock;
+  var _props$mock, _props$chatConfig, _props$chatConfig$Liv;
   const reducer = createReducer();
   const [state, dispatch] = useReducer(reducer, getLiveChatWidgetContextInitialState(props));
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const [adapter, setAdapter] = useState(undefined);
+  const [facadeChatSDK, setFacadeChatSDK] = useState(undefined);
   const chatSDK = getMockChatSDKIfApplicable(props.chatSDK, props === null || props === void 0 ? void 0 : (_props$mock = props.mock) === null || _props$mock === void 0 ? void 0 : _props$mock.type);
   overridePropsOnMockIfApplicable(props);
-  return /*#__PURE__*/React.createElement(ChatSDKStore.Provider, {
+  if (!props.chatConfig) {
+    throw new Error("chatConfig is required");
+  }
+
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const isAuthenticatedChat = !!((_props$chatConfig = props.chatConfig) !== null && _props$chatConfig !== void 0 && (_props$chatConfig$Liv = _props$chatConfig.LiveChatConfigAuthSettings) !== null && _props$chatConfig$Liv !== void 0 && _props$chatConfig$Liv.msdyn_javascriptclientfunction);
+  if (!facadeChatSDK) {
+    var _props$mock2;
+    setFacadeChatSDK(new FacadeChatSDK({
+      "chatSDK": chatSDK,
+      "chatConfig": props.chatConfig,
+      "isAuthenticated": isAuthenticatedChat,
+      "getAuthToken": props === null || props === void 0 ? void 0 : props.getAuthToken,
+      //when type is not undefined, it means the SDK is mocked
+      "isSDKMocked": !isNullOrUndefined(props === null || props === void 0 ? void 0 : (_props$mock2 = props.mock) === null || _props$mock2 === void 0 ? void 0 : _props$mock2.type)
+    }));
+  }
+  return /*#__PURE__*/React.createElement(FacadeChatSDKStore.Provider, {
+    value: [facadeChatSDK, setFacadeChatSDK]
+  }, /*#__PURE__*/React.createElement(ChatSDKStore.Provider, {
     value: chatSDK
   }, /*#__PURE__*/React.createElement(ChatAdapterStore.Provider, {
     value: [adapter, setAdapter]
   }, /*#__PURE__*/React.createElement(ChatContextStore.Provider, {
     value: [state, dispatch]
-  }, /*#__PURE__*/React.createElement(LiveChatWidgetStateful, props))));
+  }, /*#__PURE__*/React.createElement(LiveChatWidgetStateful, props)))));
 };
 export default LiveChatWidget;

package/lib/esm/components/livechatwidget/common/authHelper.js

@@ -1,7 +1,7 @@
 import { LogLevel, TelemetryEvent } from "../../../common/telemetry/TelemetryConstants";
 import { TelemetryHelper } from "../../../common/telemetry/TelemetryHelper";
-import { isNullOrEmptyString } from "../../../common/utils";
 import { WidgetLoadCustomErrorString } from "../../../common/Constants";
+import { isNullOrEmptyString } from "../../../common/utils";
 const getAuthClientFunction = chatConfig => {
   let authClientFunction = undefined;
   if (chatConfig !== null && chatConfig !== void 0 && chatConfig.LiveChatConfigAuthSettings) {
@@ -10,8 +10,6 @@ const getAuthClientFunction = chatConfig => {
   }
   return authClientFunction;
 };
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
 const handleAuthentication = async (chatSDK, chatConfig, getAuthToken) => {
   const authClientFunction = getAuthClientFunction(chatConfig);
   if (getAuthToken && authClientFunction) {
@@ -24,7 +22,10 @@ const handleAuthentication = async (chatSDK, chatConfig, getAuthToken) => {
       chatSDK.setAuthTokenProvider(async () => {
         return token;
       });
-      return true;
+      return {
+        "result": true,
+        "token": token
+      };
     } else {
       // instead of returning false, it's more appropiate to thrown an error to force error handling on the caller side
       // this will help to avoid the error to be ignored and the chat to be started
@@ -34,7 +35,15 @@ const handleAuthentication = async (chatSDK, chatConfig, getAuthToken) => {
       throw new Error(WidgetLoadCustomErrorString.AuthenticationFailedErrorString);
     }
   }
-  return false;
+  return {
+    "result": false,
+    "token": null,
+    "error": {
+      "message": "No auth client function or getAuthToken function provided",
+      "getAuthTokenPresent": getAuthToken ? true : false,
+      "authClientFunctionPresent": authClientFunction ? true : false
+    }
+  };
 };
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any

package/lib/esm/components/livechatwidget/common/createAdapter.js

@@ -1,18 +1,17 @@
+import { BotAuthActivitySubscriber } from "./ActivitySubscriber/BotAuthActivitySubscriber";
+import { ChatAdapterShim } from "./ChatAdapterShim";
+import { HiddenAdaptiveCardActivitySubscriber } from "./ActivitySubscriber/HiddenAdaptiveCardActivitySubscriber";
+import { MockChatSDK } from "../../webchatcontainerstateful/common/mockchatsdk";
 import { NotificationHandler } from "../../webchatcontainerstateful/webchatcontroller/notification/NotificationHandler";
 import { NotificationLevel } from "../../webchatcontainerstateful/webchatcontroller/enums/NotificationLevel";
 import { NotificationScenarios } from "../../webchatcontainerstateful/webchatcontroller/enums/NotificationScenarios";
-import { defaultMiddlewareLocalizedTexts } from "../../webchatcontainerstateful/common/defaultProps/defaultMiddlewareLocalizedTexts";
-import { ChatAdapterShim } from "./ChatAdapterShim";
 import { PauseActivitySubscriber } from "./ActivitySubscriber/PauseActivitySubscriber";
-import { BotAuthActivitySubscriber } from "./ActivitySubscriber/BotAuthActivitySubscriber";
-import { HiddenAdaptiveCardActivitySubscriber } from "./ActivitySubscriber/HiddenAdaptiveCardActivitySubscriber";
+import { defaultMiddlewareLocalizedTexts } from "../../webchatcontainerstateful/common/defaultProps/defaultMiddlewareLocalizedTexts";
 const defaultBotAuthConfig = {
   fetchBotAuthConfigRetries: 3,
   fetchBotAuthConfigRetryInterval: 1000
 };
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export const createAdapter = async (chatSDK, props) => {
+export const createAdapter = async (facadeChatSDK, props) => {
   const chatAdapterOptionalParams = {
     IC3Adapter: {
       options: {
@@ -35,9 +34,10 @@ export const createAdapter = async (chatSDK, props) => {
       }
     }
   };
-  let adapter = await chatSDK.createChatAdapter(chatAdapterOptionalParams);
+  let adapter = await facadeChatSDK.createChatAdapter(chatAdapterOptionalParams);
   //so far, there is no need to convert to the shim adapter when using visual tests
-  if (chatSDK.isMockModeOn !== true) {
+  const isMocked = facadeChatSDK.getChatSDK() instanceof MockChatSDK;
+  if (isMocked !== true) {
     var _props$webChatContain, _props$webChatContain2, _props$webChatContain3, _props$webChatContain4;
     const botAuthActivitySubscriberOptionalParams = {
       fetchBotAuthConfigRetries: (props === null || props === void 0 ? void 0 : (_props$webChatContain = props.webChatContainerProps) === null || _props$webChatContain === void 0 ? void 0 : (_props$webChatContain2 = _props$webChatContain.botAuthConfig) === null || _props$webChatContain2 === void 0 ? void 0 : _props$webChatContain2.fetchBotAuthConfigRetries) || defaultBotAuthConfig.fetchBotAuthConfigRetries,