@seamly/web-ui 20.2.0-alpha.1 → 20.2.0-alpha.4

package/build/dist/lib/index.js

@@ -8098,7 +8098,7 @@ function useStoreContext() {
 function useStoreDispatch() {
   return useStoreContext().dispatch;
 }
-function useSelector(selector, deps = []) {
+function hooks_useSelector(selector, deps = []) {
   const store = useStoreContext(); // we need a force-update because we're manually updating a ref instead of a useState
 
   const [, forceUpdate] = (0,hooks_namespaceObject.useReducer)(x => x + 1, 0); // we're keeping the value to compare against
@@ -8156,7 +8156,7 @@ const useSelectorWithProps = function useSelectorWithProps(selector, props, inpu
 ) {
   // eslint-disable-next-line react-hooks/exhaustive-deps
   const wrappedMapper = (0,hooks_namespaceObject.useCallback)(state => selector(state, props), inputs);
-  return useSelector(wrappedMapper, inputs);
+  return hooks_useSelector(wrappedMapper, inputs);
 };
 ;// CONCATENATED MODULE: ./src/javascripts/domains/redux/index.js
 
@@ -8168,13 +8168,13 @@ const useSelectorWithProps = function useSelectorWithProps(selector, props, inpu
 
 
 function useConfig() {
-  return useSelector(selectConfig);
+  return hooks_useSelector(selectConfig);
 }
 function useParticipants() {
   const {
     agentParticipant,
     userParticipant
-  } = useSelector(selectConfig);
+  } = useSelector(Selectors.selectConfig);
   return {
     agent: agentParticipant,
     user: userParticipant
@@ -8183,7 +8183,7 @@ function useParticipants() {
 function useStartChatIcon() {
   const {
     startChatIcon
-  } = useSelector(selectConfig);
+  } = hooks_useSelector(selectConfig);
   return startChatIcon;
 }
 ;// CONCATENATED MODULE: ./src/javascripts/config.js
@@ -9288,6 +9288,12 @@ const calculateVisibility = ({
 
   if (layoutMode === 'window' && hideOnNoUserResponse && requestedVisibility !== visibilityStates.open) {
     return hasResponded ? requestedVisibility || previousVisibility || visibilityStates.open : visibilityStates.hidden;
+  } // Allow users to continue a conversation (if they have responded and no visibility is requested)
+  // when switching from the window layout to the inline layout
+
+
+  if (layoutMode === 'inline' && hasResponded && !requestedVisibility) {
+    return previousVisibility || visibilityStates.open;
   }
 
   const baseVisibility = visibilityStates.minimized;
@@ -9312,7 +9318,7 @@ function seamly_state_hooks_defineProperty(obj, key, value) { if (key in obj) {
 
 
 const seamly_state_hooks_selectState = state => state.state;
-const useSeamlyStateContext = () => useSelector(seamly_state_hooks_selectState);
+const useSeamlyStateContext = () => hooks_useSelector(seamly_state_hooks_selectState);
 const selectEventsWithSuggestion = createSelector(seamly_state_hooks_selectState, selectConfig, selectUserHasResponded, ({
   events,
   serviceData
@@ -9360,7 +9366,7 @@ const selectEvents = createSelector(selectEventsWithSuggestion, selectConfig, (e
   });
   return mappedEvents;
 });
-const useEvents = () => useSelector(selectEvents, []);
+const useEvents = () => hooks_useSelector(selectEvents, []);
 const useSeamlyIsLoading = () => useSeamlyStateContext().isLoading;
 const useSeamlyHeaderData = () => useSeamlyStateContext().headerTitles;
 const useSeamlyUnreadCount = () => useSeamlyStateContext().unreadEvents;
@@ -9373,7 +9379,7 @@ const selectLastMessageEventId = createSelector(selectEvents, events => {
   const filteredEvents = events.filter(event => event.type === 'message');
   return (_filteredEvents = filteredEvents[filteredEvents.length - 1]) === null || _filteredEvents === void 0 ? void 0 : _filteredEvents.payload.id;
 });
-const useLastMessageEventId = () => useSelector(selectLastMessageEventId);
+const useLastMessageEventId = () => hooks_useSelector(selectLastMessageEventId);
 const useSeamlyIsHistoryLoaded = () => useSeamlyStateContext().historyLoaded;
 const useSeamlyCurrentAgent = () => {
   const {
@@ -9574,6 +9580,7 @@ const clear = interrupt_utils_createAction('clear');
 
 
 
+
 const setHasResponded = app_utils_createAction('setHasResponded', hasResponded => ({
   hasResponded
 }));
@@ -9642,6 +9649,13 @@ const app_actions_initialize = app_utils_createThunk('initialize', async (_, {
       }
     } else if (config !== null && config !== void 0 && (_config$context2 = config.context) !== null && _config$context2 !== void 0 && _config$context2.translationLocale) {
       locale = config.context.translationLocale;
+      api.send('action', {
+        type: actionTypes.setTranslation,
+        body: {
+          enabled: true,
+          locale
+        }
+      });
       dispatch(enable(locale));
     }
   } catch (e) {
@@ -10504,9 +10518,9 @@ const formatter = new MessageFormatter('en-GB', {
   select: selectTypeHandler
 });
 function useI18n() {
-  const translations = useSelector(selectTranslations);
-  const locale = useSelector(selectLocale);
-  const initialLocale = useSelector(selectInitialLocale);
+  const translations = hooks_useSelector(selectTranslations);
+  const locale = hooks_useSelector(selectLocale);
+  const initialLocale = hooks_useSelector(selectInitialLocale);
   const t = (0,hooks_namespaceObject.useCallback)((key, values = {}) => {
     const translation = translations[key];
 
@@ -10896,7 +10910,7 @@ function useInterrupt() {
   const {
     t
   } = useI18n();
-  const error = useSelector(selectError);
+  const error = hooks_useSelector(selectError);
   const hasInterrupt = Boolean(error);
   const meta = (0,hooks_namespaceObject.useMemo)(() => {
     if (!error) return {};
@@ -11035,7 +11049,7 @@ const handleError = (state, {
 
 
 function useUserHasResponded() {
-  return useSelector(selectUserHasResponded);
+  return hooks_useSelector(selectUserHasResponded);
 }
 ;// CONCATENATED MODULE: ./src/javascripts/domains/visibility/hooks.js
 
@@ -11045,7 +11059,7 @@ function useUserHasResponded() {
 
 const useVisibility = () => {
   const dispatch = useStoreDispatch();
-  const visible = useSelector(selectVisibility);
+  const visible = hooks_useSelector(selectVisibility);
   const isVisible = visible ? visible !== visibilityStates.hidden : false;
   const isOpen = visible === visibilityStates.open;
   const isMinimized = visible === visibilityStates.minimized;
@@ -11933,7 +11947,7 @@ function useTranslations() {
     isActive,
     isAvailable,
     currentLocale
-  } = useSelector(getState, []);
+  } = hooks_useSelector(getState, []);
   return {
     languages,
     isActive,
@@ -11984,7 +11998,7 @@ function useTranslatedEventData({
   }];
 }
 function useTranslationsContainer() {
-  const id = useSelector(getState, []).containerId;
+  const id = hooks_useSelector(getState, []).containerId;
   const focusContainer = useElementFocusingById(id);
   return {
     id,
@@ -19481,13 +19495,9 @@ const Translation = _ref => {
 
 
 
-
 const Participant = ({
   event
 }) => {
-  const {
-    agent
-  } = useParticipants();
   const {
     participant
   } = event.payload;
@@ -19500,11 +19510,10 @@ const Participant = ({
     return null;
   }
 
-  const avatar = participant.avatar || (agent === null || agent === void 0 ? void 0 : agent.avatar);
   return (0,jsx_runtime_namespaceObject.jsx)(EventDivider, {
-    graphicSrc: avatar,
+    graphicSrc: participant.avatar,
     graphicType: participant.avatar ? 'avatar' : undefined,
-    iconName: !avatar ? 'balloon' : undefined,
+    iconName: !participant.avatar ? 'balloon' : undefined,
     childrenHTML: intro,
     dividerType: "participant"
   });
@@ -25276,7 +25285,6 @@ class API {
   sendContext(context = {}) {
     const {
       locale,
-      translationLocale,
       variables
     } = context;
     const payload = {};
@@ -25289,14 +25297,6 @@ class API {
       payload.locale = locale;
     }
 
-    if (translationLocale) {
-      if (typeof translationLocale !== 'string') {
-        throw new Error('Translation locale must be a string');
-      }
-
-      payload.translationLocale = translationLocale;
-    }
-
     if (variables) {
       if (typeof variables !== 'object') {
         throw new Error('Variables must be an object');
@@ -25321,7 +25321,7 @@ class API {
     return {
       clientName: "@seamly/web-ui",
       clientVariant: this.layoutMode,
-      clientVersion: "20.2.0-alpha.1",
+      clientVersion: "20.2.0-alpha.4",
       currentUrl: window.location.toString(),
       screenResolution: `${window.screen.width}x${window.screen.height}`,
       timezone: getTimeZone(),
@@ -25638,6 +25638,7 @@ class ExternalApi {
     this._waitingActions = [];
     this._instances = {};
     this.appConfig = appConfig;
+    this.context = {};
   }
 
   push(...actionObjects) {
@@ -25665,7 +25666,8 @@ class ExternalApi {
           break;
 
         default:
-          if (!this.handleAction(actionObj)) {
+          if (!this.handleAction(actionObj) && // Store context properties for the next instance that will be created
+          !this.setContext(actionObj.action, ...actionObj.args)) {
             this._waitingActions.push(actionObj);
           }
 
@@ -25674,6 +25676,25 @@ class ExternalApi {
     });
   }
 
+  setContext(action, args) {
+    switch (action) {
+      case 'setTranslation':
+        const {
+          enabled,
+          locale
+        } = args;
+
+        if (!!enabled && locale) {
+          this.context.translationLocale = locale;
+        }
+
+        return true;
+
+      default:
+        return false;
+    }
+  }
+
   handleInit(actionObj) {
     const userConfig = this.getUserConfig(...actionObj.args);
     const config = this.getCombinedConfig(userConfig); // if this.appConfig is a function, it might return an invalid configuration (false, null, undefined)
@@ -25695,7 +25716,9 @@ class ExternalApi {
 
     if (config) {
       const instance = this.createInstance(config);
-      this._instances[config.namespace] = instance;
+      this._instances[config.namespace] = instance; // Clear the context after creating the instance, so we do not reuse it for the next
+
+      this.context = {};
       instance.render();
     }
   }
@@ -25759,10 +25782,13 @@ class ExternalApi {
       return this.appConfig(userConfig);
     }
 
+    const context = external_api_objectSpread(external_api_objectSpread({}, userConfig.context || this.appConfig.context), this.context);
+
     const defaults = external_api_objectSpread(external_api_objectSpread({}, this.appConfig.defaults), userConfig.defaults);
 
     return external_api_objectSpread(external_api_objectSpread(external_api_objectSpread({}, this.appConfig), userConfig), {}, {
       api: external_api_objectSpread(external_api_objectSpread({}, this.appConfig.api), userConfig.api),
+      context: Object.keys(context).length ? context : undefined,
       defaults: Object.keys(defaults).length ? defaults : undefined
     });
   }