Feature/widget call config

package.json

@@ -16,7 +16,7 @@
     "@vuelidate/validators": "^2.0.0",
     "@vueuse/core": "^10.3.0",
     "@webitel/flow-ui-sdk": "^0.1.14",
-    "@webitel/ui-sdk": "^23.12.30",
+    "@webitel/ui-sdk": "^23.12.32",
     "axios": "^0.27.1",
     "clipboard-copy": "^4.0.1",
     "cron-validator": "^1.3.1",
@@ -31,6 +31,7 @@
     "path": "^0.12.7",
     "query-string": "^7.1.1",
     "sortablejs": "^1.10.2",
+    "uuid": "^9.0.1",
     "vue": "^3.2.47",
     "vue-i18n": "^9.2.2",
     "vue-router": "^4.2.5",

src/app/locale/en/en.js

@@ -598,9 +598,15 @@ export default {
           },
           alternativeChannels: {
             alternativeChannels: 'Alternative Channels',
+            title: 'Messaging channels',
             email: 'Email',
             whatsapp: 'WhatsApp',
             telegram: 'Telegram',
+            messenger: 'Messenger',
+          },
+          call: {
+            title: 'Online call',
+            url: 'WebSocket Endpoint',
           },
         },
         uri: 'URI',

src/app/locale/ru/ru.js

@@ -596,11 +596,17 @@ export default {
             subheadingText: 'Подзаголовок',
             showDefaultHeading: 'Показать стандартный заголовок и подзаголовок на странице результата',
           },
+          call: {
+            title: 'Онлайн-звонок',
+            url: 'WebSocket Endpoint',
+          },
           alternativeChannels: {
             alternativeChannels: 'Альтернативные каналы',
+            title: 'Текстовые каналы',
             email: 'Электронная почта',
             whatsapp: 'WhatsApp',
             telegram: 'Telegram',
+            messenger: 'Messenger',
           },
         },
         uri: 'URI',

src/app/locale/ua/ua.js

@@ -597,11 +597,17 @@ export default {
             subheadingText: 'Підзаголовок',
             showDefaultHeading: 'Показати стандартний заголовок та підзаголовок на сторінці результату',
           },
+          call: {
+            title: 'Онлайн-дзвінок',
+            url: 'WebSocket Endpoint',
+          },
           alternativeChannels: {
             alternativeChannels: 'Альтернативні канали',
+            title: 'Текстові канали',
             email: 'Електронна пошта',
             whatsapp: 'WhatsApp',
             telegram: 'Telegram',
+            messenger: 'Messenger',
           },
         },
         uri: 'URI',

src/app/store/BaseStoreModules/StoreModuleMixins/BaseOpenedInstanceStoreModuleMixin.js

@@ -1,4 +1,5 @@
 import deepCopy from 'deep-copy';
+import set from 'lodash/set';
 
 const state = {
   itemId: 0,
@@ -35,8 +36,13 @@ const mutations = {
   SET_ITEM_ID: (state, id) => {
     state.itemId = id;
   },
-  SET_ITEM_PROPERTY: (state, { prop, value }) => {
-    state.itemInstance[prop] = value;
+  SET_ITEM_PROPERTY: (state, { prop, value, path }) => {
+    if (path) {
+      set(state.itemInstance, path, value);
+    } else {
+      // DEPRECATED, LEGACY CODE
+      state.itemInstance[prop] = value;
+    }
   },
   SET_ITEM: (state, item) => {
     state.itemInstance = item;

src/modules/routing/modules/chat-gateways/api/chatGateways.js

@@ -62,6 +62,7 @@ const webchatRequestConverter = (data) => {
   data.metadata.chat = JSON.stringify(data.metadata.chat);
   data.metadata.appointment = JSON.stringify(data.metadata.appointment);
   data.metadata.alternativeChannels = JSON.stringify(data.metadata.alternativeChannels);
+  data.metadata.call = JSON.stringify(data.metadata.call);
   data.metadata._btnCodeDirty = data.metadata._btnCodeDirty.toString();
   return data;
 };
@@ -105,6 +106,9 @@ const webChatResponseConverter = (data) => {
   if (data.metadata.alternativeChannels) {
     data.metadata.alternativeChannels = JSON.parse(data.metadata.alternativeChannels);
   }
+  if (data.metadata.call) {
+    data.metadata.call = JSON.parse(data.metadata.call);
+  }
   data.metadata._btnCodeDirty = (data.metadata._btnCodeDirty === 'true');
 
   return deepmerge(webChatGateway(), data);

src/modules/routing/modules/chat-gateways/components/opened-chat-gateway.vue

@@ -16,6 +16,7 @@
           <webchat-copy-code-button
             v-if="isWebchat"
             :item-instance="itemInstance"
+            :namespace="namespace"
             @copied="handleWebchatCodeCopied"
           />
         </template>
@@ -49,6 +50,7 @@
 <script>
 import { useVuelidate } from '@vuelidate/core';
 import { maxValue, minLength, minValue, numeric, required, url } from '@vuelidate/validators';
+import websocketValidator from '@webitel/ui-sdk/src/validators/websocketValidator/websocketValidator';
 import { mapActions } from 'vuex';
 import openedObjectMixin from '../../../../../app/mixins/objectPagesMixins/openedObjectMixin/openedObjectMixin';
 import ChatGatewayProvider from '../enum/ChatGatewayProvider.enum';
@@ -191,6 +193,10 @@ export default {
                   minValue: minValue(1),
                 },
               } : {},
+              call: this.itemInstance.metadata.call.enabled ? {
+                url: { required, websocketValidator },
+                flow: { required },
+              } : {},
             },
           },
         };