@seamly/web-ui 20.8.0-alpha.1 → 20.8.0-beta.2

package/build/dist/lib/index.js

@@ -6643,7 +6643,9 @@ const seamly_unavailable_error_1 = __importDefault(__webpack_require__(9060));
 
 const actions_1 = __webpack_require__(915);
 
-const actions_2 = __webpack_require__(5234);
+const actions_2 = __webpack_require__(59);
+
+const actions_3 = __webpack_require__(5234);
 
 const seamly_utils_1 = __webpack_require__(5740);
 
@@ -6652,7 +6654,8 @@ exports.initializeApp = (0, toolkit_1.createAsyncThunk)('initializeApp', (_, {
     api,
     config
   },
-  rejectWithValue
+  rejectWithValue,
+  dispatch
 }) => __awaiter(void 0, void 0, void 0, function* () {
   var _a, _b, _c, _d;
 
@@ -6691,6 +6694,7 @@ exports.initializeApp = (0, toolkit_1.createAsyncThunk)('initializeApp', (_, {
         });
       }
 
+      dispatch((0, actions_2.setLocale)(locale));
       return {
         initialState: undefined,
         locale,
@@ -6728,7 +6732,7 @@ exports.resetApp = (0, toolkit_1.createAsyncThunk)('resetApp', (_, {
   dispatch((0, actions_1.resetConfig)());
   yield dispatch((0, actions_1.initializeConfig)());
   yield dispatch((0, exports.initializeApp)());
-  dispatch((0, actions_2.initializeVisibility)());
+  dispatch((0, actions_3.initializeVisibility)());
 }));
 
 /***/ }),
@@ -7018,13 +7022,14 @@ exports.initialConfigState = Object.assign(Object.assign({}, config_1.defaultCon
   connectWhenInView: true,
   showDisclaimer: false,
   showFaq: false,
+  showSuggestions: true,
   customComponents: {},
   defaults: {
     visible: null
   },
   preChatEvents: []
 });
-const configKeys = ['hideOnNoUserResponse', 'connectWhenInView', 'showDisclaimer', 'showFaq', 'namespace', 'customComponents', 'defaults', 'layoutMode', 'api', 'zIndex', 'context', 'appContainerClassNames', 'messages', 'visible', 'visibilityCallback', 'errorCallback', 'agentParticipant', 'userParticipant', 'startChatIcon'];
+const configKeys = ['hideOnNoUserResponse', 'connectWhenInView', 'showDisclaimer', 'showFaq', 'showSuggestions', 'namespace', 'customComponents', 'defaults', 'layoutMode', 'api', 'zIndex', 'context', 'appContainerClassNames', 'messages', 'visible', 'visibilityCallback', 'errorCallback', 'agentParticipant', 'userParticipant', 'startChatIcon'];
 
 const updateState = (state, config) => {
   const _a = (0, general_utils_1.pick)(config, configKeys),
@@ -7654,11 +7659,9 @@ exports.setTranslations = exports.setInitialLocale = exports.i18nSlice = void 0;
 
 const toolkit_1 = __webpack_require__(575);
 
-const actions_1 = __webpack_require__(4134);
-
-const actions_2 = __webpack_require__(915);
+const actions_1 = __webpack_require__(915);
 
-const actions_3 = __webpack_require__(59);
+const actions_2 = __webpack_require__(59);
 
 const initialState = {
   translations: {
@@ -7696,15 +7699,11 @@ exports.i18nSlice = (0, toolkit_1.createSlice)({
   },
   extraReducers: builder => {
     // Add reducers for additional action types here, and handle loading state as needed
-    builder.addCase(actions_2.initializeConfig.fulfilled, (state, {
+    builder.addCase(actions_1.initializeConfig.fulfilled, (state, {
       payload
     }) => {
       state.initialLocale = payload.locale;
-    }).addCase(actions_1.initializeApp.fulfilled, (state, {
-      payload
-    }) => {
-      state.locale = payload.locale;
-    }).addCase(actions_3.setLocale.fulfilled, (state, {
+    }).addCase(actions_2.setLocale.fulfilled, (state, {
       payload
     }) => {
       if (!(payload === null || payload === void 0 ? void 0 : payload.translations)) {
@@ -8048,7 +8047,7 @@ var _a;
 Object.defineProperty(exports, "__esModule", ({
   value: true
 }));
-exports.stopIdleDetachCountdownCounter = exports.showOption = exports.setUserSelectedOptions = exports.setUserSelectedOption = exports.setUserEntryType = exports.setUploadProgress = exports.setUploadError = exports.setUploadComplete = exports.setServiceEntryMetadata = exports.setServiceDataItem = exports.setSeamlyContainerElement = exports.setParticipant = exports.setLoadedImageEventIds = exports.setIsLoading = exports.setInitialState = exports.setHistory = exports.setHeaderTitle = exports.setHeaderSubTitle = exports.setFeatures = exports.setFeatureEnabledState = exports.setEventsRead = exports.setBlockAutoEntrySwitch = exports.setActiveService = exports.setActiveEntryType = exports.resetHistoryLoadedFlag = exports.registerUpload = exports.initResumeConversationPrompt = exports.initIdleDetachCountdown = exports.hideOption = exports.decrementIdleDetachCountdownCounter = exports.clearResumeConversationPrompt = exports.clearIdleDetachCountdown = exports.clearFeatures = exports.clearEvents = exports.clearAllUploads = exports.addEvent = exports.ackEvent = exports.storeSlice = exports.initialStoreState = exports.mergeHistory = exports.isUnreadMessage = void 0;
+exports.stopIdleDetachCountdownCounter = exports.showOption = exports.setUserSelectedOptions = exports.setUserSelectedOption = exports.setUserEntryType = exports.setUploadProgress = exports.setUploadError = exports.setUploadComplete = exports.setServiceEntryMetadata = exports.setServiceDataItem = exports.setSeamlyContainerElement = exports.setParticipant = exports.setLoadedImageEventIds = exports.setIsLoading = exports.setInitialState = exports.setHistory = exports.setHeaderTitle = exports.setHeaderSubTitle = exports.setFeatures = exports.setFeatureEnabledState = exports.setEventsRead = exports.setBlockAutoEntrySwitch = exports.setActiveService = exports.setActiveEntryType = exports.resetHistoryLoadedFlag = exports.registerUpload = exports.initResumeConversationPrompt = exports.initIdleDetachCountdown = exports.hideOption = exports.decrementIdleDetachCountdownCounter = exports.clearResumeConversationPrompt = exports.clearIdleDetachCountdown = exports.clearFeatures = exports.clearEvents = exports.clearAllUploads = exports.addEvent = exports.ackEvent = exports.storeSlice = exports.initialStoreState = exports.mergeHistory = exports.orderHistory = exports.isUnreadMessage = void 0;
 
 const toolkit_1 = __webpack_require__(575);
 
@@ -8081,6 +8080,8 @@ const orderHistory = events => {
   }) => occurredAtA - occurredAtB);
 };
 
+exports.orderHistory = orderHistory;
+
 const mergeHistory = (stateEvents, historyEvents) => {
   const newStateEvents = stateEvents.filter(stateEvent => // Deduplicate the event streams, giving events in historyEvents
   // precedence so the server is able to push changes to events.
@@ -8091,7 +8092,7 @@ const mergeHistory = (stateEvents, historyEvents) => {
   // these messages will be shown in the wrong order if not reversed. For
   // the normal merging logic there is no added effect.
   .reverse();
-  return orderHistory([...newHistoryEvents, ...newStateEvents]);
+  return (0, exports.orderHistory)([...newHistoryEvents, ...newStateEvents]);
 };
 
 exports.mergeHistory = mergeHistory;
@@ -8280,7 +8281,8 @@ exports.storeSlice = (0, toolkit_1.createSlice)({
       } = payload;
 
       if (matchedEvent) {
-        state.events = orderHistory(state.events.map(m => m.payload.id === matchedEvent.payload.id ? Object.assign(Object.assign({}, m), {
+        state.events = (0, exports.orderHistory)( //@ts-ignore
+        state.events.map(m => m.payload.id === matchedEvent.payload.id ? Object.assign(Object.assign({}, m), {
           payload: Object.assign(Object.assign({}, m.payload), {
             id,
             occurredAt
@@ -8340,9 +8342,11 @@ exports.storeSlice = (0, toolkit_1.createSlice)({
       }
 
       const {
-        entry,
-        uploads
+        entry
       } = activeServiceSettings;
+      const {
+        upload
+      } = entry.options;
       const historyNewEntryMeta = calculateNewEntryMeta(Object.assign(Object.assign(Object.assign({}, state.entryMeta), entry), {
         active: entry.default || seamly_utils_1.payloadTypes.text,
         options: Object.assign({}, entry && entry.options ? entry.options : {})
@@ -8350,14 +8354,14 @@ exports.storeSlice = (0, toolkit_1.createSlice)({
       let newFeatures = Object.assign({}, state.options.features);
       const newFeaturesHasUpload = newFeatures.hasOwnProperty(seamly_utils_1.featureKeys.uploads); // Only set uploads if it was initialised by the account config.
 
-      if (newFeaturesHasUpload && lastParticipantEvent.type === 'message') {
+      if (newFeaturesHasUpload && (lastParticipantEvent === null || lastParticipantEvent === void 0 ? void 0 : lastParticipantEvent.type) === 'message') {
         const {
           payload: lastParticipantEventPayload
         } = lastParticipantEvent;
         const entryType = ((_a = lastParticipantEventPayload === null || lastParticipantEventPayload === void 0 ? void 0 : lastParticipantEventPayload.entry) === null || _a === void 0 ? void 0 : _a.type) || {};
         newFeatures = Object.assign(Object.assign({}, newFeatures), {
           uploads: {
-            enabled: !!(uploads && uploads.enabled),
+            enabled: !!(upload && upload.enabled),
             enabledFromEntry: entryType === seamly_utils_1.entryTypes.upload
           }
         });
@@ -8374,7 +8378,7 @@ exports.storeSlice = (0, toolkit_1.createSlice)({
       state.serviceInfo = Object.assign(Object.assign({}, state.serviceInfo), {
         activeServiceSessionId
       });
-      state.serviceData = serviceData || {};
+      state.serviceData = Object.assign(Object.assign({}, state.serviceData), serviceData);
       state.options = Object.assign(Object.assign({}, state.options), {
         features: newFeatures || {}
       });
@@ -8445,8 +8449,8 @@ exports.storeSlice = (0, toolkit_1.createSlice)({
     setActiveService: (state, {
       payload
     }) => {
-      if (state.serviceInfo.activeServiceSessionId !== payload.activeServiceSessionId) {
-        state.serviceInfo.activeServiceSessionId = payload.activeServiceSessionId;
+      if (state.serviceInfo.activeServiceSessionId !== payload) {
+        state.serviceInfo.activeServiceSessionId = payload;
       }
     },
     setHeaderTitle: (state, {
@@ -8638,7 +8642,7 @@ Object.defineProperty(exports, "__esModule", ({
 }));
 exports.useLocaleNativeName = exports.useTranslationsContainer = exports.useTranslatedEventData = exports.useTranslations = void 0;
 
-const selectors_1 = __webpack_require__(5238);
+const selectors_1 = __webpack_require__(6787);
 
 const slice_1 = __webpack_require__(841);
 
@@ -8655,7 +8659,7 @@ function useTranslations() {
     sendAction
   } = (0, seamly_hooks_1.useSeamlyCommands)();
   const dispatch = (0, react_redux_1.useDispatch)();
-  const enableTranslations = (0, seamly_hooks_1.useStableCallback)(locale => {
+  const enableTranslations = (0, hooks_1.useCallback)(locale => {
     sendAction({
       type: seamly_utils_1.actionTypes.setTranslation,
       body: {
@@ -8664,18 +8668,15 @@ function useTranslations() {
       }
     });
     dispatch((0, slice_1.enableTranslation)(locale));
-  }, // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-  // @ts-ignore
-  [sendAction, dispatch]);
-  const disableTranslations = (0, seamly_hooks_1.useStableCallback)(() => {
+  }, [sendAction, dispatch]);
+  const disableTranslations = (0, hooks_1.useCallback)(() => {
     sendAction({
       type: seamly_utils_1.actionTypes.setTranslation,
       body: {
         enabled: false
       }
     });
-    dispatch((0, slice_1.disableTranslation)()); // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
+    dispatch((0, slice_1.disableTranslation)());
   }, [sendAction, dispatch]);
   const {
     languages,
@@ -8697,44 +8698,40 @@ function useTranslations() {
 
 exports.useTranslations = useTranslations;
 
-function useTranslatedEventData({
-  payload
-}) {
-  const payloadId = payload === null || payload === void 0 ? void 0 : payload.id;
-  let body;
-  let translatedBody;
-
-  switch (payload === null || payload === void 0 ? void 0 : payload.type) {
-    case 'participant':
-      body = payload.participant.introduction;
-      translatedBody = payload.participant.translatedIntroduction;
-      break;
+function useTranslatedEventData(channelEvent) {
+  const getTranslations = () => {
+    var _a, _b, _c;
 
-    default:
-      body = payload === null || payload === void 0 ? void 0 : payload.body;
-      translatedBody = payload === null || payload === void 0 ? void 0 : payload.translatedBody;
-  }
+    if (!channelEvent.payload) return {
+      body: undefined,
+      translatedBody: undefined
+    };
 
-  const hasTranslation = !!translatedBody;
-  const isTranslated = (0, react_redux_1.useSelector)(store => // @ts-ignore
-  (0, selectors_1.getIsPayloadTranslated)(store, payloadId));
-  const dispatch = (0, react_redux_1.useDispatch)();
-  const toggleTranslation = (0, seamly_hooks_1.useStableCallback)(() => {
-    if (isTranslated) {
-      dispatch((0, slice_1.disableEvent)(payloadId));
-    } else {
-      dispatch((0, slice_1.enableEvent)(payloadId));
-    } // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
+    if (channelEvent.type === 'participant') {
+      return {
+        body: (_a = channelEvent.payload) === null || _a === void 0 ? void 0 : _a.participant.introduction,
+        translatedBody: (_c = (_b = channelEvent.payload) === null || _b === void 0 ? void 0 : _b.participant) === null || _c === void 0 ? void 0 : _c.translatedIntroduction
+      };
+    }
 
-  }, [isTranslated, payloadId, dispatch]);
-  return [hasTranslation && isTranslated ? translatedBody === null || translatedBody === void 0 ? void 0 : translatedBody.data : body, {
+    return {
+      body: channelEvent.payload.body,
+      translatedBody: channelEvent.payload.translatedBody
+    };
+  };
+
+  const {
+    translatedBody,
+    body
+  } = getTranslations();
+  const hasTranslation = !!translatedBody;
+  const isTranslated = (0, react_redux_1.useSelector)((0, selectors_1.selectIsTranslated)(channelEvent));
+  return {
+    body: hasTranslation && isTranslated ? translatedBody === null || translatedBody === void 0 ? void 0 : translatedBody.data : body,
     hasTranslation,
     isTranslated: isTranslated && hasTranslation,
-    toggleTranslation,
-    translatedBy: translatedBody === null || translatedBody === void 0 ? void 0 : translatedBody.translatedBy,
     locale: translatedBody === null || translatedBody === void 0 ? void 0 : translatedBody.locale
-  }];
+  };
 }
 
 exports.useTranslatedEventData = useTranslatedEventData;
@@ -8767,6 +8764,29 @@ exports.useLocaleNativeName = useLocaleNativeName;
 
 /***/ }),
 
+/***/ 6787:
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+
+
+Object.defineProperty(exports, "__esModule", ({
+  value: true
+}));
+exports.selectIsTranslated = void 0;
+
+const toolkit_1 = __webpack_require__(575);
+
+const selectIsTranslated = channelEvent => (0, toolkit_1.createSelector)(store => store.translations.translatedEventGroups, translatedEventGroups => Object.values(translatedEventGroups).every(value => {
+  var _a;
+
+  return !value.includes((_a = channelEvent === null || channelEvent === void 0 ? void 0 : channelEvent.payload) === null || _a === void 0 ? void 0 : _a.id);
+}));
+
+exports.selectIsTranslated = selectIsTranslated;
+
+/***/ }),
+
 /***/ 841:
 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
 
@@ -8778,22 +8798,58 @@ var _a;
 Object.defineProperty(exports, "__esModule", ({
   value: true
 }));
-exports.disableEvent = exports.enableEvent = exports.disableTranslation = exports.enableTranslation = exports.translationSlice = exports.translationsInitialState = void 0;
+exports.disableEventsTranslation = exports.enableEventsTranslation = exports.disableTranslation = exports.enableTranslation = exports.translationSlice = exports.translationsInitialState = void 0;
 
 const toolkit_1 = __webpack_require__(575);
 
-const actions_1 = __webpack_require__(4134);
+const actions_1 = __webpack_require__(915);
 
-const actions_2 = __webpack_require__(915);
+const slice_1 = __webpack_require__(1153);
 
 exports.translationsInitialState = {
   isActive: false,
   currentLocale: undefined,
   isAvailable: false,
   languages: [],
-  originalPayloadIds: [],
-  containerId: (0, toolkit_1.nanoid)()
+  containerId: (0, toolkit_1.nanoid)(),
+  translatedEventGroups: {}
+};
+
+const getLastGroupId = (events, id) => {
+  const eventGroup = [...events].reduce((acc, {
+    payload
+  }, _index, arr) => {
+    var _a;
+
+    if (acc[id]) {
+      // Splice to break early (make the reducer think we are done)
+      // This is needed to avoid events of other groups from being added to the array.
+      // @ts-ignore
+      if ((payload === null || payload === void 0 ? void 0 : payload.type) === 'divider' && ((_a = payload === null || payload === void 0 ? void 0 : payload.body) === null || _a === void 0 ? void 0 : _a.translationEnabled)) {
+        arr.splice(0);
+        return acc;
+      }
+
+      acc[id].push(payload.id);
+    }
+
+    if (payload.id === id) acc[id] = [];
+    return acc;
+  }, {});
+  const [[groupId, eventIds]] = Object.entries(eventGroup);
+  const lastGroupId = events //@ts-ignore
+  .filter(event => {
+    var _a;
+
+    return ((_a = event.payload) === null || _a === void 0 ? void 0 : _a.type) === 'divider';
+  }).map(event => event.payload.id).at(-1);
+  return {
+    lastGroupId,
+    groupId,
+    eventIds
+  };
 };
+
 exports.translationSlice = (0, toolkit_1.createSlice)({
   name: 'translation',
   initialState: exports.translationsInitialState,
@@ -8808,35 +8864,35 @@ exports.translationSlice = (0, toolkit_1.createSlice)({
       state.isActive = false;
       state.currentLocale = undefined;
     },
-    enableEvent: (state, {
-      payload
-    }) => {
-      if (!state.originalPayloadIds.includes(payload)) {
-        return;
+    enableEventsTranslation: (state, {
+      payload: {
+        events,
+        id
       }
-
-      state.originalPayloadIds = state.originalPayloadIds.filter(id => id !== payload);
-    },
-    disableEvent: (state, {
-      payload
     }) => {
-      if (state.originalPayloadIds.includes(payload)) {
-        return;
+      delete state.translatedEventGroups[id];
+      const {
+        lastGroupId
+      } = getLastGroupId(events, id);
+      state.lastGroupId = lastGroupId;
+    },
+    disableEventsTranslation: (state, {
+      payload: {
+        events,
+        id
       }
-
-      state.originalPayloadIds.push(payload);
+    }) => {
+      const {
+        lastGroupId,
+        groupId,
+        eventIds
+      } = getLastGroupId(events, id);
+      state.lastGroupId = lastGroupId;
+      state.translatedEventGroups[groupId] = eventIds;
     }
   },
   extraReducers: builder => {
-    builder.addCase(actions_1.initializeApp.fulfilled, (state, {
-      payload
-    }) => {
-      var _a, _b;
-
-      if (!((_b = (_a = payload.config) === null || _a === void 0 ? void 0 : _a.context) === null || _b === void 0 ? void 0 : _b.translationLocale)) return;
-      state.isActive = true;
-      state.currentLocale = payload.locale;
-    }).addCase(actions_2.initializeConfig.fulfilled, (state, {
+    builder.addCase(actions_1.initializeConfig.fulfilled, (state, {
       payload
     }) => {
       var _a;
@@ -8845,10 +8901,16 @@ exports.translationSlice = (0, toolkit_1.createSlice)({
       if (!feature) return;
       state.isAvailable = feature.enabled === true;
       state.languages = feature.languages;
+    }).addCase(slice_1.addEvent, (state, {
+      payload
+    }) => {
+      if (state.translatedEventGroups[state.lastGroupId]) {
+        state.translatedEventGroups[state.lastGroupId].push(payload.payload.id);
+      }
     });
   }
 });
-_a = exports.translationSlice.actions, exports.enableTranslation = _a.enableTranslation, exports.disableTranslation = _a.disableTranslation, exports.enableEvent = _a.enableEvent, exports.disableEvent = _a.disableEvent;
+_a = exports.translationSlice.actions, exports.enableTranslation = _a.enableTranslation, exports.disableTranslation = _a.disableTranslation, exports.enableEventsTranslation = _a.enableEventsTranslation, exports.disableEventsTranslation = _a.disableEventsTranslation;
 exports["default"] = exports.translationSlice.reducer;
 
 /***/ }),
@@ -9753,13 +9815,13 @@ class SeamlyBaseError extends Error {
 
     this.originalError = originalError;
 
-    if (originalError !== null && originalError !== void 0 && originalError.payload) {
+    if (originalError?.payload) {
       this.originalEvent = originalError;
       this.originalError = originalError.payload.error;
       this.message = `Event of type ${originalError.payload.type} encountered`;
     }
 
-    if (originalError !== null && originalError !== void 0 && originalError.error) {
+    if (originalError?.error) {
       this.originalError = originalError.error;
     }
   }
@@ -11541,8 +11603,6 @@ class API {
 
   async createConversation() {
     try {
-      var _conversation$transla;
-
       const request = client_default().post(`${this.getUrlPrefix('http')}${this.URLS.conversations}`).set('Content-Type', 'application/json').query({
         v: config.apiVersion
       }) // withCredentials() is necessary to allow browsers to save received
@@ -11565,7 +11625,7 @@ class API {
       this.setChannelTopic(conversation.channelTopic);
       this.updateUrls(body);
       this.setConversationUrl(this.URLS.conversation);
-      this.locale = (_conversation$transla = conversation.translation) === null || _conversation$transla === void 0 ? void 0 : _conversation$transla.locale;
+      this.locale = conversation.translation?.locale;
       this.userResponded = conversation.userResponded;
       return initialState;
     } catch (error) {
@@ -11800,7 +11860,7 @@ class API {
     return {
       clientName: "@seamly/web-ui",
       clientVariant: this.layoutMode,
-      clientVersion: "20.8.0-alpha.1",
+      clientVersion: "20.7.0",
       currentUrl: window.location.toString(),
       screenResolution: `${window.screen.width}x${window.screen.height}`,
       timezone: getTimeZone(),
@@ -11856,7 +11916,7 @@ function createErrorsMiddleware({
         api,
         layoutMode
       } = (0,domains_config_selectors__WEBPACK_IMPORTED_MODULE_0__.selectConfig)(getState());
-      errorCallback === null || errorCallback === void 0 ? void 0 : errorCallback(action.error, {
+      errorCallback?.(action.error, {
         namespace,
         api,
         layoutMode,
@@ -11867,14 +11927,10 @@ function createErrorsMiddleware({
 
     return next => action => {
       try {
-        var _action$payload, _action$payload$origi;
-
-        if ((_action$payload = action.payload) !== null && _action$payload !== void 0 && (_action$payload$origi = _action$payload.originalEvent) !== null && _action$payload$origi !== void 0 && _action$payload$origi.payload) {
-          var _action$payload2, _action$payload2$orig, _action$payload2$orig2;
-
+        if (action.payload?.originalEvent?.payload) {
           handleError({
             error: action.payload,
-            type: (_action$payload2 = action.payload) === null || _action$payload2 === void 0 ? void 0 : (_action$payload2$orig = _action$payload2.originalEvent) === null || _action$payload2$orig === void 0 ? void 0 : (_action$payload2$orig2 = _action$payload2$orig.payload) === null || _action$payload2$orig2 === void 0 ? void 0 : _action$payload2$orig2.type
+            type: action.payload?.originalEvent?.payload?.type
           });
         }
 
@@ -11957,8 +12013,6 @@ function createI18nMiddleware({
 }) {
   return next => {
     return action => {
-      var _payload$translation, _payload$translation2, _payload$payload, _payload$payload$body;
-
       const result = next(action);
       const {
         payload
@@ -11966,7 +12020,7 @@ function createI18nMiddleware({
 
       switch (action.type) {
         case domains_store_slice__WEBPACK_IMPORTED_MODULE_3__.setHistory.type:
-          if (payload !== null && payload !== void 0 && (_payload$translation = payload.translation) !== null && _payload$translation !== void 0 && _payload$translation.enabled) {
+          if (payload?.translation?.enabled) {
             dispatch((0,domains_translations_slice__WEBPACK_IMPORTED_MODULE_4__.enableTranslation)(payload.translation.locale));
             dispatch((0,domains_i18n_actions__WEBPACK_IMPORTED_MODULE_1__.setLocale)(payload.translation.locale));
           }
@@ -11981,14 +12035,14 @@ function createI18nMiddleware({
           break;
 
         case domains_store_slice__WEBPACK_IMPORTED_MODULE_3__.setInitialState.type:
-          if (payload !== null && payload !== void 0 && (_payload$translation2 = payload.translation) !== null && _payload$translation2 !== void 0 && _payload$translation2.enabled) {
+          if (payload?.translation?.enabled) {
             dispatch((0,domains_translations_slice__WEBPACK_IMPORTED_MODULE_4__.enableTranslation)(payload.translation.locale));
           }
 
           break;
 
         case domains_store_slice__WEBPACK_IMPORTED_MODULE_3__.addEvent.type:
-          if (payload.type === 'info' && (payload === null || payload === void 0 ? void 0 : (_payload$payload = payload.payload) === null || _payload$payload === void 0 ? void 0 : (_payload$payload$body = _payload$payload.body) === null || _payload$payload$body === void 0 ? void 0 : _payload$payload$body.subtype) === 'new_translation' && payload.payload.body.translationEnabled) {
+          if (payload.type === 'info' && payload?.payload?.body?.subtype === 'new_translation' && payload.payload.body.translationEnabled) {
             dispatch((0,domains_i18n_actions__WEBPACK_IMPORTED_MODULE_1__.setLocale)(payload.payload.body.translationLocale));
           }
 
@@ -12007,26 +12061,6 @@ function createI18nMiddleware({
 
 /***/ }),
 
-/***/ 5238:
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "getIsPayloadTranslated": () => (/* binding */ getIsPayloadTranslated),
-/* harmony export */   "getOriginalPayloadIds": () => (/* binding */ getOriginalPayloadIds)
-/* harmony export */ });
-/* harmony import */ var _reduxjs_toolkit__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(573);
-
-const getOriginalPayloadIds = (0,_reduxjs_toolkit__WEBPACK_IMPORTED_MODULE_0__.createSelector)(({
-  translations
-}) => translations, ({
-  originalPayloadIds
-}) => originalPayloadIds);
-const getIsPayloadTranslated = (0,_reduxjs_toolkit__WEBPACK_IMPORTED_MODULE_0__.createSelector)([getOriginalPayloadIds, (_, payloadId) => payloadId], (payloadIds, payloadId) => !payloadIds.includes(payloadId));
-
-/***/ }),
-
 /***/ 2629:
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
@@ -12405,12 +12439,14 @@ const SeamlyEventSubscriber = ({
                       eventPayload = _objectWithoutProperties(payload, _excluded);
 
                 const {
-                  uploads,
                   entry
                 } = serviceSettings;
+                const {
+                  upload
+                } = entry.options;
                 dispatch((0,store_slice.setFeatureEnabledState)({
                   key: seamly_utils.featureKeys.uploads,
-                  enabled: !!(uploads && uploads.enabled)
+                  enabled: !!(upload && upload.enabled)
                 }));
                 dispatch((0,store_slice.setServiceEntryMetadata)(entry));
                 dispatch((0,store_slice.setActiveService)(payload.serviceSessionId));
@@ -12727,11 +12763,7 @@ function useSeamlyInstanceFunction(functionName, fn, deps = []) {
       return undefined;
     }
 
-    const callback = (...args) => {
-      var _callbackRef$current;
-
-      return (_callbackRef$current = callbackRef.current) === null || _callbackRef$current === void 0 ? void 0 : _callbackRef$current.call(callbackRef, ...args);
-    };
+    const callback = (...args) => callbackRef.current?.(...args);
 
     eventBus.emit('function.register', functionName, callback);
     return () => eventBus.emit('function.unregister', functionName, callback); // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -12776,12 +12808,12 @@ const SeamlyInstanceFunctionsLoader = () => {
     sendMessage({
       body: text
     });
-  }, [api === null || api === void 0 ? void 0 : api.send]);
+  }, [api?.send]);
   useSeamlyInstanceFunction('setVariables', variables => {
     sendContext({
       variables
     });
-  }, [api === null || api === void 0 ? void 0 : api.send]);
+  }, [api?.send]);
   useSeamlyInstanceFunction('getVisibility', callback => {
     if (callback) {
       callback(currentVisibility.current);
@@ -12797,7 +12829,7 @@ const SeamlyInstanceFunctionsLoader = () => {
 
     onActivityHandler();
     setVisibility(visibilityState);
-  }, [config === null || config === void 0 ? void 0 : config.api]);
+  }, [config?.api]);
   useSeamlyInstanceFunction('sendCustomAction', (actionType, body) => {
     sendAction({
       type: 'custom',
@@ -13476,9 +13508,7 @@ class ExternalApi {
   }
 
   getMergedVariables(userConfig) {
-    var _this$appConfig$conte, _userConfig$context;
-
-    return _objectSpread(_objectSpread(_objectSpread({}, ((_this$appConfig$conte = this.appConfig.context) === null || _this$appConfig$conte === void 0 ? void 0 : _this$appConfig$conte.variables) || {}), ((_userConfig$context = userConfig.context) === null || _userConfig$context === void 0 ? void 0 : _userConfig$context.variables) || {}), this.context.variables || {});
+    return _objectSpread(_objectSpread(_objectSpread({}, this.appConfig.context?.variables || {}), userConfig.context?.variables || {}), this.context.variables || {});
   }
 
 }
@@ -15116,7 +15146,9 @@ const Image = _ref => {
   } = _ref,
       props = _objectWithoutProperties(_ref, _excluded);
 
-  const [body] = (0,translations_hooks.useTranslatedEventData)(event);
+  const {
+    body
+  } = (0,translations_hooks.useTranslatedEventData)(event);
   const {
     description,
     url,
@@ -15174,7 +15206,9 @@ const Video = _ref => {
   } = _ref,
       props = video_objectWithoutProperties(_ref, video_excluded);
 
-  const [body] = (0,translations_hooks.useTranslatedEventData)(event);
+  const {
+    body
+  } = (0,translations_hooks.useTranslatedEventData)(event);
   const {
     description,
     url
@@ -15232,6 +15266,8 @@ const Divider = ({
 };
 
 /* harmony default export */ const variants_default = (Divider);
+// EXTERNAL MODULE: ./src/javascripts/domains/translations/slice.ts
+var translations_slice = __webpack_require__(841);
 ;// CONCATENATED MODULE: ./src/javascripts/ui/components/conversation/event/divider/variants/new-translation.js
 
 
@@ -15240,21 +15276,46 @@ const Divider = ({
 
 
 
+
+
+
+
+
 const NewTranslationDivider = ({
   event
 }) => {
   const {
     t
   } = (0,i18n_hooks.useI18n)();
+  const events = (0,seamly_hooks.useEvents)();
   const {
-    translationEnabled,
-    translationLocale,
-    text
-  } = event.payload.body;
+    body: {
+      translationEnabled,
+      translationLocale,
+      text
+    },
+    id
+  } = event.payload;
   const {
     enableTranslations
   } = (0,translations_hooks.useTranslations)();
   const localeNativeName = (0,translations_hooks.useLocaleNativeName)(translationLocale);
+  const translatedEventGroups = (0,es.useSelector)(state => state.translations.translatedEventGroups);
+  const dispatch = (0,es.useDispatch)();
+  const toggleTranslations = (0,hooks_.useCallback)(() => {
+    if (!translatedEventGroups[id]) {
+      dispatch((0,translations_slice.disableEventsTranslation)({
+        events,
+        id
+      }));
+      return;
+    }
+
+    dispatch((0,translations_slice.enableEventsTranslation)({
+      events,
+      id
+    }));
+  }, [dispatch, events, id, translatedEventGroups]);
 
   const handleRestartButtonclick = () => {
     enableTranslations(translationLocale);
@@ -15268,10 +15329,17 @@ const NewTranslationDivider = ({
       children: t(translationEnabled ? 'translations.divider.startText' : 'translations.divider.stopText', {
         language: localeNativeName
       })
-    }), translationEnabled ? (0,jsx_runtime_.jsx)("p", {
-      children: text
+    }), translationEnabled ? (0,jsx_runtime_.jsxs)(jsx_runtime_.Fragment, {
+      children: [(0,jsx_runtime_.jsx)("p", {
+        children: text
+      }), (0,jsx_runtime_.jsx)("button", {
+        className: (0,css.className)('button', 'button--secondary'),
+        onClick: toggleTranslations,
+        children: t(!translatedEventGroups[id] ? 'translations.toggle.hideTranslationsButtonText' : 'translations.toggle.showTranslationsButtonText')
+      })]
     }) : (0,jsx_runtime_.jsx)("button", {
       className: (0,css.className)('button', 'button--secondary'),
+      "data-testid": "restartTranslationButton",
       onClick: handleRestartButtonclick,
       children: t('translations.divider.restartButtonText')
     })]
@@ -15341,7 +15409,9 @@ const Translation = _ref => {
   const {
     t
   } = (0,i18n_hooks.useI18n)();
-  const [body] = (0,translations_hooks.useTranslatedEventData)(event);
+  const {
+    body
+  } = (0,translations_hooks.useTranslatedEventData)(event);
   return (0,jsx_runtime_.jsx)(message_container["default"], translation_objectSpread(translation_objectSpread({
     type: "text",
     event: event
@@ -15362,7 +15432,9 @@ const Participant = ({
   const {
     participant
   } = event.payload;
-  const [introduction] = (0,translations_hooks.useTranslatedEventData)(event);
+  const {
+    body: introduction
+  } = (0,translations_hooks.useTranslatedEventData)(event);
 
   if (!introduction) {
     return null;
@@ -15407,7 +15479,9 @@ const Splash = _ref => {
   const {
     payload
   } = event;
-  const [body] = (0,translations_hooks.useTranslatedEventData)(event);
+  const {
+    body
+  } = (0,translations_hooks.useTranslatedEventData)(event);
   const eventClick = (0,use_event_link_click_handler/* default */.Z)(payload.id);
   return (0,jsx_runtime_.jsx)(message_container["default"], splash_objectSpread(splash_objectSpread({
     type: "splash",
@@ -15469,7 +15543,9 @@ const Upload = _ref => {
   const {
     t
   } = (0,i18n_hooks.useI18n)();
-  const [body] = (0,translations_hooks.useTranslatedEventData)(event);
+  const {
+    body
+  } = (0,translations_hooks.useTranslatedEventData)(event);
   const {
     fromClient
   } = event.payload;
@@ -15519,7 +15595,9 @@ const Upload = _ref => {
 const Cta = ({
   event
 }) => {
-  const [body] = (0,translations_hooks.useTranslatedEventData)(event);
+  const {
+    body
+  } = (0,translations_hooks.useTranslatedEventData)(event);
   const eventClick = (0,use_event_link_click_handler/* default */.Z)(event.payload.id);
   const {
     emitEvent
@@ -15911,7 +15989,9 @@ const getItemLabel = item => item.title;
 const CarouselMessage = ({
   event
 }) => {
-  const [body] = (0,translations_hooks.useTranslatedEventData)(event);
+  const {
+    body
+  } = (0,translations_hooks.useTranslatedEventData)(event);
   const slides = body.cards;
   return (0,jsx_runtime_.jsx)(message_container["default"], {
     event: event,
@@ -15942,7 +16022,9 @@ function card_message_defineProperty(obj, key, value) { if (key in obj) { Object
 const CardMessage = ({
   event
 }) => {
-  const [body] = (0,translations_hooks.useTranslatedEventData)(event);
+  const {
+    body
+  } = (0,translations_hooks.useTranslatedEventData)(event);
   const descriptionId = (0,seamly_hooks.useGeneratedId)();
   return (0,jsx_runtime_.jsx)(message_container["default"], {
     type: "card",
@@ -15986,11 +16068,14 @@ function conversation_suggestions_objectWithoutPropertiesLoose(source, excluded)
 
 
 
+
 const useSuggestions = event => {
   const {
     payload
   } = event;
-  const [suggestions] = (0,translations_hooks.useTranslatedEventData)(event);
+  const {
+    body: suggestions
+  } = (0,translations_hooks.useTranslatedEventData)(event);
   return {
     suggestions,
     payload
@@ -16014,6 +16099,9 @@ const ConversationSuggestions = _ref => {
     suggestions,
     payload
   } = useSuggestions(event);
+  const {
+    showSuggestions
+  } = (0,hooks.useConfig)();
   const events = (0,seamly_hooks.useEvents)();
   const {
     t
@@ -16024,7 +16112,7 @@ const ConversationSuggestions = _ref => {
 
   const hasLastTransactionEvent = (0,hooks_.useMemo)(() => events.some(({
     payload: eventPayload
-  }) => eventPayload === null || eventPayload === void 0 ? void 0 : eventPayload.transactionLast), [events]);
+  }) => eventPayload?.transactionLast), [events]);
   const handleClick = (0,hooks_.useCallback)(({
     id,
     question
@@ -16046,7 +16134,7 @@ const ConversationSuggestions = _ref => {
     addMessageBubble(question);
   }, [dispatch, sendAction, payload.id, addMessageBubble]);
 
-  if (!isExpanded || userHasResponded || !hasLastTransactionEvent) {
+  if (!isExpanded || userHasResponded || !hasLastTransactionEvent || !showSuggestions) {
     return null;
   }
 
@@ -16205,6 +16293,8 @@ const PrivacyDisclaimer = () => {
 };
 
 /* harmony default export */ const privacy_disclaimer = (PrivacyDisclaimer);
+// EXTERNAL MODULE: ./src/javascripts/ui/hooks/focus-helper-hooks.js
+var focus_helper_hooks = __webpack_require__(8956);
 // EXTERNAL MODULE: ./src/javascripts/ui/hooks/seamly-hooks.js + 2 modules
 var seamly_hooks = __webpack_require__(2849);
 // EXTERNAL MODULE: ./src/javascripts/ui/hooks/seamly-state-hooks.js
@@ -16317,6 +16407,7 @@ const Loader = () => {
 
 
 
+
 const Events = () => {
   const events = (0,seamly_state_hooks.useEvents)();
   let prevParticipant = null;
@@ -16361,11 +16452,15 @@ const Conversation = () => {
   const skiplinkTargetId = (0,seamly_hooks.useSkiplink)();
   const focusSkiplinkTarget = (0,seamly_hooks.useSkiplinkTargetFocusing)();
   const loadedImageEventIds = (0,seamly_state_hooks.useLoadedImageEventIds)();
-  (0,hooks_.useEffect)(() => {
+  (0,hooks_.useLayoutEffect)(() => {
     const containerElement = chatBodyContainer.current;
 
     if (containerElement) {
-      containerElement.scrollTop = containerElement.scrollHeight;
+      requestAnimationFrame(async () => {
+        await (0,focus_helper_hooks/* timeout */.Vs)(30); // Wait for next frame tick
+
+        containerElement.scrollTop = containerElement.scrollHeight;
+      });
     }
   }, [events, isLoading, isOpen, loadedImageEventIds]);
 
@@ -16524,16 +16619,16 @@ const useChoicePrompt = event => {
     activeServiceSessionId
   } = (0,ui_hooks_seamly_hooks__WEBPACK_IMPORTED_MODULE_2__.useSeamlyServiceInfo)();
   const lastEventId = (0,ui_hooks_seamly_hooks__WEBPACK_IMPORTED_MODULE_2__.useLastMessageEventId)();
-  const [body] = (0,domains_translations_hooks__WEBPACK_IMPORTED_MODULE_7__.useTranslatedEventData)(event);
+  const {
+    body
+  } = (0,domains_translations_hooks__WEBPACK_IMPORTED_MODULE_7__.useTranslatedEventData)(event);
   const {
     service
   } = payload;
   const subEvent = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_1__.useMemo)(() => {
-    var _event$payload$body;
-
     return _objectSpread(_objectSpread({}, event), {}, {
       payload: _objectSpread(_objectSpread({}, event.payload), {}, {
-        body: (_event$payload$body = event.payload.body) === null || _event$payload$body === void 0 ? void 0 : _event$payload$body.prompt,
+        body: event.payload.body?.prompt,
         translatedBody: event.payload.translatedBody && _objectSpread(_objectSpread({}, event.payload.translatedBody), {}, {
           data: event.payload.translatedBody.data.prompt
         })
@@ -16679,13 +16774,11 @@ const timeFormatOptions = {
   minute: 'numeric'
 };
 const useFormattedDate = date => {
-  var _config$context;
-
   const {
     t
   } = (0,hooks.useI18n)();
   const config = (0,config_hooks.useConfig)();
-  const locale = (config === null || config === void 0 ? void 0 : (_config$context = config.context) === null || _config$context === void 0 ? void 0 : _config$context.locale) ?? [];
+  const locale = config?.context?.locale ?? [];
   const eventDate = new Date(date);
   const currentDate = new Date();
   const midnight = new Date(currentDate);
@@ -16925,7 +17018,9 @@ const Text = _ref => {
   } = _ref,
       props = _objectWithoutProperties(_ref, _excluded);
 
-  const [body] = (0,domains_translations_hooks__WEBPACK_IMPORTED_MODULE_2__.useTranslatedEventData)(event);
+  const {
+    body
+  } = (0,domains_translations_hooks__WEBPACK_IMPORTED_MODULE_2__.useTranslatedEventData)(event);
   const eventClick = (0,_hooks_use_event_link_click_handler__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z)(event.payload.id);
   const containerProps = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => {
     if (event.payload.optimisticallyInjected) {
@@ -16966,12 +17061,10 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var lib_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5567);
 /* harmony import */ var ui_hooks_component_helper_hooks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(3357);
 /* harmony import */ var domains_translations_hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(2108);
-/* harmony import */ var domains_i18n_hooks__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(546);
-/* harmony import */ var domains_i18n_hooks__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(domains_i18n_hooks__WEBPACK_IMPORTED_MODULE_3__);
-/* harmony import */ var _event_event_participant__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(7409);
-/* harmony import */ var preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(7844);
-/* harmony import */ var preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
-const _excluded = ["showParticipant", "showTranslationToggle", "event", "type", "modifiers", "children", "bodyProps", "info"];
+/* harmony import */ var _event_event_participant__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(7409);
+/* harmony import */ var preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(7844);
+/* harmony import */ var preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__);
+const _excluded = ["showParticipant", "event", "type", "modifiers", "children", "bodyProps", "info"];
 
 function 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; }
 
@@ -16991,11 +17084,9 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 
 
-
 function MessageContainer(_ref) {
   let {
     showParticipant = true,
-    showTranslationToggle = true,
     event,
     type,
     modifiers,
@@ -17007,14 +17098,10 @@ function MessageContainer(_ref) {
 
   const classNames = (0,ui_hooks_component_helper_hooks__WEBPACK_IMPORTED_MODULE_1__/* .useSeamlyMessageContainerClassNames */ .j)(event);
   const {
-    t
-  } = (0,domains_i18n_hooks__WEBPACK_IMPORTED_MODULE_3__.useI18n)();
-  const [, {
     hasTranslation,
     isTranslated,
-    toggleTranslation,
     locale
-  }] = (0,domains_translations_hooks__WEBPACK_IMPORTED_MODULE_2__.useTranslatedEventData)(event);
+  } = (0,domains_translations_hooks__WEBPACK_IMPORTED_MODULE_2__.useTranslatedEventData)(event);
 
   if (type) {
     classNames.push(`message--type-${type}`);
@@ -17046,27 +17133,20 @@ function MessageContainer(_ref) {
     });
   }
 
-  return (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
-    children: (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", _objectSpread(_objectSpread({
+  return (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
+    children: (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", _objectSpread(_objectSpread({
       className: (0,lib_css__WEBPACK_IMPORTED_MODULE_0__.className)(classNames)
     }, props), {}, {
-      children: [showParticipant && (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_event_event_participant__WEBPACK_IMPORTED_MODULE_4__["default"], {
+      children: [showParticipant && (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_event_event_participant__WEBPACK_IMPORTED_MODULE_3__["default"], {
         eventPayload: event.payload
-      }), (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", _objectSpread(_objectSpread({
+      }), (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", _objectSpread(_objectSpread({
         className: (0,lib_css__WEBPACK_IMPORTED_MODULE_0__.className)('message__body')
       }, bodyProps), {}, {
         children: children
-      })), info && (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
+      })), info && (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
         "aria-hidden": "true",
         className: (0,lib_css__WEBPACK_IMPORTED_MODULE_0__.className)('message__info'),
         children: info
-      }), showTranslationToggle && hasTranslation && (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
-        className: (0,lib_css__WEBPACK_IMPORTED_MODULE_0__.className)('message__translation-info'),
-        children: (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("button", {
-          className: (0,lib_css__WEBPACK_IMPORTED_MODULE_0__.className)('message__translation-toggle', 'button', 'button--secondary'),
-          onClick: toggleTranslation,
-          children: t(isTranslated ? 'translations.toggle.hideButtonText' : 'translations.toggle.showButtonText')
-        })
       })]
     }))
   });
@@ -18683,7 +18763,7 @@ const AgentInfo = () => {
     hasInterrupt
   } = (0,domains_interrupt_hooks__WEBPACK_IMPORTED_MODULE_3__.useInterrupt)();
   const startChatIcon = (0,domains_config_hooks__WEBPACK_IMPORTED_MODULE_4__.useStartChatIcon)();
-  const src = (currentAgent === null || currentAgent === void 0 ? void 0 : currentAgent.avatar) ?? startChatIcon;
+  const src = currentAgent?.avatar ?? startChatIcon;
   const displaySubtitle = hasInterrupt ? '' : subTitle;
   const classNames = ['message-count'];
 
@@ -18700,7 +18780,7 @@ const AgentInfo = () => {
     children: [(0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
       className: (0,lib_css__WEBPACK_IMPORTED_MODULE_1__.className)('agent-info__graphic'),
       children: [src ? (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("img", {
-        className: (0,lib_css__WEBPACK_IMPORTED_MODULE_1__.className)(currentAgent !== null && currentAgent !== void 0 && currentAgent.avatar ? 'avatar' : 'icon'),
+        className: (0,lib_css__WEBPACK_IMPORTED_MODULE_1__.className)(currentAgent?.avatar ? 'avatar' : 'icon'),
         src: src,
         alt: ""
       }) : (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_icon__WEBPACK_IMPORTED_MODULE_6__["default"], {
@@ -19034,11 +19114,7 @@ const OptionsButton = () => {
   const prevMenuIsOpen = (0,hooks_.useRef)(false);
   const multiMenu = optionsLength > 1;
   const firstOption = menuOptions[0];
-  const firstOptionName = (0,hooks_.useMemo)(() => {
-    var _firstOption$name;
-
-    return firstOption === null || firstOption === void 0 ? void 0 : (_firstOption$name = firstOption.name) === null || _firstOption$name === void 0 ? void 0 : _firstOption$name.trim().replace(/\s+/g, '');
-  }, [firstOption]);
+  const firstOptionName = (0,hooks_.useMemo)(() => firstOption?.name?.trim().replace(/\s+/g, ''), [firstOption]);
   (0,hooks_.useEffect)(() => {
     return () => {
       clearTimeout(focusOutDelayTimeoutID.current);
@@ -19047,7 +19123,7 @@ const OptionsButton = () => {
   (0,hooks_.useEffect)(() => {
     if (menuIsOpen && !prevMenuIsOpen.current) {
       requestAnimationFrame(async () => {
-        await (0,focus_helper_hooks/* timeout */.Vs)(180); // Wait for next 3 frame ticks
+        await (0,focus_helper_hooks/* timeout */.Vs)(60); // Wait for next frame tick
 
         const firstActiveOptionIndex = menuOptions.findIndex(option => option.available);
         const focusIndex = firstActiveOptionIndex === -1 ? 0 : firstActiveOptionIndex;
@@ -20107,30 +20183,32 @@ const Interrupt = ({
 /* harmony export */   "Z": () => (__WEBPACK_DEFAULT_EXPORT__)
 /* harmony export */ });
 /* harmony import */ var domains_app_hooks__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9279);
-/* harmony import */ var domains_i18n_hooks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(546);
-/* harmony import */ var domains_i18n_hooks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(domains_i18n_hooks__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var domains_interrupt_hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(8877);
-/* harmony import */ var domains_interrupt_hooks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(domains_interrupt_hooks__WEBPACK_IMPORTED_MODULE_2__);
-/* harmony import */ var domains_translations_hooks__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(2108);
-/* harmony import */ var domains_visibility_constants__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(2629);
-/* harmony import */ var domains_visibility_hooks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(3742);
-/* harmony import */ var domains_visibility_hooks__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(domains_visibility_hooks__WEBPACK_IMPORTED_MODULE_5__);
-/* harmony import */ var lib_css__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(5567);
-/* harmony import */ var preact_hooks__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(9207);
-/* harmony import */ var preact_hooks__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(preact_hooks__WEBPACK_IMPORTED_MODULE_7__);
-/* harmony import */ var ui_components_suggestions_suggestions_list__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(2841);
-/* harmony import */ var ui_components_widgets_in_out_transition__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(1433);
-/* harmony import */ var ui_hooks_focus_helper_hooks__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(8956);
-/* harmony import */ var ui_hooks_live_region_hooks__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(6639);
-/* harmony import */ var ui_hooks_seamly_state_hooks__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(4809);
-/* harmony import */ var ui_hooks_use_seamly_commands__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(4431);
-/* harmony import */ var ui_hooks_use_seamly_idle_detach_countdown__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(1154);
-/* harmony import */ var ui_hooks_use_seamly_resume_conversation_prompt__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(1256);
-/* harmony import */ var ui_hooks_utility_hooks__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(5029);
-/* harmony import */ var ui_utils_general_utils__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(4959);
-/* harmony import */ var ui_utils_seamly_utils__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(5740);
-/* harmony import */ var preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(7844);
-/* harmony import */ var preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_19___default = /*#__PURE__*/__webpack_require__.n(preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_19__);
+/* harmony import */ var domains_config_hooks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6065);
+/* harmony import */ var domains_i18n_hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(546);
+/* harmony import */ var domains_i18n_hooks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(domains_i18n_hooks__WEBPACK_IMPORTED_MODULE_2__);
+/* harmony import */ var domains_interrupt_hooks__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(8877);
+/* harmony import */ var domains_interrupt_hooks__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(domains_interrupt_hooks__WEBPACK_IMPORTED_MODULE_3__);
+/* harmony import */ var domains_translations_hooks__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(2108);
+/* harmony import */ var domains_visibility_constants__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(2629);
+/* harmony import */ var domains_visibility_hooks__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(3742);
+/* harmony import */ var domains_visibility_hooks__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(domains_visibility_hooks__WEBPACK_IMPORTED_MODULE_6__);
+/* harmony import */ var lib_css__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(5567);
+/* harmony import */ var preact_hooks__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(9207);
+/* harmony import */ var preact_hooks__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(preact_hooks__WEBPACK_IMPORTED_MODULE_8__);
+/* harmony import */ var ui_components_suggestions_suggestions_list__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(2841);
+/* harmony import */ var ui_components_widgets_in_out_transition__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(1433);
+/* harmony import */ var ui_hooks_focus_helper_hooks__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(8956);
+/* harmony import */ var ui_hooks_live_region_hooks__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(6639);
+/* harmony import */ var ui_hooks_seamly_state_hooks__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(4809);
+/* harmony import */ var ui_hooks_use_seamly_commands__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(4431);
+/* harmony import */ var ui_hooks_use_seamly_idle_detach_countdown__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(1154);
+/* harmony import */ var ui_hooks_use_seamly_resume_conversation_prompt__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(1256);
+/* harmony import */ var ui_hooks_utility_hooks__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(5029);
+/* harmony import */ var ui_utils_general_utils__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(4959);
+/* harmony import */ var ui_utils_seamly_utils__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(5740);
+/* harmony import */ var preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(7844);
+/* harmony import */ var preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_20___default = /*#__PURE__*/__webpack_require__.n(preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_20__);
+
 
 
 
@@ -20159,64 +20237,69 @@ const Suggestions = ({
   // generic hooks
   const {
     isInline
-  } = (0,ui_hooks_seamly_state_hooks__WEBPACK_IMPORTED_MODULE_12__.useSeamlyLayoutMode)();
+  } = (0,ui_hooks_seamly_state_hooks__WEBPACK_IMPORTED_MODULE_13__.useSeamlyLayoutMode)();
   const {
     t
-  } = (0,domains_i18n_hooks__WEBPACK_IMPORTED_MODULE_1__.useI18n)();
+  } = (0,domains_i18n_hooks__WEBPACK_IMPORTED_MODULE_2__.useI18n)();
   const {
     sendAction,
     addMessageBubble
-  } = (0,ui_hooks_use_seamly_commands__WEBPACK_IMPORTED_MODULE_13__/* ["default"] */ .Z)();
+  } = (0,ui_hooks_use_seamly_commands__WEBPACK_IMPORTED_MODULE_14__/* ["default"] */ .Z)();
   const {
     isOpen,
     setVisibility
-  } = (0,domains_visibility_hooks__WEBPACK_IMPORTED_MODULE_5__.useVisibility)(); // a11y hooks
+  } = (0,domains_visibility_hooks__WEBPACK_IMPORTED_MODULE_6__.useVisibility)();
+  const {
+    showSuggestions
+  } = (0,domains_config_hooks__WEBPACK_IMPORTED_MODULE_1__.useConfig)(); // a11y hooks
 
-  const sectionId = (0,ui_hooks_utility_hooks__WEBPACK_IMPORTED_MODULE_16__/* .useGeneratedId */ .I8)();
-  const focusSkiplinkTarget = (0,ui_hooks_focus_helper_hooks__WEBPACK_IMPORTED_MODULE_10__/* .useSkiplinkTargetFocusing */ .MI)();
-  const containerRef = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_7__.useRef)(null);
+  const sectionId = (0,ui_hooks_utility_hooks__WEBPACK_IMPORTED_MODULE_17__/* .useGeneratedId */ .I8)();
+  const focusSkiplinkTarget = (0,ui_hooks_focus_helper_hooks__WEBPACK_IMPORTED_MODULE_11__/* .useSkiplinkTargetFocusing */ .MI)();
+  const containerRef = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_8__.useRef)(null);
   const {
     sendPolite
-  } = (0,ui_hooks_live_region_hooks__WEBPACK_IMPORTED_MODULE_11__/* .useLiveRegion */ .t)(); // interrupt & countdown hooks
+  } = (0,ui_hooks_live_region_hooks__WEBPACK_IMPORTED_MODULE_12__/* .useLiveRegion */ .t)(); // interrupt & countdown hooks
 
   const {
     hasInterrupt
-  } = (0,domains_interrupt_hooks__WEBPACK_IMPORTED_MODULE_2__.useInterrupt)();
+  } = (0,domains_interrupt_hooks__WEBPACK_IMPORTED_MODULE_3__.useInterrupt)();
   const {
     hasCountdown,
     endCountdown
-  } = (0,ui_hooks_use_seamly_idle_detach_countdown__WEBPACK_IMPORTED_MODULE_14__/* ["default"] */ .Z)();
+  } = (0,ui_hooks_use_seamly_idle_detach_countdown__WEBPACK_IMPORTED_MODULE_15__/* ["default"] */ .Z)();
   const {
     hasPrompt,
     continueChat
-  } = (0,ui_hooks_use_seamly_resume_conversation_prompt__WEBPACK_IMPORTED_MODULE_15__/* ["default"] */ .Z)(); // data hooks
+  } = (0,ui_hooks_use_seamly_resume_conversation_prompt__WEBPACK_IMPORTED_MODULE_16__/* ["default"] */ .Z)(); // data hooks
 
   const userHasResponded = (0,domains_app_hooks__WEBPACK_IMPORTED_MODULE_0__/* .useUserHasResponded */ .h)();
-  const payload = (0,ui_hooks_seamly_state_hooks__WEBPACK_IMPORTED_MODULE_12__.useSeamlyServiceData)('suggestion');
-  const [eventBody] = (0,domains_translations_hooks__WEBPACK_IMPORTED_MODULE_3__.useTranslatedEventData)({
+  const payload = (0,ui_hooks_seamly_state_hooks__WEBPACK_IMPORTED_MODULE_13__.useSeamlyServiceData)('suggestion');
+  const {
+    body: eventBody
+  } = (0,domains_translations_hooks__WEBPACK_IMPORTED_MODULE_4__.useTranslatedEventData)({
     payload
   });
-  const suggestions = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_7__.useMemo)(() => payload && !hasInterrupt ? eventBody : [], [payload, hasInterrupt, eventBody]);
-  const prevSuggestions = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_7__.useRef)(null);
-  const prevHasSuggestions = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_7__.useRef)(false);
-  const previousRenderedSuggestions = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_7__.useRef)([]);
+  const suggestions = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_8__.useMemo)(() => payload && !hasInterrupt ? eventBody : [], [payload, hasInterrupt, eventBody]);
+  const prevSuggestions = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_8__.useRef)(null);
+  const prevHasSuggestions = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_8__.useRef)(false);
+  const previousRenderedSuggestions = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_8__.useRef)([]);
   const hasSuggestions = !!suggestions.length;
   const hideSuggestions = isInline ? (userHasResponded || isOpen) && !isAside : userHasResponded;
-  const prevHideSuggestions = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_7__.useRef)(hideSuggestions);
-  const showSuggestionsContainer = hasSuggestions && !hideSuggestions;
+  const prevHideSuggestions = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_8__.useRef)(hideSuggestions);
+  const showSuggestionsContainer = hasSuggestions && !hideSuggestions && showSuggestions;
   const renderedSuggestions = hasSuggestions ? suggestions : previousRenderedSuggestions.current;
   previousRenderedSuggestions.current = renderedSuggestions;
-  const suggestionsClassNames = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_7__.useMemo)(() => {
+  const suggestionsClassNames = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_8__.useMemo)(() => {
     const classNames = ['suggestions'];
 
     if (isAside) {
       classNames.push('suggestions--aside');
     }
 
-    return (0,lib_css__WEBPACK_IMPORTED_MODULE_6__.className)(classNames);
+    return (0,lib_css__WEBPACK_IMPORTED_MODULE_7__.className)(classNames);
   }, [isAside]); // click handler
 
-  const handleClick = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_7__.useCallback)(({
+  const handleClick = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_8__.useCallback)(({
     id,
     question
   }) => {
@@ -20230,7 +20313,7 @@ const Suggestions = ({
 
 
     sendAction({
-      type: ui_utils_seamly_utils__WEBPACK_IMPORTED_MODULE_18__.actionTypes.custom,
+      type: ui_utils_seamly_utils__WEBPACK_IMPORTED_MODULE_19__.actionTypes.custom,
       originMessage: payload.id,
       body: {
         type: 'faqclick',
@@ -20243,12 +20326,12 @@ const Suggestions = ({
     addMessageBubble(question);
 
     if (!isOpen) {
-      setVisibility(domains_visibility_constants__WEBPACK_IMPORTED_MODULE_4__.visibilityStates.open);
+      setVisibility(domains_visibility_constants__WEBPACK_IMPORTED_MODULE_5__.visibilityStates.open);
     }
 
     focusSkiplinkTarget();
   }, [addMessageBubble, continueChat, endCountdown, focusSkiplinkTarget, hasCountdown, hasPrompt, payload, sendAction, setVisibility, isOpen]);
-  (0,preact_hooks__WEBPACK_IMPORTED_MODULE_7__.useEffect)(() => {
+  (0,preact_hooks__WEBPACK_IMPORTED_MODULE_8__.useEffect)(() => {
     if (prevSuggestions.current !== suggestions && !hideSuggestions) {
       if (hasSuggestions) {
         const politeText = prevHasSuggestions.current ? t('suggestions.srUpdatedText') : t('suggestions.srAvailableText');
@@ -20263,10 +20346,10 @@ const Suggestions = ({
     }
 
     if (!prevHideSuggestions.current && hideSuggestions) {
-      (0,ui_utils_general_utils__WEBPACK_IMPORTED_MODULE_17__.runIfElementContainsOrHasFocus)(containerRef.current, focusSkiplinkTarget);
+      (0,ui_utils_general_utils__WEBPACK_IMPORTED_MODULE_18__.runIfElementContainsOrHasFocus)(containerRef.current, focusSkiplinkTarget);
       sendPolite(t('suggestions.srUnavailableText'));
     } else if (!hasSuggestions && prevHasSuggestions.current) {
-      (0,ui_utils_general_utils__WEBPACK_IMPORTED_MODULE_17__.runIfElementContainsOrHasFocus)(containerRef.current, focusSkiplinkTarget);
+      (0,ui_utils_general_utils__WEBPACK_IMPORTED_MODULE_18__.runIfElementContainsOrHasFocus)(containerRef.current, focusSkiplinkTarget);
     }
 
     prevHasSuggestions.current = hasSuggestions;
@@ -20275,22 +20358,22 @@ const Suggestions = ({
   const headingText = t('suggestions.headingText');
   const footerText = t('suggestions.footerText');
   const ContainerElement = headingText ? 'section' : 'div';
-  return (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_19__.jsx)(ui_components_widgets_in_out_transition__WEBPACK_IMPORTED_MODULE_9__/* ["default"] */ .Z, {
+  return (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_20__.jsx)(ui_components_widgets_in_out_transition__WEBPACK_IMPORTED_MODULE_10__/* ["default"] */ .Z, {
     isActive: showSuggestionsContainer,
-    transitionStartState: ui_components_widgets_in_out_transition__WEBPACK_IMPORTED_MODULE_9__/* .transitionStartStates.notRendered */ .I.notRendered,
-    children: (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_19__.jsxs)(ContainerElement, {
+    transitionStartState: ui_components_widgets_in_out_transition__WEBPACK_IMPORTED_MODULE_10__/* .transitionStartStates.notRendered */ .I.notRendered,
+    children: (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_20__.jsxs)(ContainerElement, {
       className: suggestionsClassNames,
       "aria-labelledby": headingText ? sectionId : null,
       ref: containerRef,
-      children: [headingText && (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_19__.jsx)("p", {
+      children: [headingText && (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_20__.jsx)("p", {
         id: sectionId,
-        className: (0,lib_css__WEBPACK_IMPORTED_MODULE_6__.className)('suggestions__heading'),
+        className: (0,lib_css__WEBPACK_IMPORTED_MODULE_7__.className)('suggestions__heading'),
         children: headingText
-      }), !!renderedSuggestions.length && (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_19__.jsx)(ui_components_suggestions_suggestions_list__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .Z, {
+      }), !!renderedSuggestions.length && (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_20__.jsx)(ui_components_suggestions_suggestions_list__WEBPACK_IMPORTED_MODULE_9__/* ["default"] */ .Z, {
         suggestions: renderedSuggestions,
         onClickSuggestion: handleClick
-      }), footerText && !isOpen && (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_19__.jsx)("p", {
-        className: (0,lib_css__WEBPACK_IMPORTED_MODULE_6__.className)('suggestions__footer'),
+      }), footerText && !isOpen && (0,preact_jsx_runtime__WEBPACK_IMPORTED_MODULE_20__.jsx)("p", {
+        className: (0,lib_css__WEBPACK_IMPORTED_MODULE_7__.className)('suggestions__footer'),
         children: footerText
       })]
     })
@@ -20500,7 +20583,9 @@ const Faq = () => {
     continueChat
   } = (0,use_seamly_resume_conversation_prompt/* default */.Z)();
   const lastFaqEventPayload = (0,seamly_state_hooks.useSeamlyServiceData)('suggestion');
-  const [eventBody] = (0,translations_hooks.useTranslatedEventData)({
+  const {
+    body: eventBody
+  } = (0,translations_hooks.useTranslatedEventData)({
     payload: lastFaqEventPayload
   });
   const faqs = (0,hooks_.useMemo)(() => {
@@ -20867,7 +20952,7 @@ function PreChatMessages() {
   const {
     isOpen
   } = (0,visibility_hooks.useVisibility)();
-  const isVisible = !(hasInterrupt || !(preChatEvents !== null && preChatEvents !== void 0 && preChatEvents.length) || isOpen);
+  const isVisible = !(hasInterrupt || !preChatEvents?.length || isOpen);
   return isVisible && (0,jsx_runtime_.jsx)("ul", {
     className: (0,css.className)('pre-chat-messages', `pre-chat-messages--${layoutMode}`),
     "aria-hidden": !isVisible,
@@ -21805,11 +21890,13 @@ const useSeamlyEventStream = (nextFn, filterFn) => {
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "selectEventIds": () => (/* binding */ selectEventIds),
 /* harmony export */   "selectEvents": () => (/* binding */ selectEvents),
 /* harmony export */   "selectEventsWithSuggestion": () => (/* binding */ selectEventsWithSuggestion),
 /* harmony export */   "selectState": () => (/* binding */ selectState),
 /* harmony export */   "useEntryTextLimit": () => (/* binding */ useEntryTextLimit),
 /* harmony export */   "useEvents": () => (/* binding */ useEvents),
+/* harmony export */   "useEventsIds": () => (/* binding */ useEventsIds),
 /* harmony export */   "useLastMessageEventId": () => (/* binding */ useLastMessageEventId),
 /* harmony export */   "useLoadedImageEventIds": () => (/* binding */ useLoadedImageEventIds),
 /* harmony export */   "useSeamlyCurrentAgent": () => (/* binding */ useSeamlyCurrentAgent),
@@ -21850,9 +21937,7 @@ const selectEventsWithSuggestion = (0,_reduxjs_toolkit__WEBPACK_IMPORTED_MODULE_
   events,
   serviceData
 }, config, hasUserResponded) => {
-  var _serviceData$suggesti;
-
-  if (hasUserResponded || config.layoutMode === 'inline' || !(serviceData !== null && serviceData !== void 0 && serviceData.suggestion) || !(serviceData !== null && serviceData !== void 0 && (_serviceData$suggesti = serviceData.suggestion) !== null && _serviceData$suggesti !== void 0 && _serviceData$suggesti.body.length)) {
+  if (hasUserResponded || config.layoutMode === 'inline' || !serviceData?.suggestion || !serviceData?.suggestion?.body.length) {
     return events;
   }
 
@@ -21863,12 +21948,10 @@ const selectEventsWithSuggestion = (0,_reduxjs_toolkit__WEBPACK_IMPORTED_MODULE_
   return [...events, suggestionsEvent];
 });
 const selectEvents = (0,_reduxjs_toolkit__WEBPACK_IMPORTED_MODULE_5__.createSelector)(selectEventsWithSuggestion, domains_config_selectors__WEBPACK_IMPORTED_MODULE_0__.selectConfig, (events, config) => {
-  var _config$messages;
-
   const {
     enabled,
     threshold
-  } = (config === null || config === void 0 ? void 0 : (_config$messages = config.messages) === null || _config$messages === void 0 ? void 0 : _config$messages.timeIndicator) ?? {};
+  } = config?.messages?.timeIndicator ?? {};
 
   if (!enabled) {
     return events;
@@ -21894,6 +21977,10 @@ const selectEvents = (0,_reduxjs_toolkit__WEBPACK_IMPORTED_MODULE_5__.createSele
   return mappedEvents;
 });
 const useEvents = () => (0,react_redux__WEBPACK_IMPORTED_MODULE_4__.useSelector)(selectEvents);
+const selectEventIds = (0,_reduxjs_toolkit__WEBPACK_IMPORTED_MODULE_5__.createSelector)(selectEvents, events => {
+  return events.map(event => event.payload.id);
+});
+const useEventsIds = () => (0,react_redux__WEBPACK_IMPORTED_MODULE_4__.useSelector)(selectEventIds);
 const useSeamlyIsLoading = () => useSeamlyStateContext().isLoading;
 const useSeamlyHeaderData = () => useSeamlyStateContext().headerTitles;
 const useSeamlyUnreadCount = () => useSeamlyStateContext().unreadEvents;
@@ -21902,10 +21989,8 @@ const useSkiplink = () => useSeamlyStateContext().skiplinkTargetId;
 const useSeamlyParticipant = participantId => useSeamlyStateContext().participantInfo.participants[participantId];
 const useSeamlyServiceInfo = () => useSeamlyStateContext().serviceInfo;
 const selectLastMessageEventId = (0,_reduxjs_toolkit__WEBPACK_IMPORTED_MODULE_5__.createSelector)(selectEvents, events => {
-  var _filteredEvents;
-
   const filteredEvents = events.filter(event => event.type === 'message');
-  return (_filteredEvents = filteredEvents[filteredEvents.length - 1]) === null || _filteredEvents === void 0 ? void 0 : _filteredEvents.payload.id;
+  return filteredEvents[filteredEvents.length - 1]?.payload.id;
 });
 const useLastMessageEventId = () => (0,react_redux__WEBPACK_IMPORTED_MODULE_4__.useSelector)(selectLastMessageEventId);
 const useSeamlyIsHistoryLoaded = () => useSeamlyStateContext().historyLoaded;
@@ -22051,7 +22136,6 @@ const useSeamlyChat = () => {
   } = (0,domains_visibility_hooks__WEBPACK_IMPORTED_MODULE_3__.useVisibility)();
   const showInlineView = (0,react_redux__WEBPACK_IMPORTED_MODULE_5__.useSelector)(_domains_visibility_selectors__WEBPACK_IMPORTED_MODULE_6__.selectShowInlineView);
   const dispatch = (0,react_redux__WEBPACK_IMPORTED_MODULE_5__.useDispatch)();
-  const events = (0,_seamly_state_hooks__WEBPACK_IMPORTED_MODULE_9__.useEvents)();
   const spinnerTimeout = (0,preact_hooks__WEBPACK_IMPORTED_MODULE_4__.useRef)(null);
   const {
     start,
@@ -22066,7 +22150,6 @@ const useSeamlyChat = () => {
   const {
     sendAssertive
   } = (0,_live_region_hooks__WEBPACK_IMPORTED_MODULE_7__/* .useLiveRegion */ .t)();
-  const hasEvents = events.length > 0;
   (0,preact_hooks__WEBPACK_IMPORTED_MODULE_4__.useEffect)(() => {
     if (isVisible) {
       // Wait for the live containers to stabilise in the DOM before injecting
@@ -22100,13 +22183,10 @@ const useSeamlyChat = () => {
     spinnerTimeout.current = setTimeout(() => {
       dispatch((0,domains_store_slice__WEBPACK_IMPORTED_MODULE_1__.setIsLoading)(true));
     }, 500);
-  }, [dispatch]);
-  (0,preact_hooks__WEBPACK_IMPORTED_MODULE_4__.useEffect)(() => {
-    if (hasEvents) {
+    return () => {
       clearTimeout(spinnerTimeout.current);
-      dispatch((0,domains_store_slice__WEBPACK_IMPORTED_MODULE_1__.setIsLoading)(false));
-    }
-  }, [hasEvents, dispatch]);
+    };
+  }, [dispatch]);
   (0,preact_hooks__WEBPACK_IMPORTED_MODULE_4__.useEffect)(() => {
     // This is needed to reset the ref to allow connect and start to happen again.
     // Mostly due to Interrupt situations and a reset being called.
@@ -22907,7 +22987,7 @@ const validateFileSize = (fileList, maxSize) => {
 
   return isValid;
 };
-const fileListObjectIsNotEmpty = fileListObj => !!(fileListObj !== null && fileListObj !== void 0 && fileListObj.length) > 0;
+const fileListObjectIsNotEmpty = fileListObj => !!fileListObj?.length > 0;
 /* eslint-disable no-control-regex */
 
 const isEmailString = val => {