@microsoft/omnichannel-chat-widget 0.1.0-main.c461296 → 0.1.0-main.c5ffed0

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

@@ -1,12 +1,16 @@
 import { ConversationState } from "./ConversationState";
 import { defaultMiddlewareLocalizedTexts } from "../../components/webchatcontainerstateful/common/defaultProps/defaultMiddlewareLocalizedTexts";
+import { getWidgetCacheId, isNullOrUndefined } from "../../common/utils";
+import { defaultClientDataStoreProvider } from "../../common/storage/default/defaultClientDataStoreProvider";
+import { Constants } from "../../common/Constants";
 export const getLiveChatWidgetContextInitialState = props => {
-  var _props$webChatContain;
-
-  if (props !== null && props !== void 0 && props.liveChatContextFromCache) {
-    return props === null || props === void 0 ? void 0 : props.liveChatContextFromCache;
+  var _props$chatSDK, _props$chatSDK$omnich, _props$chatSDK2, _props$chatSDK2$omnic, _props$controlProps, _props$controlProps2, _props$webChatContain;
+  const widgetCacheId = getWidgetCacheId(props === null || props === void 0 ? void 0 : (_props$chatSDK = props.chatSDK) === null || _props$chatSDK === void 0 ? void 0 : (_props$chatSDK$omnich = _props$chatSDK.omnichannelConfig) === null || _props$chatSDK$omnich === void 0 ? void 0 : _props$chatSDK$omnich.orgId, props === null || props === void 0 ? void 0 : (_props$chatSDK2 = props.chatSDK) === null || _props$chatSDK2 === void 0 ? void 0 : (_props$chatSDK2$omnic = _props$chatSDK2.omnichannelConfig) === null || _props$chatSDK2$omnic === void 0 ? void 0 : _props$chatSDK2$omnic.widgetId, (props === null || props === void 0 ? void 0 : (_props$controlProps = props.controlProps) === null || _props$controlProps === void 0 ? void 0 : _props$controlProps.widgetInstanceId) ?? "");
+  const cacheTtlInMins = (props === null || props === void 0 ? void 0 : (_props$controlProps2 = props.controlProps) === null || _props$controlProps2 === void 0 ? void 0 : _props$controlProps2.cacheTtlInMins) ?? Constants.CacheTtlInMinutes;
+  const initialState = defaultClientDataStoreProvider(cacheTtlInMins).getData(widgetCacheId, "localStorage");
+  if (!isNullOrUndefined(initialState)) {
+    return JSON.parse(initialState);
   }
-
   const LiveChatWidgetContextInitialState = {
     domainStates: {
       liveChatConfig: props.chatConfig,
@@ -18,18 +22,21 @@ export const getLiveChatWidgetContextInitialState = props => {
       postChatContext: undefined,
       telemetryInternalData: {},
       globalDir: "ltr",
-      liveChatContext: undefined
+      liveChatContext: undefined,
+      customContext: undefined,
+      widgetSize: undefined,
+      widgetInstanceId: ""
     },
     appStates: {
       conversationState: ConversationState.Closed,
       isMinimized: false,
-      previousElementOnFocusBeforeModalOpen: null,
+      previousElementIdOnFocusBeforeModalOpen: null,
+      isStartChatFailing: false,
       outsideOperatingHours: false,
-      shouldShowPostChat: false,
       preChatResponseEmail: "",
       isAudioMuted: null,
       newMessage: false,
-      skipChatButtonRendering: false,
+      hideStartChatButton: false,
       reconnectId: undefined,
       proactiveChatStates: {
         proactiveChatBodyTitle: "",

package/lib/esm/contexts/createReducer.js

@@ -1,237 +1,301 @@
 /* eslint-disable indent */
+
 import { LiveChatWidgetActionType } from "./common/LiveChatWidgetActionType";
-import { TelemetryManager } from "../common/telemetry/TelemetryManager";
 export const createReducer = () => {
   const reducer = (state, action) => {
     var _action$payload, _action$payload2, _action$payload3;
-
     switch (action.type) {
       case LiveChatWidgetActionType.SET_WIDGET_ELEMENT_ID:
-        return { ...state,
-          domainStates: { ...state.domainStates,
+        return {
+          ...state,
+          domainStates: {
+            ...state.domainStates,
             widgetElementId: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_RENDERING_MIDDLEWARE_PROPS:
-        return { ...state,
-          domainStates: { ...state.domainStates,
+        return {
+          ...state,
+          domainStates: {
+            ...state.domainStates,
             renderingMiddlewareProps: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_MIDDLEWARE_LOCALIZED_TEXTS:
-        return { ...state,
-          domainStates: { ...state.domainStates,
+        return {
+          ...state,
+          domainStates: {
+            ...state.domainStates,
             middlewareLocalizedTexts: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_GLOBAL_DIR:
-        return { ...state,
-          domainStates: { ...state.domainStates,
+        return {
+          ...state,
+          domainStates: {
+            ...state.domainStates,
             globalDir: action.payload === "ltr" || action.payload === "rtl" ? action.payload : "ltr"
           }
         };
-
       case LiveChatWidgetActionType.SET_MINIMIZED:
-        return { ...state,
-          appStates: { ...state.appStates,
+        return {
+          ...state,
+          appStates: {
+            ...state.appStates,
             isMinimized: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_CONVERSATION_STATE:
-        return { ...state,
-          appStates: { ...state.appStates,
+        return {
+          ...state,
+          appStates: {
+            ...state.appStates,
             conversationState: action.payload
           }
         };
-
+      case LiveChatWidgetActionType.SET_START_CHAT_FAILING:
+        return {
+          ...state,
+          appStates: {
+            ...state.appStates,
+            isStartChatFailing: action.payload
+          }
+        };
       case LiveChatWidgetActionType.SET_OUTSIDE_OPERATING_HOURS:
-        return { ...state,
-          appStates: { ...state.appStates,
+        return {
+          ...state,
+          appStates: {
+            ...state.appStates,
             outsideOperatingHours: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_PRE_CHAT_SURVEY_RESPONSE:
-        return { ...state,
-          domainStates: { ...state.domainStates,
+        return {
+          ...state,
+          domainStates: {
+            ...state.domainStates,
             preChatSurveyResponse: action.payload
           }
         };
-
-      case LiveChatWidgetActionType.SET_PREVIOUS_FOCUSED_ELEMENT:
-        return { ...state,
-          appStates: { ...state.appStates,
-            previousElementOnFocusBeforeModalOpen: action.payload
+      case LiveChatWidgetActionType.SET_CUSTOM_CONTEXT:
+        return {
+          ...state,
+          domainStates: {
+            ...state.domainStates,
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            customContext: action.payload
+          }
+        };
+      case LiveChatWidgetActionType.SET_PREVIOUS_FOCUSED_ELEMENT_ID:
+        return {
+          ...state,
+          appStates: {
+            ...state.appStates,
+            previousElementIdOnFocusBeforeModalOpen: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_SHOW_CONFIRMATION:
-        return { ...state,
-          uiStates: { ...state.uiStates,
+        return {
+          ...state,
+          uiStates: {
+            ...state.uiStates,
             showConfirmationPane: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_POST_CHAT_CONTEXT:
-        return { ...state,
-          domainStates: { ...state.domainStates,
+        return {
+          ...state,
+          domainStates: {
+            ...state.domainStates,
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             postChatContext: action.payload
           }
         };
-
-      case LiveChatWidgetActionType.SET_SHOULD_SHOW_POST_CHAT:
-        return { ...state,
-          appStates: { ...state.appStates,
-            shouldShowPostChat: action.payload
-          }
-        };
-
       case LiveChatWidgetActionType.SHOW_CALLING_CONTAINER:
-        return { ...state,
-          uiStates: { ...state.uiStates,
+        return {
+          ...state,
+          uiStates: {
+            ...state.uiStates,
             showCallingPopup: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_INCOMING_CALL:
-        return { ...state,
-          uiStates: { ...state.uiStates,
+        return {
+          ...state,
+          uiStates: {
+            ...state.uiStates,
             isIncomingCall: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_FOCUS_CHAT_BUTTON:
-        return { ...state,
-          uiStates: { ...state.uiStates,
+        return {
+          ...state,
+          uiStates: {
+            ...state.uiStates,
             focusChatButton: action.payload
           }
         };
-
       case LiveChatWidgetActionType.DISABLE_VIDEO_CALL:
-        return { ...state,
-          uiStates: { ...state.uiStates,
+        return {
+          ...state,
+          uiStates: {
+            ...state.uiStates,
             disableVideoCall: action.payload
           }
         };
-
       case LiveChatWidgetActionType.DISABLE_LOCAL_VIDEO:
-        return { ...state,
-          uiStates: { ...state.uiStates,
+        return {
+          ...state,
+          uiStates: {
+            ...state.uiStates,
             disableSelfVideo: action.payload
           }
         };
-
       case LiveChatWidgetActionType.DISABLE_REMOTE_VIDEO:
-        return { ...state,
-          uiStates: { ...state.uiStates,
+        return {
+          ...state,
+          uiStates: {
+            ...state.uiStates,
             disableRemoteVideo: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_CHAT_TOKEN:
-        return { ...state,
-          domainStates: { ...state.domainStates,
+        return {
+          ...state,
+          domainStates: {
+            ...state.domainStates,
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             chatToken: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_SHOW_EMAIL_TRANSCRIPT_PANE:
-        return { ...state,
-          uiStates: { ...state.uiStates,
+        return {
+          ...state,
+          uiStates: {
+            ...state.uiStates,
             showEmailTranscriptPane: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_PRECHAT_RESPONSE_EMAIL:
-        return { ...state,
-          appStates: { ...state.appStates,
+        return {
+          ...state,
+          appStates: {
+            ...state.appStates,
             preChatResponseEmail: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_AUDIO_NOTIFICATION:
-        return { ...state,
-          appStates: { ...state.appStates,
+        return {
+          ...state,
+          appStates: {
+            ...state.appStates,
             isAudioMuted: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_E2VV_ENABLED:
-        return { ...state,
-          appStates: { ...state.appStates,
+        return {
+          ...state,
+          appStates: {
+            ...state.appStates,
             e2vvEnabled: action.payload
           }
         };
-
-      case LiveChatWidgetActionType.SET_SKIP_CHAT_BUTTON_RENDERING:
-        return { ...state,
-          appStates: { ...state.appStates,
-            skipChatButtonRendering: action.payload
+      case LiveChatWidgetActionType.SET_START_CHAT_BUTTON_DISPLAY:
+        return {
+          ...state,
+          appStates: {
+            ...state.appStates,
+            hideStartChatButton: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_PROACTIVE_CHAT_PARAMS:
-        return { ...state,
-          appStates: { ...state.appStates,
-            proactiveChatStates: { ...state.appStates.proactiveChatStates,
+        return {
+          ...state,
+          appStates: {
+            ...state.appStates,
+            proactiveChatStates: {
+              ...state.appStates.proactiveChatStates,
               proactiveChatBodyTitle: (_action$payload = action.payload) === null || _action$payload === void 0 ? void 0 : _action$payload.proactiveChatBodyTitle,
               proactiveChatEnablePrechat: (_action$payload2 = action.payload) === null || _action$payload2 === void 0 ? void 0 : _action$payload2.proactiveChatEnablePrechat,
               proactiveChatInNewWindow: (_action$payload3 = action.payload) === null || _action$payload3 === void 0 ? void 0 : _action$payload3.proactiveChatInNewWindow
             }
           }
         };
-
       case LiveChatWidgetActionType.SET_TELEMETRY_DATA:
-        TelemetryManager.InternalTelemetryData = action.payload;
-        return { ...state,
-          domainStates: { ...state.domainStates,
+        return {
+          ...state,
+          domainStates: {
+            ...state.domainStates,
             telemetryInternalData: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_RECONNECT_ID:
-        return { ...state,
-          appStates: { ...state.appStates,
+        return {
+          ...state,
+          appStates: {
+            ...state.appStates,
             reconnectId: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_UNREAD_MESSAGE_COUNT:
-        return { ...state,
-          appStates: { ...state.appStates,
+        return {
+          ...state,
+          appStates: {
+            ...state.appStates,
             unreadMessageCount: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_LIVE_CHAT_CONTEXT:
-        return { ...state,
-          domainStates: { ...state.domainStates,
+        return {
+          ...state,
+          domainStates: {
+            ...state.domainStates,
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             liveChatContext: action.payload
           }
         };
-
       case LiveChatWidgetActionType.SET_WIDGET_STATE:
-        return { ...action.payload
+        return {
+          ...action.payload
         };
-
       case LiveChatWidgetActionType.SET_CONVERSATION_ENDED_BY_AGENT:
-        return { ...state,
-          appStates: { ...state.appStates,
+        return {
+          ...state,
+          appStates: {
+            ...state.appStates,
             conversationEndedByAgent: action.payload
           }
         };
-
+      case LiveChatWidgetActionType.SET_WIDGET_SIZE:
+        return {
+          ...state,
+          domainStates: {
+            ...state.domainStates,
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            widgetSize: action.payload
+          }
+        };
+      case LiveChatWidgetActionType.SET_WIDGET_INSTANCE_ID:
+        return {
+          ...state,
+          domainStates: {
+            ...state.domainStates,
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            widgetInstanceId: action.payload
+          }
+        };
+      case LiveChatWidgetActionType.SET_LIVE_CHAT_CONFIG:
+        return {
+          ...state,
+          domainStates: {
+            ...state.domainStates,
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            liveChatConfig: action.payload
+          }
+        };
       default:
         return state;
     }
   };
-
   return reducer;
 };

package/lib/esm/controller/componentController.js

@@ -1,7 +1,8 @@
 import { ConversationState } from "../contexts/common/ConversationState";
 export const shouldShowChatButton = state => {
-  return state.appStates.isMinimized || state.appStates.conversationState === ConversationState.Closed;
+  return (state.appStates.isMinimized || state.appStates.conversationState === ConversationState.Closed) && state.appStates.hideStartChatButton === false; // Do not show chat button in case of popout
 };
+
 export const shouldShowProactiveChatPane = state => {
   return !state.appStates.isMinimized && state.appStates.conversationState === ConversationState.ProactiveChat;
 };
@@ -9,7 +10,7 @@ export const shouldShowHeader = state => {
   return !state.appStates.isMinimized && state.appStates.conversationState !== ConversationState.Closed && state.appStates.conversationState !== ConversationState.ProactiveChat;
 };
 export const shouldShowFooter = state => {
-  return !state.appStates.isMinimized && (state.appStates.conversationState === ConversationState.Active || state.appStates.conversationState === ConversationState.InActive);
+  return !state.appStates.isMinimized && (state.appStates.conversationState === ConversationState.Active || state.appStates.conversationState === ConversationState.InActive || state.appStates.conversationState === ConversationState.Postchat);
 };
 export const shouldShowEmailTranscriptPane = state => {
   return state.uiStates.showEmailTranscriptPane;
@@ -18,13 +19,13 @@ export const shouldShowWebChatContainer = state => {
   return state.appStates.conversationState === ConversationState.Active || state.appStates.conversationState === ConversationState.InActive;
 };
 export const shouldShowLoadingPane = state => {
-  return !state.appStates.isMinimized && !state.appStates.shouldShowPostChat && state.appStates.conversationState === ConversationState.Loading;
+  return !state.appStates.isMinimized && state.appStates.conversationState === ConversationState.Loading;
 };
 export const shouldShowReconnectChatPane = state => {
   return !state.appStates.isMinimized && state.appStates.conversationState === ConversationState.ReconnectChat;
 };
 export const shouldShowPostChatLoadingPane = state => {
-  return !state.appStates.isMinimized && state.appStates.shouldShowPostChat && state.appStates.conversationState === ConversationState.Loading;
+  return !state.appStates.isMinimized && state.appStates.conversationState === ConversationState.PostchatLoading;
 };
 export const shouldShowOutOfOfficeHoursPane = state => {
   return !state.appStates.isMinimized && state.appStates.conversationState === ConversationState.OutOfOffice;

package/lib/esm/hooks/useChatAdapterStore.js

@@ -1,15 +1,11 @@
 import { ChatAdapterStore } from "../contexts/ChatAdapterStore";
 import { useContext } from "react";
-
 const useChatAdapterStore = () => {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const adapter = useContext(ChatAdapterStore);
-
   if (!adapter) {
     throw new Error("This hook can only be used on component that is descendants of <ChatAdapterStore.Provider>");
   }
-
   return adapter;
 };
-
 export default useChatAdapterStore;

package/lib/esm/hooks/useChatContextStore.js

@@ -1,14 +1,10 @@
 import { useContext } from "react";
 import { ChatContextStore } from "../contexts/ChatContextStore";
-
 const useChatContextStore = () => {
   const context = useContext(ChatContextStore);
-
   if (!context) {
     throw new Error("This hook can only be used on component that is descendants of <ChatContextStore.Provider>");
   }
-
   return context;
 };
-
 export default useChatContextStore;

package/lib/esm/hooks/useChatSDKStore.js

@@ -1,14 +1,10 @@
 import { ChatSDKStore } from "../contexts/ChatSDKStore";
 import { useContext } from "react";
-
 const useChatSDKStore = () => {
   const sdk = useContext(ChatSDKStore);
-
   if (!sdk) {
     throw new Error("This hook is not called on component that is descendants of <ChatSDKStore.Provider>, or ChatSDK is not passed into LiveChatWidget component.");
   }
-
   return sdk;
 };
-
 export default useChatSDKStore;

package/lib/esm/hooks/useDebounce.js

@@ -0,0 +1,22 @@
+import { useRef, useEffect } from "react";
+export default function useDebounce(func) {
+  let delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1000;
+  const timer = useRef();
+  useEffect(() => {
+    return () => {
+      if (!timer.current) return;
+      clearTimeout(timer.current);
+    };
+  }, []);
+  const debouncedFunction = function () {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    const newTimer = setTimeout(() => {
+      func(...args);
+    }, delay);
+    clearTimeout(timer.current);
+    timer.current = newTimer;
+  };
+  return debouncedFunction;
+}

package/lib/esm/hooks/useWindowDimensions.js

@@ -0,0 +1,23 @@
+import { useState, useEffect } from "react";
+import useDebounce from "./useDebounce";
+function getWindowDimensions() {
+  const {
+    innerWidth: width,
+    innerHeight: height
+  } = window;
+  return {
+    width,
+    height
+  };
+}
+export default function useWindowDimensions() {
+  let delay = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 200;
+  const [windowDimensions, setWindowDimensions] = useState(getWindowDimensions());
+  const handleResize = () => setWindowDimensions(getWindowDimensions());
+  const debouncedHandleResize = useDebounce(handleResize, delay);
+  useEffect(() => {
+    window.addEventListener("resize", debouncedHandleResize);
+    return () => window.removeEventListener("resize", debouncedHandleResize);
+  }, []);
+  return windowDimensions;
+}