@webitel/ui-sdk 23.12.2 → 23.12.5-1

package/src/modules/QueryFilters/components/filter-from-to.vue

@@ -6,7 +6,8 @@
         <wt-label
           class="filter-from-to__input-label"
           for="filter-from-to-from"
-        >{{ $t('reusable.from') }}
+        >
+          {{ $t('reusable.from') }}
         </wt-label>
         <wt-input
           class="filter-from-to-input"
@@ -16,13 +17,14 @@
           :number-min="0"
           :number-max="numberMax"
           @input="setFrom"
-        ></wt-input>
+        />
       </div>
       <div class="filter-from-to__input-wrapper">
         <wt-label
           class="filter-from-to__input-label"
           for="filter-from-to-to"
-        >{{ $t('reusable.to') }}
+        >
+          {{ $t('reusable.to') }}
         </wt-label>
         <wt-input
           class="filter-from-to-input"
@@ -32,7 +34,7 @@
           :number-min="0"
           :number-max="numberMax"
           @input="setTo"
-        ></wt-input>
+        />
       </div>
     </div>
   </div>
@@ -43,7 +45,7 @@ import debounce from '../../../scripts/debounce';
 import baseFilterMixin from '../mixins/baseFilterMixin/baseFilterMixin';
 
 export default {
-  name: 'filter-from-to',
+  name: 'FilterFromTo',
   mixins: [baseFilterMixin],
   props: {
     filterQuery: {
@@ -57,6 +59,11 @@ export default {
       type: Number,
     },
   },
+
+  created() {
+    this.setFrom = debounce(this.setFrom);
+    this.setTo = debounce(this.setTo);
+  },
   methods: {
     restore() {
       this.restoreFrom();
@@ -97,11 +104,6 @@ export default {
       });
     },
   },
-
-  created() {
-    this.setFrom = debounce(this.setFrom);
-    this.setTo = debounce(this.setTo);
-  },
 };
 </script>
 

package/src/modules/QueryFilters/components/filter-search.vue

@@ -2,9 +2,9 @@
   <wt-search-bar
     :value="filterSchema.value"
     debounce
+    :placeholder="$t('reusable.search')"
     @input="setValue({ filter: filterQuery, value: $event })"
     @search="setValueToQuery({ filterQuery, value: $event })"
-    :placeholder="$t('reusable.search')"
   />
 </template>
 
@@ -12,7 +12,7 @@
 import baseFilterMixin from '../mixins/baseFilterMixin/baseFilterMixin';
 
 export default {
-  name: 'filter-search',
+  name: 'FilterSearch',
   mixins: [baseFilterMixin],
   props: {
     filterQuery: {

package/src/modules/QueryFilters/components/filter-table-fields.vue

@@ -3,15 +3,20 @@
     :headers="headers"
     :static-headers="staticHeaders"
     @change="change"
-  ></wt-table-column-select>
+  />
 </template>
 
 <script>
 import baseFilterMixin from '../mixins/baseFilterMixin/baseFilterMixin';
 
 export default {
-  name: 'filter-table-fields',
+  name: 'FilterTableFields',
   mixins: [baseFilterMixin],
+
+  model: {
+    prop: 'headers',
+    event: 'change',
+  },
   props: {
     entity: {
       type: String,
@@ -31,11 +36,6 @@ export default {
     filterQuery: 'fields',
   }),
 
-  model: {
-    prop: 'headers',
-    event: 'change',
-  },
-
   methods: {
     change(headers) {
       this.setValue(headers);

package/src/modules/QueryFilters/mixins/__tests__/apiFilterMixin.spec.js

@@ -12,7 +12,7 @@ const team = ['1', '2'];
 const filterSchema = new ApiFilterSchema();
 
 describe('API filter mixin', () => {
-  const setValue = jest.fn();
+  const setValue = vi.fn();
   const Component = {
     render() {},
     mixins: [apiFilterMixin],

package/src/modules/QueryFilters/mixins/__tests__/enumFilterMixin.spec.js

@@ -17,7 +17,7 @@ const router = createRouter({
 });
 
 describe('Enum filter mixin', () => {
-  const setValue = jest.fn();
+  const setValue = vi.fn();
   const Component = {
     render() {
     },
@@ -53,7 +53,7 @@ describe('Enum filter mixin', () => {
 
   it('Attaches locales to options, if they have "locale" key', async () => {
     const options = [{
-      locale: 'jest.locale',
+      locale: 'vi.locale',
     }];
     const expectedOptions = [{
       locale: options[0].locale,

package/src/modules/QueryFilters/mixins/__tests__/paginationFilterMixin.spec.js

@@ -11,8 +11,8 @@ const page = 2;
 const size = 20;
 
 describe('Pagination filter mixin', () => {
-  const setPage = jest.fn();
-  const setSize = jest.fn();
+  const setPage = vi.fn();
+  const setSize = vi.fn();
   let wrapper;
   const Component = {
     render() {},

package/src/modules/QueryFilters/mixins/__tests__/sortFilterMixin.spec.js

@@ -32,7 +32,7 @@ const sortedHeaders = [{
 }];
 
 describe('Sort filter mixin', () => {
-  const setHeaders = jest.fn();
+  const setHeaders = vi.fn();
   const Component = {
     render() {},
     mixins: [sortFilterMixin],

package/src/modules/QueryFilters/store/__tests__/QueryFiltersStoreModule.spec.js

@@ -33,7 +33,7 @@ describe('QueryFiltersStoreModule getters', () => {
   });
   it('GET_FILTERS filters aggregator', () => {
     const { GET_FILTER } = module.getters;
-    module.getters.GET_FILTER = jest.fn((filter) => GET_FILTER(state)(filter));
+    module.getters.GET_FILTER = vi.fn((filter) => GET_FILTER(state)(filter));
     expect(module.getters.GET_FILTERS(state, module.getters))
       .toEqual({ agent: [1], search: 'jest' });
   });
@@ -42,7 +42,7 @@ describe('QueryFiltersStoreModule getters', () => {
 describe('QueryFiltersStoreModule actions', () => {
   const context = {
     state: { ...state },
-    commit: jest.fn(),
+    commit: vi.fn(),
   };
   const module = new QueryFiltersStoreModule().getModule();
   it('SET_FILTER: single value filter', () => {

package/src/modules/Userinfo/classes/ApplicationsAccess.js

@@ -135,6 +135,10 @@ const applicationsAccess = (value = true) => ({
       _enabled: value,
       _locale: `WebitelApplications.${WebitelApplications.ADMIN}.sections.${AdminSections.EMAIL_PROFILES}`,
     },
+    [AdminSections.SINGLE_SIGN_ON]: {
+      _enabled: value,
+      _locale: `WebitelApplications.${WebitelApplications.ADMIN}.sections.${AdminSections.SINGLE_SIGN_ON}`,
+    },
     [AdminSections.IMPORT_CSV]: {
       _enabled: value,
       _locale: `WebitelApplications.${WebitelApplications.ADMIN}.sections.${AdminSections.IMPORT_CSV}`,
@@ -155,9 +159,9 @@ const applicationsAccess = (value = true) => ({
       _enabled: value,
       _locale: `WebitelApplications.${WebitelApplications.ADMIN}.sections.${AdminSections.CHANGELOGS}`,
     },
-    [AdminSections.SETTINGS]: {
+    [AdminSections.CONFIGURATION]: {
       _enabled: value,
-      _locale: `WebitelApplications.${WebitelApplications.ADMIN}.sections.${AdminSections.SETTINGS}`,
+      _locale: `WebitelApplications.${WebitelApplications.ADMIN}.sections.${AdminSections.CONFIGURATION}`,
     },
   },
   [WebitelApplications.AUDIT]: {

package/src/modules/Userinfo/components/__tests__/auth.spec.js

@@ -1,7 +1,6 @@
 import { shallowMount } from '@vue/test-utils';
 import { createStore } from 'vuex';
 import { createRouter, createWebHistory } from 'vue-router';
-import JSDOM from 'jsdom';
 import authAPI from '../../api/auth';
 import userinfoAPI from '../../api/userinfo';
 import Auth from '../the-auth.vue';
@@ -11,19 +10,18 @@ import '../../../../../tests/mocks/localStorageMock';
 
 localStorage.setItem('access-token', 'jest');
 
-authAPI.setToken = jest.fn();
-userinfoAPI.getSession = jest.fn(() => ({}));
-userinfoAPI.getApplicationsAccess = jest.fn(() => ({}));
+authAPI.setToken = vi.fn();
+userinfoAPI.getSession = vi.fn(() => ({}));
+userinfoAPI.getApplicationsAccess = vi.fn(() => ({}));
 
 describe('Auth', () => {
   let store;
   let wrapper;
-  global.window = new JSDOM.JSDOM().window;
   const router = createRouter({
     history: createWebHistory(),
     routes: [],
   });
-  router.replace = jest.fn();
+  router.replace = vi.fn();
 
   const userinfo = new UserinfoStoreModule().getModule();
   beforeEach(() => {
@@ -45,11 +43,12 @@ describe('Auth', () => {
   it('sets token, gets session and opens app after auth token message emit', async () => {
     const accessToken = 'hello there';
     window.postMessage({ accessToken }, '*');
-    await setTimeout(() => {
+    await new Promise((resolve) => setTimeout(() => {
       expect(authAPI.setToken).toHaveBeenCalledWith(accessToken);
       expect(userinfoAPI.getSession).toHaveBeenCalled();
       expect(userinfoAPI.getApplicationsAccess).toHaveBeenCalled();
       expect(router.replace).toHaveBeenCalled();
-    }, 100);
+      resolve();
+    }, 100));
   });
 });

package/src/modules/Userinfo/components/the-auth.vue

@@ -1,7 +1,10 @@
 <template>
   <div class="auth-wrap">
-    <div v-show="!isLoaded" class="auth-loader">
-      <wt-loader/>
+    <div
+      v-show="!isLoaded"
+      class="auth-loader"
+    >
+      <wt-loader />
     </div>
     <iframe
       class="auth"
@@ -16,10 +19,10 @@
 <script>
 import AuthAPI from '../api/auth';
 
-const authURL = process.env.VUE_APP_AUTH_MODULE_URL;
+const authURL = process ? process.env.VUE_APP_AUTH_MODULE_URL : import.meta.env.VITE_AUTH_MODE_URL;
 
 export default {
-  name: 'auth',
+  name: 'Auth',
   props: {
     namespace: {
       type: String,
@@ -34,7 +37,7 @@ export default {
   mounted() {
     window.addEventListener('message', this.authMessageHandler, false);
   },
-  destroyed() {
+  unmounted() {
     window.removeEventListener('message', this.authMessageHandler, false);
   },
 

package/src/scripts/debounce.js

@@ -1,4 +1,4 @@
-import lodashDebounce from 'lodash.debounce';
+import lodashDebounce from 'lodash/debounce';
 
 const debounce = (fn, wait = 1000, options) => lodashDebounce(fn, wait, options);
 

package/src/scripts/saveAsJSON.js

@@ -0,0 +1,9 @@
+import { saveAs } from 'file-saver';
+
+const saveAsJSON = (name, content) => {
+  const fileName = name.replace(/[ ,]+/g, '-');
+  const file = new Blob([JSON.stringify(content, null, 4)], { type: 'application/json' });
+  saveAs(file, fileName);
+};
+
+export default saveAsJSON;

package/src/store/BaseStoreModules/__tests__/BaseStoreModule.spec.js

@@ -1,12 +1,12 @@
 import BaseStoreModule from '../BaseStoreModule';
 
 const APIModule = {
-  getList: jest.fn(),
-  get: jest.fn(),
-  add: jest.fn(),
-  update: jest.fn(),
-  patch: jest.fn(),
-  delete: jest.fn(),
+  getList: vi.fn(),
+  get: vi.fn(),
+  add: vi.fn(),
+  update: vi.fn(),
+  patch: vi.fn(),
+  delete: vi.fn(),
 };
 
 describe('Base Store Module', () => {

package/src/validators/variableSearchValidator/__tests__/variableSearchValidator.spec.js

@@ -0,0 +1,48 @@
+import variableSearchValidator from '../variableSearchValidator';
+
+describe('Variable search validator', () => {
+  it('Ordinary search', () => {
+    const searchValue = 'height=100';
+    expect(variableSearchValidator(searchValue)).toBe(true);
+  });
+  it('Search with spacing in value and key', () => {
+   const searchValue = 'your height=5 feet 5½ inches (166 cm)';
+    expect(variableSearchValidator(searchValue)).toBe(true);
+  });
+  it('Search with spacing in value', () => {
+    const searchValue = 'height=5 feet 5½ inches (166 cm)';
+    expect(variableSearchValidator(searchValue)).toBe(true);
+  });
+  it('Search with spacing in value and spaces before key and after value', () => {
+    const searchValue = ' height=5 feet 5½ inches (166 cm) ';
+    expect(variableSearchValidator(searchValue)).toBe(true);
+  });
+  it('Search with snake_case', () => {
+    const searchValue = 'expected_output=valid_number';
+    expect(variableSearchValidator(searchValue)).toBe(true);
+  });
+  it('Wrong search with spacing after "=" sign', () => {
+    const searchValue = 'height= 100';
+    expect(variableSearchValidator(searchValue)).toBe(false);
+  });
+  it('Wrong search with spacing before "=" sign', () => {
+    const searchValue = 'height =100';
+    expect(variableSearchValidator(searchValue)).toBe(false);
+  });
+  it('Wrong search with spacing near "=" sign', () => {
+    const searchValue = 'height = 100';
+    expect(variableSearchValidator(searchValue)).toBe(false);
+  });
+  it('Space search', () => {
+    const searchValue = ' ';
+    expect(variableSearchValidator(searchValue)).toBe(false);
+  });
+  it('Empty search', () => {
+    const searchValue = '';
+    expect(variableSearchValidator(searchValue)).toBe(true);
+  });
+  it('Multiple "=" search', () => {
+    const searchValue = 'height=5 feet 5½ inches (166 cm), age=1231, fin=123231';
+    expect(variableSearchValidator(searchValue)).toBe(false);
+  });
+});

package/src/validators/variableSearchValidator/variableSearchValidator.js

@@ -0,0 +1,10 @@
+export default function variableSearchValidator(input) {
+  if (input) {
+    const splitInput = input.split('=');
+    const [key, value] = splitInput;
+    if (key.endsWith(' ') || value.startsWith(' ') || splitInput.length !== 2) {
+      return false;
+    }
+  }
+  return true;
+}

package/src/validators/websocketValidator/__tests__/websocketValidator.spec.js

@@ -0,0 +1,28 @@
+import websocketValidator from '../websocketValidator';
+
+describe('websocketValidator', () => {
+  it('truthy case 1: localhost ws', () => {
+    expect(websocketValidator('ws://localhost:8080')).toBe(true);
+  });
+  it('truthy case 2: localhost wss', () => {
+    expect(websocketValidator('wss://localhost:8080')).toBe(true);
+  });
+  it('truthy case 3: ip ws', () => {
+    expect(websocketValidator('ws://10.10.10.10:8080')).toBe(true);
+  });
+  it('truthy case 4: dns name', () => {
+    expect(websocketValidator('wss://example.com')).toBe(true);
+  });
+  it('truthy case 5: dns name', () => {
+    expect(websocketValidator('wss://example')).toBe(true);
+  });
+  it('truthy case 6: dns name', () => {
+    expect(websocketValidator('wss://example.com/ws')).toBe(true);
+  });
+  it('truthy case 7: dns name', () => {
+    expect(websocketValidator('wss://socket.socket.com/v3/channel_123?api_key=123')).toBe(true);
+  });
+  it('falsy case 1: empty string', () => {
+    expect(websocketValidator('')).toBe(false);
+  });
+});

package/src/validators/websocketValidator/websocketValidator.js

@@ -0,0 +1,9 @@
+// That's strange but i haven't found any npm package with websocket validator
+export default (value) => {
+  try {
+    const url = new URL(value);
+    return (/^(wss?)/i).test(url.protocol);
+  } catch (e) {
+    return false;
+  }
+};

package/dist/demo.html

@@ -1 +0,0 @@
-<!doctype html><meta charset="utf-8"><title>ui-sdk demo</title><script src="./ui-sdk.umd.js"></script><link rel="stylesheet" href="./ui-sdk.css"><script>console.log(ui-sdk)</script>