@webitel/ui-sdk 24.10.2 → 24.10.4

package/src/modules/AuditForm/components/audit-form-question-write-wrapper.vue

@@ -89,18 +89,16 @@ const props = defineProps({
   },
 });
 
-const emit = defineEmits([
-  'change:question',
-  'copy',
-  'delete',
-]);
+const emit = defineEmits(['change:question', 'copy', 'delete']);
 
 const QuestionType = [
   { value: EngineAuditQuestionType.Option, locale: 'webitelUI.auditForm.type.options' },
   { value: EngineAuditQuestionType.Score, locale: 'webitelUI.auditForm.type.score' },
 ];
 
-const prettifiedQuestionType = computed(() => QuestionType.find(({ value }) => value === props.question.type));
+const prettifiedQuestionType = computed(() =>
+  QuestionType.find(({ value }) => value === props.question.type),
+);
 
 const QuestionTypeComponent = computed(() => {
   if (props.question.type === EngineAuditQuestionType.Option) return AuditFormQuestionOptions;
@@ -122,7 +120,6 @@ function handleQuestionTypeChange(type) {
   }
   emit('change:question', question);
 }
-
 </script>
 
 <style lang="scss" scoped>

package/src/modules/AuditForm/components/audit-form-question.vue

@@ -56,12 +56,7 @@ const props = defineProps({
   },
 });
 
-const emits = defineEmits([
-  'copy',
-  'delete',
-  'update:question',
-  'update:result',
-]);
+const emits = defineEmits(['copy', 'delete', 'update:question', 'update:result']);
 
 const QuestionState = {
   SAVED: 'saved',
@@ -73,17 +68,23 @@ const state = ref(QuestionState.SAVED);
 // is needed for useVuelidate, because props.question/props.result isn't reactive
 const { question, result } = toRefs(props);
 
-const v$ = useVuelidate(computed(() => (
-  (props.mode === 'create')
-    ? {
-      question: {
-        question: { required },
-      },
-    } : {
-      result: {
-        required: (value) => (question.value.required ? !isEmpty(value) : true),
-      },
-    })), { question, result }, { $autoDirty: true });
+const v$ = useVuelidate(
+  computed(() =>
+    props.mode === 'create'
+      ? {
+          question: {
+            question: { required },
+          },
+        }
+      : {
+          result: {
+            required: (value) => (question.value.required ? !isEmpty(value) : true),
+          },
+        },
+  ),
+  { question, result },
+  { $autoDirty: true },
+);
 
 const component = computed(() => {
   if (props.readonly) return QuestionRead;

package/src/modules/AuditForm/components/audit-form.vue

@@ -45,8 +45,8 @@ const props = defineProps({
     type: String,
     required: true,
     /*
-    * Available options: ['create', 'fill']
-    *  */
+     * Available options: ['create', 'fill']
+     *  */
   },
   questions: {
     type: Array,
@@ -61,11 +61,7 @@ const props = defineProps({
   },
 });
 
-const emit = defineEmits([
-  'update:questions',
-  'update:result',
-  'update:validation',
-]);
+const emit = defineEmits(['update:questions', 'update:result', 'update:validation']);
 
 const v$ = useVuelidate();
 
@@ -131,9 +127,8 @@ function initQuestions() {
 async function atQuestionAdded() {
   // wait for new question to render
   await nextTick();
-  const index = isQuestionAdded.index && isQuestionAdded.index === 'last'
-    ? -1
-    : isQuestionAdded.index;
+  const index =
+    isQuestionAdded.index && isQuestionAdded.index === 'last' ? -1 : isQuestionAdded.index;
   auditQuestions.value.at(index).activateQuestion();
 
   isQuestionAdded.value = false;
@@ -154,10 +149,13 @@ const { reloadSortable } = useDestroyableSortable(sortableWrapper, {
 
 watch(v$, () => emit('update:validation', { invalid: isInvalidForm.value, v$: v$.value }));
 watchEffect(initResult);
-watch(() => props.questions, () => {
-  if (!isQuestionAdded.value) return;
-  atQuestionAdded();
-});
+watch(
+  () => props.questions,
+  () => {
+    if (!isQuestionAdded.value) return;
+    atQuestionAdded();
+  },
+);
 
 onMounted(() => {
   initQuestions();

package/src/modules/AuditForm/components/questions/options/__tests__/audit-form-question-options-write-row.spec.js

@@ -1,6 +1,5 @@
 import { mount, shallowMount } from '@vue/test-utils';
-import AuditFormQuestionOptionsWriteRow
-  from '../audit-form-question-options-write-row.vue';
+import AuditFormQuestionOptionsWriteRow from '../audit-form-question-options-write-row.vue';
 
 describe('AuditFormQuestionOptionsWriteRow', () => {
   it('renders a component', () => {

package/src/modules/AuditForm/components/questions/options/__tests__/audit-form-question-options.spec.js

@@ -17,9 +17,7 @@ describe('AuditFormQuestionOptions', () => {
         mode: 'write',
       },
     });
-    wrapper.findComponent('.audit-form-question-options-write__add-button')
-    .vm
-    .$emit('click');
+    wrapper.findComponent('.audit-form-question-options-write__add-button').vm.$emit('click');
     expect(wrapper.emitted()['change:question'][0][0].options.length).toBe(2);
   });
   it('deletes existing question option at "delete" icon-btn click', () => {

package/src/modules/AuditForm/components/questions/options/audit-form-question-options-write-row.vue

@@ -47,27 +47,23 @@ const props = defineProps({
   },
 });
 
-const emit = defineEmits([
-  'change:option',
-  'delete',
-]);
+const emit = defineEmits(['change:option', 'delete']);
 
 // is needed for useVuelidate, because props.question/props.result isn't reactive
 const { option } = toRefs(props);
 
 const v$ = useVuelidate(
-  computed(() => (
-    {
-      option: {
-        name: { required },
-        score: {
-          required,
-          minValue: minValue(0),
-          maxValue: maxValue(10),
-          decimalValidator: decimalValidator(2),
-        },
+  computed(() => ({
+    option: {
+      name: { required },
+      score: {
+        required,
+        minValue: minValue(0),
+        maxValue: maxValue(10),
+        decimalValidator: decimalValidator(2),
       },
-    })),
+    },
+  })),
   { option },
   { $autoDirty: true },
 );

package/src/modules/AuditForm/components/questions/options/audit-form-question-options.vue

@@ -60,10 +60,7 @@ const props = defineProps({
   },
 });
 
-const emit = defineEmits([
-  'change:question',
-  'change:result',
-]);
+const emit = defineEmits(['change:question', 'change:result']);
 
 function updateQuestion({ path, value }) {
   emit('change:question', updateObject({ obj: props.question, path, value }));

package/src/modules/AuditForm/components/questions/score/audit-form-question-score.vue

@@ -60,32 +60,28 @@ const props = defineProps({
   },
 });
 
-const emit = defineEmits([
-  'change:question',
-  'change:result',
-]);
+const emit = defineEmits(['change:question', 'change:result']);
 
 // is needed for useVuelidate, because props.question/props.result isn't reactive
 const { question } = toRefs(props);
 
 const v$ = useVuelidate(
-  computed(() => (
-    {
-      question: {
-        min: {
-          minValue: minValue(0),
-          maxValue: maxValue(9),
-          required,
-          integer,
-        },
-        max: {
-          minValue: minValue(props.question.min ? props.question.min : 1),
-          maxValue: maxValue(10),
-          required,
-          integer,
-        },
+  computed(() => ({
+    question: {
+      min: {
+        minValue: minValue(0),
+        maxValue: maxValue(9),
+        required,
+        integer,
       },
-    })),
+      max: {
+        minValue: minValue(props.question.min ? props.question.min : 1),
+        maxValue: maxValue(10),
+        required,
+        integer,
+      },
+    },
+  })),
   { question },
   { $autoDirty: true },
 );

package/src/modules/AuditForm/schemas/AuditFormQuestionOptionsSchema.js

@@ -7,7 +7,5 @@ export const generateOption = () => ({
 
 export const generateQuestionOptionsSchema = () => ({
   type: EngineAuditQuestionType.Option,
-  options: [
-    generateOption(),
-  ],
+  options: [generateOption()],
 });

package/src/modules/CSVExport/CSVExport.js

@@ -6,8 +6,7 @@ const cast = {
   object: (separator) => {
     const cast = (object) => {
       if (Array.isArray(object)) {
-        return object.map((item) => cast(item))
-        .join(separator);
+        return object.map((item) => cast(item)).join(separator);
       }
       return object.name || JSON.stringify(object);
     };
@@ -34,8 +33,7 @@ export default class CSVExport {
       header: true,
       delimiter,
     };
-    const localStorageOptions = JSON.parse(localStorage.getItem('csv-export-options')) ||
-      {};
+    const localStorageOptions = JSON.parse(localStorage.getItem('csv-export-options')) || {};
     return {
       ...defaultOptions,
       ...localStorageOptions,
@@ -59,12 +57,10 @@ export default class CSVExport {
     let csv = '';
     let isNext = false;
     // why _columns? https://webitel.atlassian.net/browse/DEV-3797
-    let columns = params._columns ||
-      (params?.fields ? objSnakeToCamel(params?.fields) : []);
+    let columns = params._columns || (params?.fields ? objSnakeToCamel(params?.fields) : []);
     let page = 1;
 
     do {
-
       const { items, next } = await this.fetchMethod({
         ...params,
         page,

package/src/modules/CSVExport/XLSExport.js

@@ -1,5 +1,5 @@
-import * as XLSX from 'xlsx';
 import { saveAs } from 'file-saver-es';
+import * as XLSX from 'xlsx';
 import { objSnakeToCamel } from '../../scripts/caseConverters.js';
 
 export default class XLSExport {
@@ -29,9 +29,9 @@ export default class XLSExport {
 
   // NOTE: creates a new object that only includes the properties specified in the columns array
   filterDataByColumns(data, columns) {
-    return data.map(item => {
-      let filteredItem = {};
-      columns.forEach(column => {
+    return data.map((item) => {
+      const filteredItem = {};
+      columns.forEach((column) => {
         const value = item.hasOwnProperty(column) ? this.extractNameFromObject(item[column]) : ''; // '' needed to display column that has no data
         filteredItem[column] = value;
       });
@@ -41,7 +41,7 @@ export default class XLSExport {
 
   // NOTE: calculates the width of the columns based on the data to display it in the EXEL file
   calculateColumnWidths(data, columns) {
-    return columns.map(column => {
+    return columns.map((column) => {
       const maxLength = data.reduce((max, item) => {
         const value = item[column] || '';
         return Math.max(max, value.toString().length);
@@ -66,8 +66,7 @@ export default class XLSExport {
     let data = [];
     let isNext = false;
     let page = 1;
-    let columns = params._columns ||
-      (params?.fields ? objSnakeToCamel(params?.fields) : []);
+    const columns = params._columns || (params?.fields ? objSnakeToCamel(params?.fields) : []);
 
     do {
       const { items, next } = await this.fetchMethod({

package/src/modules/CSVExport/__tests__/CSVExport.spec.js

@@ -18,8 +18,7 @@ const dataList = [
 describe('CSV Export', () => {
   let wrapper;
   const Component = {
-    render() {
-    },
+    render() {},
     mixins: [CSVExportMixin],
     created() {
       this.initCSVExport(() => ({ items: dataList }), { filename: 'jest' });

package/src/modules/CSVExport/mixins/exportCSVMixin.js

@@ -14,9 +14,7 @@ export default {
       return this.CSVExport ? this.CSVExport.downloadProgress.count : 0;
     },
     selectedIds() {
-      return this.dataList
-      .filter((item) => item._isSelected)
-      .map((item) => item.id);
+      return this.dataList.filter((item) => item._isSelected).map((item) => item.id);
     },
     isAnySelected() {
       return !!this.selectedIds.length;
@@ -31,7 +29,7 @@ export default {
     async exportCSV(exportParams) {
       const routeQuery = this.$route?.query;
       const params = {
-        ...exportParams || routeQuery,
+        ...(exportParams || routeQuery),
         size: 5000,
       };
       if (this.isAnySelected) params.id = this.selectedIds;
@@ -41,7 +39,6 @@ export default {
       } catch (err) {
         throw err;
       }
-
     },
   },
 };

package/src/modules/CSVExport/mixins/exportXLSMixin.js

@@ -14,9 +14,7 @@ export default {
       return this.XLSExport ? this.XLSExport.downloadProgress.count : 0;
     },
     selectedIds() {
-      return this.dataList
-      .filter((item) => item._isSelected)
-      .map((item) => item.id);
+      return this.dataList.filter((item) => item._isSelected).map((item) => item.id);
     },
     isAnySelected() {
       return !!this.selectedIds.length;
@@ -30,7 +28,7 @@ export default {
     async exportXLS(exportParams) {
       const routeQuery = this.$route?.query;
       const params = {
-        ...exportParams || routeQuery,
+        ...(exportParams || routeQuery),
         size: 5000,
       };
       if (this.isAnySelected) params.id = this.selectedIds;

package/src/modules/CardStoreModule/store/CardStoreModule.js

@@ -1,7 +1,6 @@
 import deepCopy from 'deep-copy';
 import set from 'lodash/set.js';
-import BaseStoreModule
-  from '../../../store/BaseStoreModules/BaseStoreModule.js';
+import BaseStoreModule from '../../../store/BaseStoreModules/BaseStoreModule.js';
 
 export default class CardStoreModule extends BaseStoreModule {
   state = {
@@ -69,10 +68,7 @@ export default class CardStoreModule extends BaseStoreModule {
     },
   };
 
-  getModule({
-              state = {},
-              ...rest
-            } = {}) {
+  getModule({ state = {}, ...rest } = {}) {
     this.state = {
       ...this.state,
       ...state,

package/src/modules/DeleteConfirmationPopup/__tests__/delete-confirmation-popup.spec.js

@@ -1,8 +1,7 @@
 import { mount, shallowMount } from '@vue/test-utils';
 import { ref } from 'vue';
 import { useValidation } from '../../../mixins/validationMixin/useValidation.js';
-import DeleteConfirmationPopup
-  from '../components/delete-confirmation-popup.vue';
+import DeleteConfirmationPopup from '../components/delete-confirmation-popup.vue';
 
 vi.mock('../../../mixins/validationMixin/useValidation.js');
 
@@ -31,8 +30,9 @@ describe('DeleteConfirmationPopup', () => {
         callback,
       },
     });
-    const button = wrapper.findAllComponents({ name: 'wt-button' })
-    .find((btn) => btn.text().includes('Yes'));
+    const button = wrapper
+      .findAllComponents({ name: 'wt-button' })
+      .find((btn) => btn.text().includes('Yes'));
     expect(button.text()).toContain('Yes');
     await button.trigger('click');
     await wrapper.vm.$nextTick();
@@ -47,8 +47,9 @@ describe('DeleteConfirmationPopup', () => {
         callback: vi.fn(),
       },
     });
-    expect(wrapper.find('.delete-confirmation-popup__content').text())
-    .toContain(deleteCount.toString());
+    expect(wrapper.find('.delete-confirmation-popup__content').text()).toContain(
+      deleteCount.toString(),
+    );
   });
 
   it('yes button emitted close', async () => {
@@ -58,8 +59,9 @@ describe('DeleteConfirmationPopup', () => {
         callback: vi.fn(),
       },
     });
-    const button = wrapper.findAllComponents({ name: 'wt-button' })
-    .find((btn) => btn.text().includes('Yes'));
+    const button = wrapper
+      .findAllComponents({ name: 'wt-button' })
+      .find((btn) => btn.text().includes('Yes'));
     await button.vm.$emit('close');
     await wrapper.vm.$nextTick();
     expect(button.emitted('close')).toBeTruthy();
@@ -72,8 +74,9 @@ describe('DeleteConfirmationPopup', () => {
         callback: vi.fn(),
       },
     });
-    const button = wrapper.findAllComponents({ name: 'wt-button' })
-    .find((btn) => btn.text().includes('No'));
+    const button = wrapper
+      .findAllComponents({ name: 'wt-button' })
+      .find((btn) => btn.text().includes('No'));
     await button.vm.$emit('close');
     await wrapper.vm.$nextTick();
     expect(button.emitted('close')).toBeTruthy();

package/src/modules/DeleteConfirmationPopup/components/delete-confirmation-popup.vue

@@ -52,9 +52,7 @@ const props = defineProps({
   },
 });
 
-const emit = defineEmits([
-  'close',
-]);
+const emit = defineEmits(['close']);
 
 const attrs = useAttrs();
 
@@ -64,18 +62,11 @@ const isDeleting = ref(false);
 
 const deleteMessage = computed(() => {
   if (props.deleteCount === 0) {
-    return t(
-      'webitelUI.deleteConfirmationPopup.askingAlert',
-      2,
-      null,
-      { count: t('webitelUI.deleteConfirmationPopup.deleteAll') },
-    );
+    return t('webitelUI.deleteConfirmationPopup.askingAlert', 2, null, {
+      count: t('webitelUI.deleteConfirmationPopup.deleteAll'),
+    });
   }
-  return t(
-    'webitelUI.deleteConfirmationPopup.askingAlert',
-    { count: props.deleteCount },
-    null,
-  );
+  return t('webitelUI.deleteConfirmationPopup.askingAlert', { count: props.deleteCount }, null);
 });
 
 function close() {

package/src/modules/FilesExport/FilesExport.js

@@ -25,14 +25,15 @@ export default class FilesExport {
 
   _fetchFileBinary(fileId) {
     const url = this.filesURL(fileId);
-    return new Promise((resolve, reject) => (
+    return new Promise((resolve, reject) =>
       jszipUtils.getBinaryContent(url, (err, data) => {
         if (err) {
           reject(err);
         } else {
           resolve(data);
         }
-      })));
+      }),
+    );
   }
 
   resetProgress() {
@@ -96,7 +97,7 @@ export default class FilesExport {
     try {
       this.isLoading = true;
       const zip = new JSZip();
-      if (files && files.length) await this._addFilesToZip(files, zip);
+      if (files?.length) await this._addFilesToZip(files, zip);
       else {
         await this._fetchAndZip(zip, reqParams);
       }

package/src/modules/FilesExport/__tests__/FilesExport.spec.js

@@ -11,9 +11,7 @@ vi.mock('file-saver-es', () => ({
   saveAs: vi.fn(),
 }));
 
-const dataList = [
-  { files: [{ name: 'jest', id: '1', mimeType: 'mime/type' }] },
-];
+const dataList = [{ files: [{ name: 'jest', id: '1', mimeType: 'mime/type' }] }];
 const selectedDataList = [
   {
     _isSelected: true,
@@ -26,14 +24,10 @@ const selectedDataList = [
 ];
 
 describe('File Export', () => {
-  jszipUtils.getBinaryContent.mockImplementation((
-    url,
-    callback,
-  ) => callback(null, {}));
+  jszipUtils.getBinaryContent.mockImplementation((url, callback) => callback(null, {}));
   let wrapper;
   const Component = {
-    render() {
-    },
+    render() {},
     mixins: [FilesExportMixin],
     created() {
       this.initFilesExport({
@@ -60,10 +54,16 @@ describe('File Export', () => {
 
   it('mixin correctly computes selectedFiles()', () => {
     wrapper = shallowMount(Component, {
-      computed: { selectedItems() { return selectedDataList; } },
+      computed: {
+        selectedItems() {
+          return selectedDataList;
+        },
+      },
     });
-    expect(wrapper.vm.getSelectedFiles())
-    .toEqual([...selectedDataList[0].files, ...selectedDataList[1].files]);
+    expect(wrapper.vm.getSelectedFiles()).toEqual([
+      ...selectedDataList[0].files,
+      ...selectedDataList[1].files,
+    ]);
   });
 
   it('mixin catches export error and resets isFilesLoading on export error', async () => {

package/src/modules/FilesExport/mixins/exportFilesMixin.js

@@ -15,9 +15,7 @@ export default {
     },
 
     filesZippingProgress() {
-      return this.FilesExport
-        ? Math.floor(this.FilesExport.zippingProgress.percent)
-        : 0;
+      return this.FilesExport ? Math.floor(this.FilesExport.zippingProgress.percent) : 0;
     },
   },
 
@@ -29,10 +27,11 @@ export default {
     getSelectedFiles() {
       let files = null;
       if (this.selectedItems?.length) {
-        files = this.selectedItems.reduce((filesAccumulator, next) => (
-          next.files
-            ? [...filesAccumulator, ...next.files]
-            : filesAccumulator), []);
+        files = this.selectedItems.reduce(
+          (filesAccumulator, next) =>
+            next.files ? [...filesAccumulator, ...next.files] : filesAccumulator,
+          [],
+        );
       }
       return files;
     },

package/src/modules/FilesExport/scripts/generateMediaURL.js

@@ -1,7 +1,6 @@
 const generateMediaURL = (id) => {
   const token = localStorage.getItem('access-token');
-  const BASE_URL = process?.env?.VUE_APP_API_URL ||
-    import.meta.env.VITE_API_URL;
+  const BASE_URL = process?.env?.VUE_APP_API_URL || import.meta.env.VITE_API_URL;
   return `${BASE_URL}/storage/recordings/${id}/stream?access_token=${token}`;
 };