- {{
- isOnline
- ? $t('TEAM_AVAILABILITY.ONLINE')
- : $t('TEAM_AVAILABILITY.OFFLINE')
- }}
+
+ {{ headerMessage }}
{{ replyWaitMessage }}
diff --git a/app/javascript/widget/components/layouts/ViewWithHeader.vue b/app/javascript/widget/components/layouts/ViewWithHeader.vue
index 1b1e1e2fd..70eaf783b 100644
--- a/app/javascript/widget/components/layouts/ViewWithHeader.vue
+++ b/app/javascript/widget/components/layouts/ViewWithHeader.vue
@@ -119,8 +119,10 @@ export default {
>
diff --git a/app/javascript/widget/store/modules/appConfig.js b/app/javascript/widget/store/modules/appConfig.js
index 44a13c4c4..3ad5078b8 100644
--- a/app/javascript/widget/store/modules/appConfig.js
+++ b/app/javascript/widget/store/modules/appConfig.js
@@ -21,6 +21,13 @@ const state = {
widgetStyle: 'standard',
darkMode: 'light',
isUpdatingRoute: false,
+ welcomeTitle: '',
+ welcomeDescription: '',
+ availableMessage: '',
+ unavailableMessage: '',
+ enableFileUpload: true,
+ enableEmojiPicker: true,
+ enableEndConversation: true,
};
export const getters = {
@@ -34,6 +41,13 @@ export const getters = {
darkMode: $state => $state.darkMode,
getShowUnreadMessagesDialog: $state => $state.showUnreadMessagesDialog,
getIsUpdatingRoute: _state => _state.isUpdatingRoute,
+ getWelcomeHeading: $state => $state.welcomeTitle,
+ getWelcomeTagline: $state => $state.welcomeDescription,
+ getAvailableMessage: $state => $state.availableMessage,
+ getUnavailableMessage: $state => $state.unavailableMessage,
+ getShouldShowFilePicker: $state => $state.enableFileUpload,
+ getShouldShowEmojiPicker: $state => $state.enableEmojiPicker,
+ getCanUserEndConversation: $state => $state.enableEndConversation,
};
export const actions = {
@@ -46,6 +60,13 @@ export const actions = {
showUnreadMessagesDialog,
widgetStyle = 'rounded',
darkMode = 'light',
+ welcomeTitle = '',
+ welcomeDescription = '',
+ availableMessage = '',
+ unavailableMessage = '',
+ enableFileUpload = true,
+ enableEmojiPicker = true,
+ enableEndConversation = true,
}
) {
commit(SET_WIDGET_APP_CONFIG, {
@@ -55,6 +76,13 @@ export const actions = {
showUnreadMessagesDialog: !!showUnreadMessagesDialog,
widgetStyle,
darkMode,
+ welcomeTitle,
+ welcomeDescription,
+ availableMessage,
+ unavailableMessage,
+ enableFileUpload,
+ enableEmojiPicker,
+ enableEndConversation,
});
},
toggleWidgetOpen({ commit }, isWidgetOpen) {
@@ -90,6 +118,13 @@ export const mutations = {
$state.darkMode = data.darkMode;
$state.locale = data.locale || $state.locale;
$state.showUnreadMessagesDialog = data.showUnreadMessagesDialog;
+ $state.welcomeTitle = data.welcomeTitle;
+ $state.welcomeDescription = data.welcomeDescription;
+ $state.availableMessage = data.availableMessage;
+ $state.unavailableMessage = data.unavailableMessage;
+ $state.enableFileUpload = data.enableFileUpload;
+ $state.enableEmojiPicker = data.enableEmojiPicker;
+ $state.enableEndConversation = data.enableEndConversation;
},
[TOGGLE_WIDGET_OPEN]($state, isWidgetOpen) {
$state.isWidgetOpen = isWidgetOpen;
diff --git a/app/javascript/widget/store/modules/specs/appConfig/getters.spec.js b/app/javascript/widget/store/modules/specs/appConfig/getters.spec.js
index 5d3db77bc..a6020cb84 100644
--- a/app/javascript/widget/store/modules/specs/appConfig/getters.spec.js
+++ b/app/javascript/widget/store/modules/specs/appConfig/getters.spec.js
@@ -19,6 +19,48 @@ describe('#getters', () => {
expect(getters.getShowUnreadMessagesDialog(state)).toEqual(true);
});
});
+ describe('#getAvailableMessage', () => {
+ it('returns correct value', () => {
+ const state = { availableMessage: 'We reply quickly' };
+ expect(getters.getAvailableMessage(state)).toEqual('We reply quickly');
+ });
+ });
+ describe('#getWelcomeHeading', () => {
+ it('returns correct value', () => {
+ const state = { welcomeTitle: 'Hello!' };
+ expect(getters.getWelcomeHeading(state)).toEqual('Hello!');
+ });
+ });
+ describe('#getWelcomeTagline', () => {
+ it('returns correct value', () => {
+ const state = { welcomeDescription: 'Welcome to our site' };
+ expect(getters.getWelcomeTagline(state)).toEqual('Welcome to our site');
+ });
+ });
+ describe('#getShouldShowFilePicker', () => {
+ it('returns correct value', () => {
+ const state = { enableFileUpload: true };
+ expect(getters.getShouldShowFilePicker(state)).toEqual(true);
+ });
+ });
+ describe('#getShouldShowEmojiPicker', () => {
+ it('returns correct value', () => {
+ const state = { enableEmojiPicker: true };
+ expect(getters.getShouldShowEmojiPicker(state)).toEqual(true);
+ });
+ });
+ describe('#getCanUserEndConversation', () => {
+ it('returns correct value', () => {
+ const state = { enableEndConversation: true };
+ expect(getters.getCanUserEndConversation(state)).toEqual(true);
+ });
+ });
+ describe('#getUnavailableMessage', () => {
+ it('returns correct value', () => {
+ const state = { unavailableMessage: 'We are offline' };
+ expect(getters.getUnavailableMessage(state)).toEqual('We are offline');
+ });
+ });
describe('#getIsUpdatingRoute', () => {
it('returns correct value', () => {
const state = { isUpdatingRoute: true };