@microsoft/omnichannel-chat-widget 1.5.1-main.c3533cf → 1.5.1-main.ee4453c

package/lib/cjs/components/livechatwidget/common/startChatErrorHandler.spec.js

@@ -0,0 +1,282 @@
+"use strict";
+
+var _omnichannelChatComponents = require("@microsoft/omnichannel-chat-components");
+var _TelemetryHelper = require("../../../common/telemetry/TelemetryHelper");
+var _startChatErrorHandler = require("./startChatErrorHandler");
+var _Constants = require("../../../common/Constants");
+var _omnichannelChatSdk = require("@microsoft/omnichannel-chat-sdk");
+var _LiveChatWidgetActionType = require("../../../contexts/common/LiveChatWidgetActionType");
+var _ConversationState = require("../../../contexts/common/ConversationState");
+describe("startChatErrorHandler unit test", () => {
+  it("handleStartChatError should log failed event and return if exception is undefined", () => {
+    const dispatch = jest.fn();
+    spyOn(_omnichannelChatComponents.BroadcastService, "postMessage").and.callFake(() => false);
+    spyOn(_TelemetryHelper.TelemetryHelper, "logLoadingEvent").and.callFake(() => false);
+    (0, _startChatErrorHandler.handleStartChatError)(dispatch, {}, {}, undefined, false);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledTimes(1);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledWith("ERROR", expect.objectContaining({
+      ExceptionDetails: expect.objectContaining({
+        Exception: "Widget load complete with error: undefined"
+      })
+    }));
+    expect(dispatch).not.toHaveBeenCalled();
+  });
+  it("handleStartChatError should log failed with error event for AuthenticationFailedErrorString", () => {
+    const dispatch = jest.fn();
+    const mockEx = new Error(_Constants.WidgetLoadCustomErrorString.AuthenticationFailedErrorString);
+    spyOn(_omnichannelChatComponents.BroadcastService, "postMessage").and.callFake(() => false);
+    spyOn(_TelemetryHelper.TelemetryHelper, "logLoadingEvent").and.callFake(() => false);
+    (0, _startChatErrorHandler.handleStartChatError)(dispatch, {}, {}, mockEx, false);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledTimes(2);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledWith("WARN", expect.objectContaining({
+      ExceptionDetails: expect.objectContaining({
+        Exception: `Widget load complete with error: Error: ${_Constants.WidgetLoadCustomErrorString.AuthenticationFailedErrorString}`
+      })
+    }));
+    expect(dispatch).toHaveBeenCalledTimes(2);
+    expect(dispatch).toHaveBeenCalledWith(expect.objectContaining({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE
+    }));
+  });
+  it("handleStartChatError should log failed with error event for NetworkErrorString", () => {
+    const dispatch = jest.fn();
+    const mockEx = new Error(_Constants.WidgetLoadCustomErrorString.NetworkErrorString);
+    spyOn(_omnichannelChatComponents.BroadcastService, "postMessage").and.callFake(() => false);
+    spyOn(_TelemetryHelper.TelemetryHelper, "logLoadingEvent").and.callFake(() => false);
+    (0, _startChatErrorHandler.handleStartChatError)(dispatch, {}, {}, mockEx, false);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledTimes(2);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledWith("WARN", expect.objectContaining({
+      ExceptionDetails: expect.objectContaining({
+        Exception: `Widget load complete with error: Error: ${_Constants.WidgetLoadCustomErrorString.NetworkErrorString}`
+      })
+    }));
+    expect(dispatch).toHaveBeenCalledTimes(2);
+    expect(dispatch).toHaveBeenCalledWith(expect.objectContaining({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE
+    }));
+  });
+  it("handleStartChatError should log complete event for WidgetUseOutsideOperatingHour", () => {
+    const dispatch = jest.fn();
+    const mockEx = new _omnichannelChatSdk.ChatSDKError(_omnichannelChatSdk.ChatSDKErrorName.WidgetUseOutsideOperatingHour);
+    spyOn(_omnichannelChatComponents.BroadcastService, "postMessage").and.callFake(() => false);
+    spyOn(_TelemetryHelper.TelemetryHelper, "logLoadingEvent").and.callFake(() => false);
+    (0, _startChatErrorHandler.handleStartChatError)(dispatch, {}, {}, mockEx, false);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledTimes(1);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledWith("INFO", expect.objectContaining({
+      Description: `Widget load complete. ${_Constants.WidgetLoadTelemetryMessage.OOOHMessage}`
+    }));
+    expect(dispatch).toHaveBeenCalledTimes(2);
+    expect(dispatch).toHaveBeenCalledWith(expect.objectContaining({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE
+    }));
+    expect(dispatch).toHaveBeenCalledWith(expect.objectContaining({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_OUTSIDE_OPERATING_HOURS
+    }));
+  });
+  it("handleStartChatError should log failed with error event for PersistentChatConversationRetrievalFailure for non-400 status", () => {
+    const dispatch = jest.fn();
+    const mockEx = new _omnichannelChatSdk.ChatSDKError(_omnichannelChatSdk.ChatSDKErrorName.PersistentChatConversationRetrievalFailure, 429);
+    spyOn(_omnichannelChatComponents.BroadcastService, "postMessage").and.callFake(() => false);
+    spyOn(_TelemetryHelper.TelemetryHelper, "logLoadingEvent").and.callFake(() => false);
+    (0, _startChatErrorHandler.handleStartChatError)(dispatch, {}, {}, mockEx, false);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledTimes(2);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledWith("WARN", expect.objectContaining({
+      Description: "Widget load complete with error",
+      ExceptionDetails: expect.objectContaining({
+        Exception: `Widget load complete with error: ${_omnichannelChatSdk.ChatSDKErrorName.PersistentChatConversationRetrievalFailure}`,
+        HttpResponseStatusCode: 429
+      })
+    }));
+    expect(dispatch).toHaveBeenCalledTimes(2);
+    expect(dispatch).toHaveBeenCalledWith(expect.objectContaining({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE
+    }));
+  });
+  it("handleStartChatError should log failed event for PersistentChatConversationRetrievalFailure for 400 status", () => {
+    const dispatch = jest.fn();
+    const mockEx = new _omnichannelChatSdk.ChatSDKError(_omnichannelChatSdk.ChatSDKErrorName.PersistentChatConversationRetrievalFailure, 400);
+    spyOn(_omnichannelChatComponents.BroadcastService, "postMessage").and.callFake(() => false);
+    spyOn(_TelemetryHelper.TelemetryHelper, "logLoadingEvent").and.callFake(() => false);
+    (0, _startChatErrorHandler.handleStartChatError)(dispatch, {}, {}, mockEx, false);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledTimes(2);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledWith("ERROR", expect.objectContaining({
+      ExceptionDetails: expect.objectContaining({
+        Exception: `Widget load complete with error: ${_omnichannelChatSdk.ChatSDKErrorName.PersistentChatConversationRetrievalFailure}`,
+        HttpResponseStatusCode: 400
+      })
+    }));
+    expect(dispatch).toHaveBeenCalledTimes(2);
+    expect(dispatch).toHaveBeenCalledWith(expect.objectContaining({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE
+    }));
+  });
+  it("handleStartChatError should log failed with error event for ConversationInitializationFailure for non-400 status", () => {
+    const dispatch = jest.fn();
+    const mockEx = new _omnichannelChatSdk.ChatSDKError(_omnichannelChatSdk.ChatSDKErrorName.ConversationInitializationFailure, 429);
+    spyOn(_omnichannelChatComponents.BroadcastService, "postMessage").and.callFake(() => false);
+    spyOn(_TelemetryHelper.TelemetryHelper, "logLoadingEvent").and.callFake(() => false);
+    (0, _startChatErrorHandler.handleStartChatError)(dispatch, {}, {}, mockEx, false);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledTimes(2);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledWith("WARN", expect.objectContaining({
+      Description: "Widget load complete with error",
+      ExceptionDetails: expect.objectContaining({
+        Exception: `Widget load complete with error: ${_omnichannelChatSdk.ChatSDKErrorName.ConversationInitializationFailure}`,
+        HttpResponseStatusCode: 429
+      })
+    }));
+    expect(dispatch).toHaveBeenCalledTimes(2);
+    expect(dispatch).toHaveBeenCalledWith(expect.objectContaining({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE
+    }));
+  });
+  it("handleStartChatError should log failed event for ConversationInitializationFailure for 400 status", () => {
+    const dispatch = jest.fn();
+    const mockEx = new _omnichannelChatSdk.ChatSDKError(_omnichannelChatSdk.ChatSDKErrorName.ConversationInitializationFailure, 400);
+    spyOn(_omnichannelChatComponents.BroadcastService, "postMessage").and.callFake(() => false);
+    spyOn(_TelemetryHelper.TelemetryHelper, "logLoadingEvent").and.callFake(() => false);
+    (0, _startChatErrorHandler.handleStartChatError)(dispatch, {}, {}, mockEx, false);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledTimes(2);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledWith("ERROR", expect.objectContaining({
+      ExceptionDetails: expect.objectContaining({
+        Exception: `Widget load complete with error: ${_omnichannelChatSdk.ChatSDKErrorName.ConversationInitializationFailure}`,
+        HttpResponseStatusCode: 400
+      })
+    }));
+    expect(dispatch).toHaveBeenCalledTimes(2);
+    expect(dispatch).toHaveBeenCalledWith(expect.objectContaining({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE
+    }));
+  });
+  it("handleStartChatError should log failed with error event for ChatTokenRetrievalFailure for non-400 status", () => {
+    const dispatch = jest.fn();
+    const mockEx = new _omnichannelChatSdk.ChatSDKError(_omnichannelChatSdk.ChatSDKErrorName.ChatTokenRetrievalFailure, 429);
+    spyOn(_omnichannelChatComponents.BroadcastService, "postMessage").and.callFake(() => false);
+    spyOn(_TelemetryHelper.TelemetryHelper, "logLoadingEvent").and.callFake(() => false);
+    (0, _startChatErrorHandler.handleStartChatError)(dispatch, {}, {}, mockEx, false);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledTimes(2);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledWith("WARN", expect.objectContaining({
+      Description: "Widget load complete with error",
+      ExceptionDetails: expect.objectContaining({
+        Exception: `Widget load complete with error: ${_omnichannelChatSdk.ChatSDKErrorName.ChatTokenRetrievalFailure}`,
+        HttpResponseStatusCode: 429
+      })
+    }));
+    expect(dispatch).toHaveBeenCalledTimes(2);
+    expect(dispatch).toHaveBeenCalledWith(expect.objectContaining({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE
+    }));
+  });
+  it("handleStartChatError should log failed event for ChatTokenRetrievalFailure for 400 status", () => {
+    const dispatch = jest.fn();
+    const mockEx = new _omnichannelChatSdk.ChatSDKError(_omnichannelChatSdk.ChatSDKErrorName.ChatTokenRetrievalFailure, 400);
+    spyOn(_omnichannelChatComponents.BroadcastService, "postMessage").and.callFake(() => false);
+    spyOn(_TelemetryHelper.TelemetryHelper, "logLoadingEvent").and.callFake(() => false);
+    (0, _startChatErrorHandler.handleStartChatError)(dispatch, {}, {}, mockEx, false);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledTimes(2);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledWith("ERROR", expect.objectContaining({
+      ExceptionDetails: expect.objectContaining({
+        Exception: `Widget load complete with error: ${_omnichannelChatSdk.ChatSDKErrorName.ChatTokenRetrievalFailure}`,
+        HttpResponseStatusCode: 400
+      })
+    }));
+    expect(dispatch).toHaveBeenCalledTimes(2);
+    expect(dispatch).toHaveBeenCalledWith(expect.objectContaining({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE
+    }));
+  });
+  it("handleStartChatError should log failed with error event for UninitializedChatSDK", () => {
+    const dispatch = jest.fn();
+    const mockEx = new _omnichannelChatSdk.ChatSDKError(_omnichannelChatSdk.ChatSDKErrorName.UninitializedChatSDK);
+    spyOn(_omnichannelChatComponents.BroadcastService, "postMessage").and.callFake(() => false);
+    spyOn(_TelemetryHelper.TelemetryHelper, "logLoadingEvent").and.callFake(() => false);
+    (0, _startChatErrorHandler.handleStartChatError)(dispatch, {}, {}, mockEx, false);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledTimes(2);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledWith("WARN", expect.objectContaining({
+      Description: "Widget load complete with error",
+      ExceptionDetails: expect.objectContaining({
+        Exception: `Widget load complete with error: ${_omnichannelChatSdk.ChatSDKErrorName.UninitializedChatSDK}`
+      })
+    }));
+    expect(dispatch).toHaveBeenCalledTimes(2);
+    expect(dispatch).toHaveBeenCalledWith(expect.objectContaining({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE
+    }));
+  });
+  it("handleStartChatError should log failed with error event for InvalidConversation", () => {
+    const dispatch = jest.fn();
+    const mockEx = new _omnichannelChatSdk.ChatSDKError(_omnichannelChatSdk.ChatSDKErrorName.InvalidConversation);
+    spyOn(_omnichannelChatComponents.BroadcastService, "postMessage").and.callFake(() => false);
+    spyOn(_TelemetryHelper.TelemetryHelper, "logLoadingEvent").and.callFake(() => false);
+    (0, _startChatErrorHandler.handleStartChatError)(dispatch, {}, {}, mockEx, false);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledTimes(1);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledWith("WARN", expect.objectContaining({
+      Description: "Widget load complete with error",
+      ExceptionDetails: expect.objectContaining({
+        Exception: `Widget load complete with error: ${_omnichannelChatSdk.ChatSDKErrorName.InvalidConversation}`
+      })
+    }));
+    expect(dispatch).toHaveBeenCalledTimes(16);
+    expect(dispatch).toHaveBeenCalledWith(expect.objectContaining({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
+      payload: _ConversationState.ConversationState.Closed
+    }));
+  });
+  it("handleStartChatError should log failed with error event for ClosedConversation", () => {
+    const dispatch = jest.fn();
+    const mockEx = new _omnichannelChatSdk.ChatSDKError(_omnichannelChatSdk.ChatSDKErrorName.ClosedConversation);
+    spyOn(_omnichannelChatComponents.BroadcastService, "postMessage").and.callFake(() => false);
+    spyOn(_TelemetryHelper.TelemetryHelper, "logLoadingEvent").and.callFake(() => false);
+    (0, _startChatErrorHandler.handleStartChatError)(dispatch, {}, {}, mockEx, false);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledTimes(1);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledWith("WARN", expect.objectContaining({
+      Description: "Widget load complete with error",
+      ExceptionDetails: expect.objectContaining({
+        Exception: `Widget load complete with error: ${_omnichannelChatSdk.ChatSDKErrorName.ClosedConversation}`
+      })
+    }));
+    expect(dispatch).toHaveBeenCalledTimes(16);
+    expect(dispatch).toHaveBeenCalledWith(expect.objectContaining({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
+      payload: _ConversationState.ConversationState.Closed
+    }));
+  });
+  it("handleStartChatError should log failed event for any other errors", () => {
+    const dispatch = jest.fn();
+    const mockEx = new _omnichannelChatSdk.ChatSDKError(_omnichannelChatSdk.ChatSDKErrorName.ScriptLoadFailure, 405);
+    spyOn(_omnichannelChatComponents.BroadcastService, "postMessage").and.callFake(() => false);
+    spyOn(_TelemetryHelper.TelemetryHelper, "logLoadingEvent").and.callFake(() => false);
+    (0, _startChatErrorHandler.handleStartChatError)(dispatch, {}, {}, mockEx, false);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledTimes(2);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledWith("ERROR", expect.objectContaining({
+      ExceptionDetails: expect.objectContaining({
+        Exception: `Widget load complete with error: ${_omnichannelChatSdk.ChatSDKErrorName.ScriptLoadFailure}`,
+        HttpResponseStatusCode: 405
+      })
+    }));
+    expect(dispatch).toHaveBeenCalledTimes(2);
+    expect(dispatch).toHaveBeenCalledWith(expect.objectContaining({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE
+    }));
+  });
+  it("handleStartChatError should force end chat if isStartChatSuccessful is true", () => {
+    const dispatch = jest.fn();
+    const mockEx = new _omnichannelChatSdk.ChatSDKError(_omnichannelChatSdk.ChatSDKErrorName.ScriptLoadFailure, 405);
+    const mockSDK = {
+      endChat: jest.fn()
+    };
+    spyOn(_omnichannelChatComponents.BroadcastService, "postMessage").and.callFake(() => false);
+    spyOn(_TelemetryHelper.TelemetryHelper, "logLoadingEvent").and.callFake(() => false);
+    (0, _startChatErrorHandler.handleStartChatError)(dispatch, mockSDK, {}, mockEx, true);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledTimes(3);
+    expect(_TelemetryHelper.TelemetryHelper.logLoadingEvent).toHaveBeenCalledWith("ERROR", expect.objectContaining({
+      ExceptionDetails: expect.objectContaining({
+        Exception: "SessionInit was successful, but widget load failed."
+      })
+    }));
+    expect(dispatch).toHaveBeenCalledTimes(2);
+    expect(dispatch).toHaveBeenCalledWith(expect.objectContaining({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE
+    }));
+    expect(mockSDK.endChat).toHaveBeenCalled();
+  });
+});

package/lib/cjs/components/livechatwidget/livechatwidgetstateful/LiveChatWidgetStateful.js

@@ -55,13 +55,13 @@ var _useChatAdapterStore = _interopRequireDefault(require("../../../hooks/useCha
 var _useChatContextStore = _interopRequireDefault(require("../../../hooks/useChatContextStore"));
 var _useChatSDKStore = _interopRequireDefault(require("../../../hooks/useChatSDKStore"));
 var _defaultAdaptiveCardStyles = require("../../webchatcontainerstateful/common/defaultStyles/defaultAdaptiveCardStyles");
-var _omnichannelChatSdk = require("@microsoft/omnichannel-chat-sdk");
+var _StartChatErrorPaneStateful = _interopRequireDefault(require("../../startchaterrorpanestateful/StartChatErrorPaneStateful"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 const LiveChatWidgetStateful = props => {
-  var _props$webChatContain, _props$styleProps, _props$controlProps, _props$controlProps3, _state$appStates7, _props$webChatContain5, _state$appStates14, _props$webChatContain6, _props$controlProps12, _props$draggableChatW, _props$draggableChatW2, _props$draggableChatW3, _props$draggableChatW4, _props$draggableChatW5, _props$webChatContain7, _props$webChatContain8, _props$webChatContain9, _props$webChatContain10, _livechatProps$webCha, _livechatProps$styleP, _livechatProps$contro, _livechatProps$contro2, _livechatProps$compon, _livechatProps$contro3, _livechatProps$compon2, _livechatProps$contro4, _livechatProps$compon3, _livechatProps$contro5, _livechatProps$compon4, _livechatProps$contro6, _livechatProps$compon5, _livechatProps$contro7, _livechatProps$compon6, _livechatProps$contro8, _livechatProps$compon7, _livechatProps$contro9, _livechatProps$contro10, _livechatProps$compon8, _livechatProps$contro11, _livechatProps$compon9, _livechatProps$contro12, _livechatProps$compon10, _livechatProps$compon11, _livechatProps$compon12;
+  var _props$webChatContain, _props$styleProps, _props$controlProps, _props$controlProps3, _state$appStates7, _props$webChatContain5, _state$appStates14, _props$webChatContain6, _props$controlProps12, _props$draggableChatW, _props$draggableChatW2, _props$draggableChatW3, _props$draggableChatW4, _props$draggableChatW5, _props$webChatContain7, _props$webChatContain8, _props$webChatContain9, _props$webChatContain10, _livechatProps$webCha, _livechatProps$styleP, _livechatProps$contro, _livechatProps$contro2, _livechatProps$compon, _livechatProps$contro3, _livechatProps$compon2, _livechatProps$contro4, _livechatProps$compon3, _livechatProps$contro5, _livechatProps$compon4, _livechatProps$contro6, _livechatProps$compon5, _livechatProps$contro7, _livechatProps$compon6, _livechatProps$contro8, _livechatProps$compon7, _livechatProps$contro9, _livechatProps$compon8, _livechatProps$contro10, _livechatProps$contro11, _livechatProps$compon9, _livechatProps$contro12, _livechatProps$compon10, _livechatProps$contro13, _livechatProps$compon11, _livechatProps$compon12, _livechatProps$compon13;
   const [state, dispatch] = (0, _useChatContextStore.default)();
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const [adapter, setAdapter] = (0, _useChatAdapterStore.default)();
@@ -194,6 +194,10 @@ const LiveChatWidgetStateful = props => {
   };
   (0, _react2.useEffect)(() => {
     var _props$controlProps5, _props$controlProps6, _props$controlProps7, _props$chatConfig, _props$chatConfig$Liv, _props$controlProps9, _props$chatConfig2, _props$chatConfig2$Ch, _state$appStates5;
+    dispatch({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_START_CHAT_FAILING,
+      payload: false
+    });
     state.domainStates.confirmationPaneConfirmedOptionClicked = false;
     state.domainStates.confirmationState = _Constants.ConfirmationState.NotSet;
     setupClientDataStore();
@@ -433,12 +437,7 @@ const LiveChatWidgetStateful = props => {
       if ((msg === null || msg === void 0 ? void 0 : (_msg$payload9 = msg.payload) === null || _msg$payload9 === void 0 ? void 0 : _msg$payload9.runtimeId) !== _TelemetryManager.TelemetryManager.InternalTelemetryData.lcwRuntimeId) {
         (0, _endChat.endChat)(props, chatSDK, state, dispatch, setAdapter, setWebChatStyles, adapter, true, false, false);
         (0, _endChat.endChatStateCleanUp)(dispatch);
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        chatSDK.requestId = (0, _omnichannelChatSdk.uuidv4)();
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        chatSDK.chatToken = {};
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        chatSDK.reconnectId = null;
+        (0, _endChat.chatSDKStateCleanUp)(chatSDK);
         return;
       }
     });
@@ -713,18 +712,18 @@ const LiveChatWidgetStateful = props => {
   }, headerDraggableConfig))), !((_livechatProps$contro5 = livechatProps.controlProps) !== null && _livechatProps$contro5 !== void 0 && _livechatProps$contro5.hideLoadingPane) && (0, _componentController.shouldShowLoadingPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon4 = livechatProps.componentOverrides) === null || _livechatProps$compon4 === void 0 ? void 0 : _livechatProps$compon4.loadingPane) || /*#__PURE__*/_react2.default.createElement(_LoadingPaneStateful.default, {
     loadingPaneProps: livechatProps.loadingPaneProps,
     startChatErrorPaneProps: livechatProps.startChatErrorPaneProps
-  })), !((_livechatProps$contro6 = livechatProps.controlProps) !== null && _livechatProps$contro6 !== void 0 && _livechatProps$contro6.hideOutOfOfficeHoursPane) && (0, _componentController.shouldShowOutOfOfficeHoursPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon5 = livechatProps.componentOverrides) === null || _livechatProps$compon5 === void 0 ? void 0 : _livechatProps$compon5.outOfOfficeHoursPane) || /*#__PURE__*/_react2.default.createElement(_OOOHPaneStateful.default, livechatProps.outOfOfficeHoursPaneProps)), !((_livechatProps$contro7 = livechatProps.controlProps) !== null && _livechatProps$contro7 !== void 0 && _livechatProps$contro7.hideReconnectChatPane) && (0, _componentController.shouldShowReconnectChatPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon6 = livechatProps.componentOverrides) === null || _livechatProps$compon6 === void 0 ? void 0 : _livechatProps$compon6.reconnectChatPane) || /*#__PURE__*/_react2.default.createElement(_ReconnectChatPaneStateful.default, {
+  })), !((_livechatProps$contro6 = livechatProps.controlProps) !== null && _livechatProps$contro6 !== void 0 && _livechatProps$contro6.hideErrorUIPane) && (0, _componentController.shouldShowStartChatErrorPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon5 = livechatProps.componentOverrides) === null || _livechatProps$compon5 === void 0 ? void 0 : _livechatProps$compon5.startChatErrorPane) || /*#__PURE__*/_react2.default.createElement(_StartChatErrorPaneStateful.default, livechatProps.startChatErrorPaneProps)), !((_livechatProps$contro7 = livechatProps.controlProps) !== null && _livechatProps$contro7 !== void 0 && _livechatProps$contro7.hideOutOfOfficeHoursPane) && (0, _componentController.shouldShowOutOfOfficeHoursPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon6 = livechatProps.componentOverrides) === null || _livechatProps$compon6 === void 0 ? void 0 : _livechatProps$compon6.outOfOfficeHoursPane) || /*#__PURE__*/_react2.default.createElement(_OOOHPaneStateful.default, livechatProps.outOfOfficeHoursPaneProps)), !((_livechatProps$contro8 = livechatProps.controlProps) !== null && _livechatProps$contro8 !== void 0 && _livechatProps$contro8.hideReconnectChatPane) && (0, _componentController.shouldShowReconnectChatPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon7 = livechatProps.componentOverrides) === null || _livechatProps$compon7 === void 0 ? void 0 : _livechatProps$compon7.reconnectChatPane) || /*#__PURE__*/_react2.default.createElement(_ReconnectChatPaneStateful.default, {
     reconnectChatProps: livechatProps.reconnectChatPaneProps,
     initStartChat: initStartChatRelay
-  })), !((_livechatProps$contro8 = livechatProps.controlProps) !== null && _livechatProps$contro8 !== void 0 && _livechatProps$contro8.hidePreChatSurveyPane) && (0, _componentController.shouldShowPreChatSurveyPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon7 = livechatProps.componentOverrides) === null || _livechatProps$compon7 === void 0 ? void 0 : _livechatProps$compon7.preChatSurveyPane) || /*#__PURE__*/_react2.default.createElement(_PreChatSurveyPaneStateful.default, {
+  })), !((_livechatProps$contro9 = livechatProps.controlProps) !== null && _livechatProps$contro9 !== void 0 && _livechatProps$contro9.hidePreChatSurveyPane) && (0, _componentController.shouldShowPreChatSurveyPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon8 = livechatProps.componentOverrides) === null || _livechatProps$compon8 === void 0 ? void 0 : _livechatProps$compon8.preChatSurveyPane) || /*#__PURE__*/_react2.default.createElement(_PreChatSurveyPaneStateful.default, {
     surveyProps: livechatProps.preChatSurveyPaneProps,
     initStartChat: initStartChatRelay
-  })), !((_livechatProps$contro9 = livechatProps.controlProps) !== null && _livechatProps$contro9 !== void 0 && _livechatProps$contro9.hideCallingContainer) && (0, _componentController.shouldShowCallingContainer)(state) && /*#__PURE__*/_react2.default.createElement(_CallingContainerStateful.default, _extends({
+  })), !((_livechatProps$contro10 = livechatProps.controlProps) !== null && _livechatProps$contro10 !== void 0 && _livechatProps$contro10.hideCallingContainer) && (0, _componentController.shouldShowCallingContainer)(state) && /*#__PURE__*/_react2.default.createElement(_CallingContainerStateful.default, _extends({
     voiceVideoCallingSdk: voiceVideoCallingSDK
-  }, livechatProps.callingContainerProps)), !((_livechatProps$contro10 = livechatProps.controlProps) !== null && _livechatProps$contro10 !== void 0 && _livechatProps$contro10.hideWebChatContainer) && (0, _componentController.shouldShowWebChatContainer)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon8 = livechatProps.componentOverrides) === null || _livechatProps$compon8 === void 0 ? void 0 : _livechatProps$compon8.webChatContainer) || /*#__PURE__*/_react2.default.createElement(_WebChatContainerStateful.default, livechatProps)), !((_livechatProps$contro11 = livechatProps.controlProps) !== null && _livechatProps$contro11 !== void 0 && _livechatProps$contro11.hideConfirmationPane) && (0, _componentController.shouldShowConfirmationPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon9 = livechatProps.componentOverrides) === null || _livechatProps$compon9 === void 0 ? void 0 : _livechatProps$compon9.confirmationPane) || /*#__PURE__*/_react2.default.createElement(_ConfirmationPaneStateful.default, _extends({}, confirmationPaneProps, {
+  }, livechatProps.callingContainerProps)), !((_livechatProps$contro11 = livechatProps.controlProps) !== null && _livechatProps$contro11 !== void 0 && _livechatProps$contro11.hideWebChatContainer) && (0, _componentController.shouldShowWebChatContainer)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon9 = livechatProps.componentOverrides) === null || _livechatProps$compon9 === void 0 ? void 0 : _livechatProps$compon9.webChatContainer) || /*#__PURE__*/_react2.default.createElement(_WebChatContainerStateful.default, livechatProps)), !((_livechatProps$contro12 = livechatProps.controlProps) !== null && _livechatProps$contro12 !== void 0 && _livechatProps$contro12.hideConfirmationPane) && (0, _componentController.shouldShowConfirmationPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon10 = livechatProps.componentOverrides) === null || _livechatProps$compon10 === void 0 ? void 0 : _livechatProps$compon10.confirmationPane) || /*#__PURE__*/_react2.default.createElement(_ConfirmationPaneStateful.default, _extends({}, confirmationPaneProps, {
     setPostChatContext: setPostChatContextRelay,
     prepareEndChat: prepareEndChatRelay
-  }))), !((_livechatProps$contro12 = livechatProps.controlProps) !== null && _livechatProps$contro12 !== void 0 && _livechatProps$contro12.hidePostChatLoadingPane) && (0, _componentController.shouldShowPostChatLoadingPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon10 = livechatProps.componentOverrides) === null || _livechatProps$compon10 === void 0 ? void 0 : _livechatProps$compon10.postChatLoadingPane) || /*#__PURE__*/_react2.default.createElement(_PostChatLoadingPaneStateful.default, livechatProps.postChatLoadingPaneProps)), (0, _componentController.shouldShowPostChatSurveyPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon11 = livechatProps.componentOverrides) === null || _livechatProps$compon11 === void 0 ? void 0 : _livechatProps$compon11.postChatSurveyPane) || /*#__PURE__*/_react2.default.createElement(_PostChatSurveyPaneStateful.default, _extends({}, livechatProps.postChatSurveyPaneProps, livechatProps.chatSDK))), (0, _createFooter.createFooter)(livechatProps, state), (0, _componentController.shouldShowEmailTranscriptPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon12 = livechatProps.componentOverrides) === null || _livechatProps$compon12 === void 0 ? void 0 : _livechatProps$compon12.emailTranscriptPane) || /*#__PURE__*/_react2.default.createElement(_EmailTranscriptPaneStateful.default, livechatProps.emailTranscriptPane))))));
+  }))), !((_livechatProps$contro13 = livechatProps.controlProps) !== null && _livechatProps$contro13 !== void 0 && _livechatProps$contro13.hidePostChatLoadingPane) && (0, _componentController.shouldShowPostChatLoadingPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon11 = livechatProps.componentOverrides) === null || _livechatProps$compon11 === void 0 ? void 0 : _livechatProps$compon11.postChatLoadingPane) || /*#__PURE__*/_react2.default.createElement(_PostChatLoadingPaneStateful.default, livechatProps.postChatLoadingPaneProps)), (0, _componentController.shouldShowPostChatSurveyPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon12 = livechatProps.componentOverrides) === null || _livechatProps$compon12 === void 0 ? void 0 : _livechatProps$compon12.postChatSurveyPane) || /*#__PURE__*/_react2.default.createElement(_PostChatSurveyPaneStateful.default, _extends({}, livechatProps.postChatSurveyPaneProps, livechatProps.chatSDK))), (0, _createFooter.createFooter)(livechatProps, state), (0, _componentController.shouldShowEmailTranscriptPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_livechatProps$compon13 = livechatProps.componentOverrides) === null || _livechatProps$compon13 === void 0 ? void 0 : _livechatProps$compon13.emailTranscriptPane) || /*#__PURE__*/_react2.default.createElement(_EmailTranscriptPaneStateful.default, livechatProps.emailTranscriptPane))))));
 };
 exports.LiveChatWidgetStateful = LiveChatWidgetStateful;
 var _default = LiveChatWidgetStateful;

package/lib/cjs/components/loadingpanestateful/LoadingPaneStateful.js

@@ -9,10 +9,10 @@ var _react = _interopRequireWildcard(require("react"));
 var _omnichannelChatComponents = require("@microsoft/omnichannel-chat-components");
 var _TelemetryHelper = require("../../common/telemetry/TelemetryHelper");
 var _defaultgeneralLoadingPaneStyleProps = require("./common/defaultStyleProps/defaultgeneralLoadingPaneStyleProps");
-var _errorUILoadingPaneStyleProps = require("./common/errorUIStyleProps/errorUILoadingPaneStyleProps");
 var _utils = require("../../common/utils");
 var _useChatContextStore = _interopRequireDefault(require("../../hooks/useChatContextStore"));
 var _useWindowDimensions = _interopRequireDefault(require("../../hooks/useWindowDimensions"));
+var _errorUILoadingPaneStyleProps = require("./common/errorUIStyleProps/errorUILoadingPaneStyleProps");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

package/lib/cjs/components/startchaterrorpanestateful/StartChatErrorPaneStateful.js

@@ -0,0 +1,68 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.StartChatErrorPaneStateful = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _omnichannelChatComponents = require("@microsoft/omnichannel-chat-components");
+var _utils = require("../../common/utils");
+var _useChatContextStore = _interopRequireDefault(require("../../hooks/useChatContextStore"));
+var _TelemetryHelper = require("../../common/telemetry/TelemetryHelper");
+var _TelemetryConstants = require("../../common/telemetry/TelemetryConstants");
+var _defaultStartChatErrorPaneGeneralStyleProps = require("./common/defaultStartChatErrorPaneGeneralStyleProps");
+var _defaultStartChatErrorPaneTitleStyleProps = require("./common/defaultStartChatErrorPaneTitleStyleProps");
+var _defaultStartChatErrorPaneSubtitleStyleProps = require("./common/defaultStartChatErrorPaneSubtitleStyleProps");
+var _defaultStartChatErrorPaneIconStyleProps = require("./common/defaultStartChatErrorPaneIconStyleProps");
+var _defaultStartChatErrorPaneIconImageProps = require("./common/defaultStartChatErrorPaneIconImageProps");
+var _Constants = require("../../common/Constants");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+const StartChatErrorPaneStateful = startChatErrorPaneProps => {
+  var _startChatErrorPanePr, _startChatErrorPanePr2, _startChatErrorPanePr3, _startChatErrorPanePr4, _startChatErrorPanePr5, _startChatErrorPanePr6, _startChatErrorPanePr7;
+  const [state] = (0, _useChatContextStore.default)();
+  const generalStyleProps = Object.assign({}, _defaultStartChatErrorPaneGeneralStyleProps.defaultStartChatErrorPaneGeneralStyleProps, startChatErrorPaneProps === null || startChatErrorPaneProps === void 0 ? void 0 : (_startChatErrorPanePr = startChatErrorPaneProps.styleProps) === null || _startChatErrorPanePr === void 0 ? void 0 : _startChatErrorPanePr.generalStyleProps);
+  const titleStyleProps = Object.assign({}, _defaultStartChatErrorPaneTitleStyleProps.defaultStartChatErrorPaneTitleStyleProps, startChatErrorPaneProps === null || startChatErrorPaneProps === void 0 ? void 0 : (_startChatErrorPanePr2 = startChatErrorPaneProps.styleProps) === null || _startChatErrorPanePr2 === void 0 ? void 0 : _startChatErrorPanePr2.titleStyleProps);
+  const subtitleStyleProps = Object.assign({}, _defaultStartChatErrorPaneSubtitleStyleProps.defaultStartChatErrorPaneSubtitleStyleProps, startChatErrorPaneProps === null || startChatErrorPaneProps === void 0 ? void 0 : (_startChatErrorPanePr3 = startChatErrorPaneProps.styleProps) === null || _startChatErrorPanePr3 === void 0 ? void 0 : _startChatErrorPanePr3.subtitleStyleProps);
+  const iconStyleProps = Object.assign({}, _defaultStartChatErrorPaneIconStyleProps.defaultStartChatErrorPaneIconStyleProps, startChatErrorPaneProps === null || startChatErrorPaneProps === void 0 ? void 0 : (_startChatErrorPanePr4 = startChatErrorPaneProps.styleProps) === null || _startChatErrorPanePr4 === void 0 ? void 0 : _startChatErrorPanePr4.iconStyleProps);
+  const iconImageProps = Object.assign({}, _defaultStartChatErrorPaneIconImageProps.defaultStartChatErrorPaneIconImageStyleProps, startChatErrorPaneProps === null || startChatErrorPaneProps === void 0 ? void 0 : (_startChatErrorPanePr5 = startChatErrorPaneProps.styleProps) === null || _startChatErrorPanePr5 === void 0 ? void 0 : _startChatErrorPanePr5.iconImageProps);
+  const errorUIStyleProps = {
+    generalStyleProps: generalStyleProps,
+    titleStyleProps: titleStyleProps,
+    subtitleStyleProps: subtitleStyleProps,
+    iconStyleProps: iconStyleProps,
+    iconImageProps: iconImageProps
+  };
+  const errorPaneTitleText = (startChatErrorPaneProps === null || startChatErrorPaneProps === void 0 ? void 0 : (_startChatErrorPanePr6 = startChatErrorPaneProps.controlProps) === null || _startChatErrorPanePr6 === void 0 ? void 0 : _startChatErrorPanePr6.titleText) ?? _Constants.StartChatErrorPaneConstants.DefaultStartChatErrorTitleText;
+  const errorPaneSubtitleText = (startChatErrorPaneProps === null || startChatErrorPaneProps === void 0 ? void 0 : (_startChatErrorPanePr7 = startChatErrorPaneProps.controlProps) === null || _startChatErrorPanePr7 === void 0 ? void 0 : _startChatErrorPanePr7.subtitleText) ?? _Constants.StartChatErrorPaneConstants.DefaultStartChatErrorSubtitleText;
+  const errorUIControlProps = {
+    id: _Constants.StartChatErrorPaneConstants.DefaultStartChatErrorPaneId,
+    dir: state.domainStates.globalDir,
+    titleText: errorPaneTitleText,
+    subtitleText: errorPaneSubtitleText,
+    hideSpinner: true,
+    hideSpinnerText: true,
+    ...(startChatErrorPaneProps === null || startChatErrorPaneProps === void 0 ? void 0 : startChatErrorPaneProps.controlProps)
+  };
+
+  // Move focus to the first button
+  (0, _react.useEffect)(() => {
+    const firstElement = (0, _utils.findAllFocusableElement)(`#${state.domainStates.widgetElementId}`);
+    if (firstElement && firstElement[0]) {
+      firstElement[0].focus();
+    }
+    _TelemetryHelper.TelemetryHelper.logLoadingEvent(_TelemetryConstants.LogLevel.INFO, {
+      Event: _TelemetryConstants.TelemetryEvent.StartChatErrorPaneLoaded,
+      Description: "Start chat error pane loaded."
+    });
+  }, []);
+  return /*#__PURE__*/_react.default.createElement(_omnichannelChatComponents.LoadingPane, {
+    componentOverrides: startChatErrorPaneProps === null || startChatErrorPaneProps === void 0 ? void 0 : startChatErrorPaneProps.componentOverrides,
+    controlProps: errorUIControlProps,
+    styleProps: errorUIStyleProps
+  });
+};
+exports.StartChatErrorPaneStateful = StartChatErrorPaneStateful;
+var _default = StartChatErrorPaneStateful;
+exports.default = _default;

package/lib/cjs/components/startchaterrorpanestateful/common/defaultStartChatErrorPaneGeneralStyleProps.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultStartChatErrorPaneGeneralStyleProps = void 0;
+const defaultStartChatErrorPaneGeneralStyleProps = {
+  position: "initial",
+  width: "100%",
+  height: "100%",
+  left: "0%",
+  top: "0%",
+  borderRadius: "0 0 4px 4px",
+  borderWidth: "0px",
+  backgroundColor: "#FFFFFF"
+};
+exports.defaultStartChatErrorPaneGeneralStyleProps = defaultStartChatErrorPaneGeneralStyleProps;

package/lib/cjs/components/startchaterrorpanestateful/common/defaultStartChatErrorPaneIconImageProps.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultStartChatErrorPaneIconImageStyleProps = void 0;
+var _react = require("@fluentui/react");
+var _Icons = require("../../../assets/Icons");
+const defaultStartChatErrorPaneIconImageStyleProps = {
+  src: _Icons.AlertIcon,
+  imageFit: _react.ImageFit.centerContain,
+  width: "86px",
+  height: "86px",
+  shouldFadeIn: false,
+  shouldStartVisible: true
+};
+exports.defaultStartChatErrorPaneIconImageStyleProps = defaultStartChatErrorPaneIconImageStyleProps;

package/lib/cjs/components/startchaterrorpanestateful/common/defaultStartChatErrorPaneIconStyleProps.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultStartChatErrorPaneIconStyleProps = void 0;
+const defaultStartChatErrorPaneIconStyleProps = {
+  display: "flex",
+  order: 1,
+  alignSelf: "auto",
+  backgroundColor: "#FFFFFF",
+  boxShadow: "#FFFFFF 0px 0px 0px 0px",
+  margin: "0px 0px 0px 0px"
+};
+exports.defaultStartChatErrorPaneIconStyleProps = defaultStartChatErrorPaneIconStyleProps;

package/lib/cjs/components/startchaterrorpanestateful/common/defaultStartChatErrorPaneSubtitleStyleProps.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultStartChatErrorPaneSubtitleStyleProps = void 0;
+const defaultStartChatErrorPaneSubtitleStyleProps = {
+  fontFamily: "'Segoe UI',Arial,sans-serif",
+  fontWeight: "normal",
+  fontSize: "18px",
+  color: "#36454F",
+  textAlign: "center",
+  display: "flex",
+  order: 3,
+  alignSelf: "auto"
+};
+exports.defaultStartChatErrorPaneSubtitleStyleProps = defaultStartChatErrorPaneSubtitleStyleProps;

package/lib/cjs/components/startchaterrorpanestateful/common/defaultStartChatErrorPaneTitleStyleProps.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultStartChatErrorPaneTitleStyleProps = void 0;
+const defaultStartChatErrorPaneTitleStyleProps = {
+  fontFamily: "'Segoe UI',Arial,sans-serif",
+  fontWeight: "normal",
+  fontSize: "18px",
+  color: "#36454F",
+  textAlign: "center",
+  display: "flex",
+  order: 2,
+  alignSelf: "auto"
+};
+exports.defaultStartChatErrorPaneTitleStyleProps = defaultStartChatErrorPaneTitleStyleProps;

package/lib/cjs/components/startchaterrorpanestateful/interfaces/IStartChatErrorPaneControlProps.js

@@ -0,0 +1 @@
+"use strict";

package/lib/cjs/components/startchaterrorpanestateful/interfaces/IStartChatErrorPaneProps.js

@@ -0,0 +1 @@
+"use strict";

package/lib/cjs/components/startchaterrorpanestateful/interfaces/IStartChatErrorPaneStyleProps.js

@@ -0,0 +1 @@
+"use strict";

package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/activityMiddleware.js

@@ -8,7 +8,6 @@ var _TelemetryConstants = require("../../../../../common/telemetry/TelemetryCons
 var _Constants = require("../../../../../common/Constants");
 var _DirectLineActivityType = require("../../enums/DirectLineActivityType");
 var _DirectLineSenderRole = require("../../enums/DirectLineSenderRole");
-var _MessageType = require("../../enums/MessageType");
 var _react = _interopRequireDefault(require("react"));
 var _TelemetryHelper = require("../../../../../common/telemetry/TelemetryHelper");
 var _defaultSystemMessageStyles = require("./defaultStyles/defaultSystemMessageStyles");
@@ -55,7 +54,7 @@ const handleSystemMessage = (next, args, card, systemMessageStyleProps) => {
   return () => /*#__PURE__*/_react.default.createElement("div", {
     key: card.activity.id,
     style: systemMessageStyles,
-    "aria-hidden": "true",
+    "aria-hidden": "false",
     dangerouslySetInnerHTML: {
       __html: (0, _utils.escapeHtml)(card.activity.text)
     }
@@ -81,13 +80,6 @@ const createActivityMiddleware = (systemMessageStyleProps, userMessageStyleProps
   if (card.activity) {
     var _card$activity$from;
     if (((_card$activity$from = card.activity.from) === null || _card$activity$from === void 0 ? void 0 : _card$activity$from.role) === _DirectLineSenderRole.DirectLineSenderRole.Channel) {
-      var _card$activity$channe3;
-      if (((_card$activity$channe3 = card.activity.channelData) === null || _card$activity$channe3 === void 0 ? void 0 : _card$activity$channe3.type) === _MessageType.MessageTypes.Thread) {
-        _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.INFO, {
-          Event: _TelemetryConstants.TelemetryEvent.IC3ThreadUpdateEventReceived,
-          Description: "IC3 ThreadUpdateEvent Received"
-        });
-      }
       return () => false;
     }
     if (isTagIncluded(card, _Constants.Constants.hiddenTag)) {
@@ -108,8 +100,7 @@ const createActivityMiddleware = (systemMessageStyleProps, userMessageStyleProps
       return function () {
         return /*#__PURE__*/_react.default.createElement("div", {
           className: card.activity.from.role === _DirectLineSenderRole.DirectLineSenderRole.User ? _Constants.Constants.sentMessageClassName : _Constants.Constants.receivedMessageClassName,
-          style: userMessageStyles,
-          "aria-hidden": "true"
+          style: userMessageStyles
         }, next(...args)(...arguments));
       };
     }

package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/activityMiddleware.spec.js

@@ -22,7 +22,7 @@ describe("activityMiddleware test", () => {
     };
     const results = (0, _activityMiddleware.createActivityMiddleware)()()(next)(args);
     expect(results()).toEqual(false);
-    expect(_TelemetryHelper.TelemetryHelper.logActionEvent).toHaveBeenCalledTimes(1);
+    expect(_TelemetryHelper.TelemetryHelper.logActionEvent).toHaveBeenCalledTimes(0);
   });
   it("createActivityMiddleware() with Hidden tag should return nothing", () => {
     spyOn(_TelemetryHelper.TelemetryHelper, "logActionEvent").and.callFake(() => false);

package/lib/cjs/contexts/common/ConversationState.js

@@ -17,4 +17,5 @@ exports.ConversationState = ConversationState;
   ConversationState[ConversationState["PostchatLoading"] = 7] = "PostchatLoading";
   ConversationState[ConversationState["Postchat"] = 8] = "Postchat";
   ConversationState[ConversationState["Closed"] = 9] = "Closed";
+  ConversationState[ConversationState["Error"] = 10] = "Error";
 })(ConversationState || (exports.ConversationState = ConversationState = {}));

package/lib/cjs/contexts/common/LiveChatWidgetContextInitialState.js

@@ -64,6 +64,7 @@ const getLiveChatWidgetContextInitialState = props => {
     },
     uiStates: {
       showConfirmationPane: false,
+      showStartChatErrorPane: false,
       showEmailTranscriptPane: false,
       showCallingPopup: false,
       isIncomingCall: true,