@seamly/web-ui 21.0.7 → 21.0.9

package/build/dist/lib/index.js

@@ -7293,7 +7293,7 @@ _API_ready = new WeakMap(), _API_externalId = new WeakMap(), _API_layoutMode = n
   return {
     clientName: "@seamly/web-ui",
     clientVariant: api_classPrivateFieldGet(this, _API_layoutMode, "f"),
-    clientVersion: "21.0.7",
+    clientVersion: "21.0.9",
     currentUrl: window.location.toString(),
     screenResolution: `${window.screen.width}x${window.screen.height}`,
     timezone: getTimeZone(),
@@ -11744,7 +11744,7 @@ const interruptSlice = createSlice({
     clearInterrupt: () => slice_initialState
   },
   extraReducers: builder => {
-    builder.addCase(resetApp.fulfilled, () => slice_initialState).addMatcher(isAnyOf(initializeApp.rejected, initializeConfig.rejected, setLocale.rejected, setVisibility.rejected, initializeVisibility.rejected), (state, {
+    builder.addCase(initializeConfig.pending, () => slice_initialState).addMatcher(isAnyOf(initializeApp.rejected, initializeConfig.rejected, setLocale.rejected, setVisibility.rejected, initializeVisibility.rejected), (state, {
       payload
     }) => {
       state.error = payload;
@@ -12620,6 +12620,7 @@ const {
 
 
 
+
 const i18n_slice_initialState = {
   translations: {
     'errors.configError.message': 'We are sorry this happened, please retry at a later time.',
@@ -12656,7 +12657,7 @@ const i18nSlice = createSlice({
   },
   extraReducers: builder => {
     // Add reducers for additional action types here, and handle loading state as needed
-    builder.addCase(initializeConfig.fulfilled, (state, {
+    builder.addCase(resetApp.pending, () => i18n_slice_initialState).addCase(initializeConfig.fulfilled, (state, {
       payload
     }) => {
       state.initialLocale = payload.locale;
@@ -12686,12 +12687,7 @@ const {
 ;// CONCATENATED MODULE: ./src/javascripts/domains/interrupt/middleware.ts
 
 
-
-
-
-
-
-const handledErrorTypes = [SeamlyGeneralError, SeamlyConfigurationError, SeamlySessionExpiredError, SeamlyOfflineError, SeamlyUnauthorizedError, SeamlyUnavailableError];
+const handledErrorTypes = ['SeamlyGeneralError', 'SeamlyConfigurationError', 'SeamlySessionExpiredError', 'SeamlyOfflineError', 'SeamlyUnauthorizedError', 'SeamlyUnavailableError'];
 function createInterruptMiddleware({
   api
 }) {
@@ -12701,7 +12697,7 @@ function createInterruptMiddleware({
       type
     } = action;
     if (type === setInterrupt.type) {
-      if (!handledErrorTypes.some(ErrorType => payload.name === ErrorType.name)) {
+      if (!handledErrorTypes.includes(payload.name)) {
         throw new SeamlyGeneralError(payload);
       } else if (payload.action === 'reset') {
         // [SMLY-942] We clear the store before a reset to force a new conversation if the page is refreshed before the conversation is reset
@@ -12764,6 +12760,7 @@ const selectIsLoading = es_createSelector(({
 
 
 
+
 const translationsInitialState = {
   isActive: false,
   currentLocale: undefined,
@@ -12854,7 +12851,7 @@ const translationSlice = createSlice({
     }
   },
   extraReducers: builder => {
-    builder.addCase(initializeConfig.fulfilled, (state, {
+    builder.addCase(resetApp.pending, () => translationsInitialState).addCase(initializeConfig.fulfilled, (state, {
       payload
     }) => {
       var _a;
@@ -14041,7 +14038,109 @@ const useLiveRegion = () => {
     sendAssertive
   };
 };
-;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/use-seamly-chat.js
+;// CONCATENATED MODULE: ./src/javascripts/domains/interrupt/selectors.ts
+
+const selectError = es_createSelector(({
+  interrupt
+}) => interrupt, ({
+  error
+}) => error);
+const selectHasError = es_createSelector(selectError, error => Boolean(error));
+;// CONCATENATED MODULE: ./src/javascripts/domains/interrupt/hooks.ts
+
+
+
+
+function useInterrupt() {
+  const {
+    t
+  } = useI18n();
+  const error = useSelector_useSelector(selectError);
+  const hasError = useSelector_useSelector(selectHasError);
+  const meta = (0,hooks_.useMemo)(() => {
+    if (!hasError) {
+      return {
+        title: undefined,
+        message: undefined,
+        srText: undefined,
+        buttonText: undefined,
+        originalError: undefined
+      };
+    }
+    const {
+      langKey,
+      action
+    } = error;
+    const title = t(`${langKey}.title`);
+    const message = t(`${langKey}.message`);
+    const srText = t(`${langKey}.srText`);
+    const buttonText = t(`${langKey}.buttonText`);
+    return Object.assign(Object.assign(Object.assign(Object.assign({}, langKey ? {
+      title,
+      message,
+      srText
+    } : {}), action ? {
+      action
+    } : {}), action && langKey ? {
+      buttonText
+    } : {}), {
+      originalError: error
+    });
+  }, [hasError, error, t]);
+  return {
+    hasError,
+    meta,
+    error
+  };
+}
+;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/use-session-expired-command.ts
+
+
+
+function useSessionExpiredCommand() {
+  const {
+    meta: {
+      originalError,
+      action
+    }
+  } = useInterrupt();
+  const seamlyCommands = use_seamly_commands();
+  const isExpiredError = (originalError === null || originalError === void 0 ? void 0 : originalError.name) === 'SeamlySessionExpiredError';
+  (0,hooks_.useEffect)(() => {
+    if (isExpiredError && seamlyCommands[action]) {
+      seamlyCommands[action]();
+    }
+  }, [action, seamlyCommands, isExpiredError]);
+}
+;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/use-seamly-chat.ts
+var use_seamly_chat_awaiter = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
+  function adopt(value) {
+    return value instanceof P ? value : new P(function (resolve) {
+      resolve(value);
+    });
+  }
+  return new (P || (P = Promise))(function (resolve, reject) {
+    function fulfilled(value) {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    }
+    function rejected(value) {
+      try {
+        step(generator["throw"](value));
+      } catch (e) {
+        reject(e);
+      }
+    }
+    function step(result) {
+      result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
+    }
+    step((generator = generator.apply(thisArg, _arguments || [])).next());
+  });
+};
+
 
 
 
@@ -14080,6 +14179,8 @@ const useSeamlyChat = () => {
   const {
     sendAssertive
   } = useLiveRegion();
+  // Automatically reset conversation if the session has expired
+  useSessionExpiredCommand();
   (0,hooks_.useEffect)(() => {
     if (isVisible) {
       // Wait for the live containers to stabilise in the DOM before injecting
@@ -14126,24 +14227,23 @@ const useSeamlyChat = () => {
       connectCalled.current = false;
     }
   }, [apiConfigReady, apiConnected]);
-  const connectAndStart = (0,hooks_.useCallback)(async () => {
+  const connectAndStart = (0,hooks_.useCallback)(() => use_seamly_chat_awaiter(void 0, void 0, void 0, function* () {
     // We don't connect if we are already connected to the api to avoid multiple in-flight connection processes.
     if (!apiConnected) {
       connectCalled.current = true;
-      await connect();
+      yield connect();
     }
-
     // We only start a conversation when the chat interface is either app, 'open' or if using the inline view if it's 'open' or 'minimized'.
     if (isApp || isOpen || isVisible && isInline) {
       start();
     }
-  }, [apiConnected, connect, isApp, isInline, isOpen, isVisible, start]);
+  }), [apiConnected, connect, isApp, isInline, isOpen, isVisible, start]);
   (0,hooks_.useEffect)(() => {
     // We dont't connect or start when the apiConfig is not ready yet.
     // We also keep track of whether start has been called to avoid multiple in-flight connection processes.
     // We check if the window view is not open and no conversation is started yet.
     // Lastly we check if the inline view is not scrolled in to view.
-    if (!apiConfigReady || connectCalled.current || isWindow && !isOpen && !hasConversation() || isInline && (!isVisible || !showInlineView)) {
+    if (!apiConfigReady || connectCalled.current || isWindow && !isOpen || isInline && (!isVisible || !showInlineView)) {
       return;
     }
     if (hasConversation() && isOpen) {
@@ -18039,7 +18139,7 @@ const SeamlyEventSubscriber = () => {
         channel === null || channel === void 0 ? void 0 : channel.leave();
       };
     }
-    return () => {};
+    return () => undefined;
   }, [api, api.connectionInfo, api.conversation]);
   (0,hooks_.useEffect)(() => {
     api.conversation.onConnection(({
@@ -18222,6 +18322,9 @@ const SeamlyEventSubscriber = () => {
         const {
           channel
         } = api.conversation;
+        if (messageChannelRef.current) {
+          channel === null || channel === void 0 ? void 0 : channel.off('message', messageChannelRef.current);
+        }
         messageChannelRef.current = channel.on('message', payload => {
           if (!EMITTABLE_MESSAGE_TYPES.includes(payload.type)) {
             return payload;
@@ -18238,19 +18341,18 @@ const SeamlyEventSubscriber = () => {
         });
         return true;
       });
-      return () => {
-        var _a;
-        (_a = api.conversation.channel) === null || _a === void 0 ? void 0 : _a.off('message', messageChannelRef.current);
-      };
     }
-    return () => undefined;
   }, [api, api.connectionInfo, api.conversation.channel, eventBus]);
   (0,hooks_.useEffect)(() => {
     if (api.connectionInfo) {
       api.conversation.onConnection(({
         connected
       }) => {
+        var _a;
         if (!connected) return false;
+        if (syncChannelRef.current) {
+          (_a = api.conversation.channel) === null || _a === void 0 ? void 0 : _a.off('sync', syncChannelRef.current);
+        }
         syncChannelRef.current = api.conversation.channel.on('sync', payload => {
           var _a;
           const lastEvent = events[events.length - 1];
@@ -18274,12 +18376,7 @@ const SeamlyEventSubscriber = () => {
         });
         return true;
       });
-      return () => {
-        var _a;
-        (_a = api.conversation.channel) === null || _a === void 0 ? void 0 : _a.off('sync', syncChannelRef.current);
-      };
     }
-    return () => undefined;
   }, [api, api.connectionInfo, api.conversation.channel, events, dispatch]);
   return null;
 };
@@ -18415,52 +18512,6 @@ const SeamlyInitializer = () => {
   return null;
 };
 /* harmony default export */ const seamly_initializer = (SeamlyInitializer);
-;// CONCATENATED MODULE: ./src/javascripts/domains/interrupt/selectors.ts
-
-const selectError = es_createSelector(({
-  interrupt
-}) => interrupt, ({
-  error
-}) => error);
-;// CONCATENATED MODULE: ./src/javascripts/domains/interrupt/hooks.ts
-
-
-
-
-function useInterrupt() {
-  const {
-    t
-  } = useI18n();
-  const error = useSelector_useSelector(selectError);
-  const hasInterrupt = Boolean(error);
-  const meta = (0,hooks_.useMemo)(() => {
-    if (!error) return {};
-    const {
-      langKey,
-      action
-    } = error;
-    const title = t(`${langKey}.title`);
-    const message = t(`${langKey}.message`);
-    const srText = t(`${langKey}.srText`);
-    const buttonText = t(`${langKey}.buttonText`);
-    return Object.assign(Object.assign(Object.assign(Object.assign({}, langKey ? {
-      title,
-      message,
-      srText
-    } : {}), action ? {
-      action
-    } : {}), action && langKey ? {
-      buttonText
-    } : {}), {
-      originalError: error
-    });
-  }, [t, error]);
-  return {
-    hasInterrupt,
-    meta,
-    error
-  };
-}
 ;// CONCATENATED MODULE: ./src/javascripts/ui/components/core/seamly-instance-functions-loader.js
 
 
@@ -18510,9 +18561,7 @@ const SeamlyInstanceFunctionsLoader = () => {
     isInline,
     isResolving
   } = useSeamlyLayoutMode();
-  const {
-    hasInterrupt
-  } = useInterrupt();
+  const hasError = useSelector_useSelector(selectHasError);
   const currentConversationUrl = useSeamlyConversationUrl();
   const prevConversationUrl = (0,hooks_.useRef)(null);
   const onActivityHandler = use_seamly_activity_event_handler();
@@ -18592,7 +18641,7 @@ const SeamlyInstanceFunctionsLoader = () => {
     }
   }, [api.send]);
   (0,hooks_.useEffect)(() => {
-    if (!isResolving && !hasInterrupt) {
+    if (!isResolving && !hasError) {
       // Check for app reset
       if (prevConversationUrl.current && prevConversationUrl.current !== currentConversationUrl) {
         eventBus.emit('unreadMessageCount', unreadCount);
@@ -18611,7 +18660,7 @@ const SeamlyInstanceFunctionsLoader = () => {
       previousUnreadCount.current = unreadCount;
       prevConversationUrl.current = currentConversationUrl;
     }
-  }, [unreadCount, visible, eventBus, isInline, isResolving, hasInterrupt, currentConversationUrl]);
+  }, [unreadCount, visible, eventBus, isInline, isResolving, hasError, currentConversationUrl]);
   return null;
 };
 /* harmony default export */ const seamly_instance_functions_loader = (SeamlyInstanceFunctionsLoader);
@@ -19088,6 +19137,7 @@ const InOutTransition = ({
 
 
 
+
 
 
 const Suggestions = ({
@@ -19119,9 +19169,7 @@ const Suggestions = ({
     sendPolite
   } = useLiveRegion();
   // interrupt & countdown hooks
-  const {
-    hasInterrupt
-  } = useInterrupt();
+  const hasError = useSelector_useSelector(selectHasError);
   const {
     hasCountdown,
     endCountdown
@@ -19138,7 +19186,7 @@ const Suggestions = ({
   } = useTranslatedEventData({
     payload
   });
-  const suggestions = (0,hooks_.useMemo)(() => payload && !hasInterrupt ? eventBody : [], [payload, hasInterrupt, eventBody]);
+  const suggestions = (0,hooks_.useMemo)(() => payload && !hasError ? eventBody : [], [payload, hasError, eventBody]);
   const prevSuggestions = (0,hooks_.useRef)(null);
   const prevHasSuggestions = (0,hooks_.useRef)(false);
   const previousRenderedSuggestions = (0,hooks_.useRef)([]);
@@ -19590,10 +19638,9 @@ function FormProvider(_a) {
         });
     }, [setExternalErrors]);
     const handleSubmit = (0,hooks_.useCallback)((e) => {
-        var _a;
         e.preventDefault();
         // If the submitter is set to being aria-disabled, block the submit action
-        const ariaDisabled = ((_a = e.submitter) === null || _a === void 0 ? void 0 : _a.ariaDisabled) === 'true';
+        const ariaDisabled = e.submitter.getAttribute('aria-disabled') === 'true';
         setIsSubmitted(!ariaDisabled);
         if (!ariaDisabled && validationIsValid) {
             dispatch(setHasResponded(true));
@@ -20268,6 +20315,7 @@ function TranslationsOptionsButton({ children, position = {
 
 
 
+
 function AppOptions() {
   const {
     menuOptions,
@@ -20276,15 +20324,13 @@ function AppOptions() {
   const {
     isAvailable: isTranslationsAvailable
   } = useTranslations();
-  const {
-    hasInterrupt
-  } = useInterrupt();
+  const hasError = useSelector_useSelector(selectHasError);
   const {
     t,
     locale
   } = useI18n();
   const localeNativeName = useLocaleNativeName(locale);
-  if (!isTranslationsAvailable && (!allowOptionSelection || !menuOptions.length) || hasInterrupt) {
+  if (!isTranslationsAvailable && (!allowOptionSelection || !menuOptions.length) || hasError) {
     return null;
   }
   const openButtonText = t('translations.settings.openButtonText', {
@@ -21546,10 +21592,11 @@ const ChatStatus = ({ children, handleClose, title, closeButtonText, srCloseButt
 
 
 
+
 function TranslationChatStatus() {
     const { t } = useI18n();
     const { id } = useTranslationsContainer();
-    const { hasInterrupt } = useInterrupt();
+    const hasError = useSelector_useSelector(selectHasError);
     const { disableTranslations, currentLocale } = useTranslations();
     const localeNativeName = useLocaleNativeName(currentLocale);
     const focusSkiplinkTarget = useSkiplinkTargetFocusing();
@@ -21558,7 +21605,7 @@ function TranslationChatStatus() {
         disableTranslations();
         focusSkiplinkTarget();
     }, [disableTranslations, focusSkiplinkTarget]);
-    if (hasInterrupt) {
+    if (hasError) {
         return null;
     }
     return ((0,jsx_runtime_namespaceObject.jsx)(chat_status, { handleClose: handleClickStop, title: label, id: id, closeButtonText: t('translations.status.stopText'), srCloseButtonText: t('translations.status.srStopText') }));
@@ -21591,24 +21638,17 @@ function TranslationProposal() {
 
 
 
+
 function TranslationStatus() {
-    const { hasInterrupt } = useInterrupt();
+    const hasError = useSelector_useSelector(selectHasError);
     const { isActive } = useTranslations();
-    if (hasInterrupt) {
+    if (hasError) {
         return null;
     }
     return !isActive ? (0,jsx_runtime_namespaceObject.jsx)(TranslationProposal, {}) : (0,jsx_runtime_namespaceObject.jsx)(TranslationChatStatus, {});
 }
 
-;// CONCATENATED MODULE: ./src/javascripts/ui/components/layout/chat-frame.js
-function chat_frame_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function chat_frame_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? chat_frame_ownKeys(Object(source), !0).forEach(function (key) { chat_frame_defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : chat_frame_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function chat_frame_defineProperty(obj, key, value) { key = chat_frame_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 chat_frame_toPropertyKey(arg) { var key = chat_frame_toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function chat_frame_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); }
-
-
-
+;// CONCATENATED MODULE: ./src/javascripts/ui/components/layout/interrupt.js
 
 
 
@@ -21617,61 +21657,24 @@ function chat_frame_toPrimitive(input, hint) { if (typeof input !== "object" ||
 
 
 
-function ChatFrame({
-  children,
-  interruptComponent: InterruptComponent
-}) {
-  const {
-    hasInterrupt,
-    meta
-  } = useInterrupt();
+const Interrupt = () => {
   const {
-    isOpen
-  } = useVisibility();
-  if (hasInterrupt) {
-    if (isOpen) {
-      return (0,jsx_runtime_namespaceObject.jsx)(InterruptComponent, chat_frame_objectSpread({}, meta));
+    meta: {
+      originalError,
+      title,
+      message,
+      buttonText,
+      action,
+      srText
     }
-    return null;
-  }
-  return (0,jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
-    children: [(0,jsx_runtime_namespaceObject.jsxs)(chat_scroll_provider, {
-      children: [(0,jsx_runtime_namespaceObject.jsxs)("div", {
-        className: css_className('chat__container__header'),
-        children: [(0,jsx_runtime_namespaceObject.jsx)(TranslationStatus, {}), (0,jsx_runtime_namespaceObject.jsx)(collapse_button, {})]
-      }), children]
-    }), (0,jsx_runtime_namespaceObject.jsx)(entry_container, {}), isOpen && (0,jsx_runtime_namespaceObject.jsx)(AppOptions, {})]
-  });
-}
-/* harmony default export */ const chat_frame = (ChatFrame);
-;// CONCATENATED MODULE: ./src/javascripts/ui/components/layout/interrupt.js
-
-
-
-
-
-
-
-const Interrupt = ({
-  originalError,
-  title,
-  message,
-  buttonText,
-  action,
-  srText
-}) => {
+  } = useInterrupt();
   const seamlyCommands = use_seamly_commands();
   const headingId = useGeneratedId();
   const {
     sendPolite
   } = useLiveRegion();
   const focusSkiplinkTarget = useSkiplinkTargetFocusing();
-  const isExpiredError = originalError.name === 'SeamlySessionExpiredError';
-  (0,hooks_.useEffect)(() => {
-    if (isExpiredError && seamlyCommands[action]) {
-      seamlyCommands[action]();
-    }
-  }, [action, seamlyCommands, isExpiredError]);
+  const isExpiredError = originalError?.name === 'SeamlySessionExpiredError';
   (0,hooks_.useEffect)(() => {
     if (!isExpiredError && srText) {
       // Wait for live regions to stabilise in case this occurs
@@ -21712,16 +21715,48 @@ const Interrupt = ({
   }) : (0,jsx_runtime_namespaceObject.jsx)(jsx_runtime_namespaceObject.Fragment, {});
 };
 /* harmony default export */ const interrupt = (Interrupt);
-;// CONCATENATED MODULE: ./src/javascripts/ui/components/view/app-view.js
+;// CONCATENATED MODULE: ./src/javascripts/ui/components/layout/chat-frame.js
+
+
+
+
+
+
+
 
 
 
 
 
+
+function ChatFrame({
+  children
+}) {
+  const hasError = useSelector_useSelector(selectHasError);
+  const {
+    isOpen
+  } = useVisibility();
+  if (hasError) {
+    return (0,jsx_runtime_namespaceObject.jsx)(interrupt, {});
+  }
+  return (0,jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
+    children: [(0,jsx_runtime_namespaceObject.jsxs)(chat_scroll_provider, {
+      children: [(0,jsx_runtime_namespaceObject.jsxs)("div", {
+        className: css_className('chat__container__header'),
+        children: [(0,jsx_runtime_namespaceObject.jsx)(TranslationStatus, {}), (0,jsx_runtime_namespaceObject.jsx)(collapse_button, {})]
+      }), children]
+    }), (0,jsx_runtime_namespaceObject.jsx)(entry_container, {}), isOpen && (0,jsx_runtime_namespaceObject.jsx)(AppOptions, {})]
+  });
+}
+/* harmony default export */ const chat_frame = (ChatFrame);
+;// CONCATENATED MODULE: ./src/javascripts/ui/components/view/app-view.js
+
+
+
+
 const AppView = () => {
   return (0,jsx_runtime_namespaceObject.jsx)(chat, {
     children: (0,jsx_runtime_namespaceObject.jsx)(chat_frame, {
-      interruptComponent: interrupt,
       children: (0,jsx_runtime_namespaceObject.jsx)(conversation, {})
     })
   });
@@ -21734,6 +21769,7 @@ const AppView = () => {
 
 
 
+
 function PreChatMessageEvent({
   event
 }) {
@@ -21747,13 +21783,11 @@ function PreChatMessages() {
     preChatEvents,
     layoutMode
   } = useConfig();
-  const {
-    hasInterrupt
-  } = useInterrupt();
+  const hasError = useSelector_useSelector(selectHasError);
   const {
     isOpen
   } = useVisibility();
-  const isVisible = !(hasInterrupt || !preChatEvents?.length || isOpen);
+  const isVisible = !(hasError || !preChatEvents?.length || isOpen);
   return isVisible && (0,jsx_runtime_namespaceObject.jsx)("ul", {
     className: css_className('pre-chat-messages', `pre-chat-messages--${layoutMode}`),
     "aria-hidden": !isVisible,
@@ -21766,13 +21800,6 @@ function PreChatMessages() {
   });
 }
 ;// CONCATENATED MODULE: ./src/javascripts/ui/components/view/inline-view.js
-function inline_view_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function inline_view_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? inline_view_ownKeys(Object(source), !0).forEach(function (key) { inline_view_defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : inline_view_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function inline_view_defineProperty(obj, key, value) { key = inline_view_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 inline_view_toPropertyKey(arg) { var key = inline_view_toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function inline_view_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); }
-
-
 
 
 
@@ -21792,13 +21819,6 @@ const InlineView = () => {
   const {
     isOpen
   } = useVisibility();
-  const {
-    hasInterrupt,
-    meta
-  } = useInterrupt();
-  if (hasInterrupt && !isOpen) {
-    return (0,jsx_runtime_namespaceObject.jsx)(interrupt, inline_view_objectSpread({}, meta));
-  }
   return (0,jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
     children: [(0,jsx_runtime_namespaceObject.jsx)(in_out_transition, {
       isActive: !isOpen,
@@ -21814,7 +21834,6 @@ const InlineView = () => {
       children: (0,jsx_runtime_namespaceObject.jsx)(chat, {
         ref: containerRef,
         children: showInlineView && (0,jsx_runtime_namespaceObject.jsx)(chat_frame, {
-          interruptComponent: interrupt,
           children: isOpen && (0,jsx_runtime_namespaceObject.jsx)(conversation, {})
         })
       })
@@ -21836,13 +21855,12 @@ const InlineView = () => {
 
 
 
+
 const ButtonIcon = () => {
   const startChatIcon = useStartChatIcon();
   const currentAgent = useSeamlyCurrentAgent();
-  const {
-    hasInterrupt
-  } = useInterrupt();
-  const isActiveConversation = currentAgent && !hasInterrupt;
+  const hasError = useSelector_useSelector(selectHasError);
+  const isActiveConversation = currentAgent && !hasError;
   const src = isActiveConversation ? currentAgent.avatar : startChatIcon;
   return src ? (0,jsx_runtime_namespaceObject.jsx)("img", {
     className: css_className(isActiveConversation ? 'avatar' : 'icon'),
@@ -21888,13 +21906,6 @@ const WindowOpenButton = ({
 };
 /* harmony default export */ const window_open_button = (WindowOpenButton);
 ;// CONCATENATED MODULE: ./src/javascripts/ui/components/view/window-view/index.js
-function window_view_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function window_view_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? window_view_ownKeys(Object(source), !0).forEach(function (key) { window_view_defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : window_view_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function window_view_defineProperty(obj, key, value) { key = window_view_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 window_view_toPropertyKey(arg) { var key = window_view_toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function window_view_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); }
-
-
 
 
 
@@ -21916,10 +21927,6 @@ const WindowView = () => {
     openChat
   } = useVisibility();
   const userHasResponded = useUserHasResponded();
-  const {
-    hasInterrupt,
-    meta
-  } = useInterrupt();
   const {
     t
   } = useI18n();
@@ -21931,9 +21938,6 @@ const WindowView = () => {
       }
     }
   }), [continueChatText]);
-  if (hasInterrupt && !isOpen) {
-    return (0,jsx_runtime_namespaceObject.jsx)(interrupt, window_view_objectSpread({}, meta));
-  }
   return (0,jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
     children: [(0,jsx_runtime_namespaceObject.jsx)(window_open_button, {
       onClick: openChat
@@ -21958,7 +21962,6 @@ const WindowView = () => {
       transitionStartState: transitionStartStates.notRendered,
       children: (0,jsx_runtime_namespaceObject.jsx)(chat, {
         children: (0,jsx_runtime_namespaceObject.jsx)(chat_frame, {
-          interruptComponent: interrupt,
           children: (0,jsx_runtime_namespaceObject.jsx)(conversation, {})
         })
       })
@@ -22382,6 +22385,7 @@ function initializeExternalApi(appConfig) {
 
 
 
+
 // Deprecated Toggle Button, should be removed once it is removed from clients
 
 
@@ -22402,13 +22406,11 @@ const DeprecatedToggleButton = ({
   const focusIfContained = useFocusIfSeamlyContainedFocus();
   const currentAgent = useSeamlyCurrentAgent();
   const agentSubtitle = useSeamlyHeaderData().subTitle;
-  const {
-    hasInterrupt
-  } = useInterrupt();
+  const hasError = useSelector_useSelector(selectHasError);
   const {
     headerCollapseButtonId
   } = useSeamlyStateContext();
-  const showAgentInfo = currentAgent && !hasInterrupt;
+  const showAgentInfo = currentAgent && !hasError;
   (0,hooks_.useLayoutEffect)(() => {
     // Because we can close the app from the external API we
     // need to determine if current keyboard focus resides inside
@@ -22468,6 +22470,7 @@ const DeprecatedToggleButton = ({
 
 
 
+
 const AgentInfo = () => {
   const {
     t
@@ -22481,12 +22484,10 @@ const AgentInfo = () => {
     isOpen
   } = useVisibility();
   const currentAgent = useSeamlyCurrentAgent();
-  const {
-    hasInterrupt
-  } = useInterrupt();
+  const hasError = useSelector_useSelector(selectHasError);
   const startChatIcon = useStartChatIcon();
   const src = currentAgent?.avatar ?? startChatIcon;
-  const displaySubtitle = hasInterrupt ? '' : subTitle;
+  const displaySubtitle = hasError ? '' : subTitle;
   const classNames = ['message-count'];
   if (isOpen) {
     classNames.push('message-count__hide');
@@ -22563,11 +22564,8 @@ const Header = ({
 };
 /* harmony default export */ const header = (Header);
 ;// CONCATENATED MODULE: ./src/javascripts/ui/components/layout/deprecated-chat-frame.js
-function deprecated_chat_frame_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function deprecated_chat_frame_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? deprecated_chat_frame_ownKeys(Object(source), !0).forEach(function (key) { deprecated_chat_frame_defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : deprecated_chat_frame_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function deprecated_chat_frame_defineProperty(obj, key, value) { key = deprecated_chat_frame_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 deprecated_chat_frame_toPropertyKey(arg) { var key = deprecated_chat_frame_toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function deprecated_chat_frame_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); }
+
+
 
 
 
@@ -22579,21 +22577,14 @@ function deprecated_chat_frame_toPrimitive(input, hint) { if (typeof input !== "
 
 
 function deprecated_chat_frame_ChatFrame({
-  children,
-  interruptComponent: InterruptComponent
+  children
 }) {
-  const {
-    hasInterrupt,
-    meta
-  } = useInterrupt();
   const {
     isOpen
   } = useVisibility();
-  if (hasInterrupt) {
-    if (isOpen) {
-      return (0,jsx_runtime_namespaceObject.jsx)(InterruptComponent, deprecated_chat_frame_objectSpread({}, meta));
-    }
-    return null;
+  const hasError = useSelector_useSelector(selectHasError);
+  if (hasError) {
+    return (0,jsx_runtime_namespaceObject.jsx)(interrupt, {});
   }
   return (0,jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
     children: [(0,jsx_runtime_namespaceObject.jsxs)(chat_scroll_provider, {
@@ -22633,6 +22624,7 @@ function faq_objectWithoutPropertiesLoose(source, excluded) { if (source == null
 
 
 
+
 const Faq = () => {
   const {
     t
@@ -22646,9 +22638,7 @@ const Faq = () => {
   const {
     sendPolite
   } = useLiveRegion();
-  const {
-    hasInterrupt
-  } = useInterrupt();
+  const hasError = useSelector_useSelector(selectHasError);
   const {
     hasCountdown,
     endCountdown
@@ -22664,7 +22654,7 @@ const Faq = () => {
     payload: lastFaqEventPayload
   });
   const faqs = (0,hooks_.useMemo)(() => {
-    const newFaqs = lastFaqEventPayload && !hasInterrupt ? eventBody : [];
+    const newFaqs = lastFaqEventPayload && !hasError ? eventBody : [];
     const itemBaseClass = `faqs__item`;
     return newFaqs.map(_ref => {
       let {
@@ -22676,7 +22666,7 @@ const Faq = () => {
         classNames: [itemBaseClass, ...categories.map(cat => `faqs__item--${String(cat).toLowerCase().replace(/[^a-z0-9_\\-]/, '')}`)]
       });
     });
-  }, [lastFaqEventPayload, hasInterrupt, eventBody]);
+  }, [lastFaqEventPayload, hasError, eventBody]);
   const prevFaqs = (0,hooks_.useRef)(null);
   const prevHasFaqs = (0,hooks_.useRef)(false);
   const {
@@ -22856,7 +22846,6 @@ const DeprecatedAppFrame = ({
 
 
 
-
 const ShowInlineView = ({
   children
 }) => {
@@ -22883,7 +22872,6 @@ const DeprecatedView = () => {
         onCloseChat: closeChat,
         children: (0,jsx_runtime_namespaceObject.jsx)(agent_info, {})
       }), (0,jsx_runtime_namespaceObject.jsx)(deprecated_chat_frame, {
-        interruptComponent: interrupt,
         children: (0,jsx_runtime_namespaceObject.jsx)(conversation, {})
       })]
     })