@webitel/ui-sdk 0.1.11 → 0.1.112

package/src/scripts/caseConverters.js

@@ -0,0 +1,78 @@
+export const snakeToCamel = (str) => str.replace(
+  /([a-z])([_])([a-z])/g,
+  (group, p1, p2, p3) => [p1, p3.toUpperCase()].join(''),
+);
+
+export const camelToSnake = (str) => str.replace(
+  /([A-Z])/g,
+  (group) => group.toLowerCase()
+    .replace('', '_'),
+);
+
+export const kebabToCamel = (str) => str.replace(
+  /([-_][a-z])/g,
+  (group) => group.toUpperCase()
+    .replace('-', ''),
+);
+
+export const camelToKebab = (str) => str.replace(
+  /([A-Z])/g,
+  (group) => group.toLowerCase()
+    .replace('', '-'),
+);
+
+export const objSnakeToCamel = (obj, skipKeys = []) => {
+  if (!obj) return obj;
+  const newObj = {};
+  if (Array.isArray(obj)) {
+    return obj.map((value) => {
+      if (typeof value === 'object') {
+        return objSnakeToCamel(value, skipKeys);
+      } if (typeof value === 'string') return snakeToCamel(value);
+      return value; // number
+    });
+  }
+  Object.keys(obj)
+    .forEach((oldKey) => {
+      if (skipKeys.includes(oldKey)) {
+        newObj[oldKey] = obj[oldKey];
+      } else {
+        const newKey = snakeToCamel(oldKey);
+        let value = obj[oldKey];
+        if (Array.isArray(value) || (value !== null && value.constructor === Object)) {
+          value = objSnakeToCamel(value, skipKeys);
+        }
+        newObj[newKey] = value;
+      }
+    });
+
+  return newObj;
+};
+
+export const objCamelToSnake = (obj, skipKeys = []) => {
+  if (!obj) return obj;
+  const newObj = {};
+  if (Array.isArray(obj)) {
+    return obj.map((value) => {
+      if (typeof value === 'object') {
+        return objCamelToSnake(value, skipKeys);
+      } if (typeof value === 'string') return camelToSnake(value);
+      return value; // number
+    });
+  }
+  Object.keys(obj)
+    .forEach((oldKey) => {
+      if (skipKeys.includes(oldKey)) {
+        newObj[oldKey] = obj[oldKey];
+      } else {
+        const newKey = camelToSnake(oldKey);
+        let value = obj[oldKey];
+        if (Array.isArray(value) || (value !== null && value.constructor === Object)) {
+          value = objCamelToSnake(value, skipKeys);
+        }
+        newObj[newKey] = value;
+      }
+    });
+
+  return newObj;
+};

package/src/scripts/convertDuration.js

@@ -0,0 +1,15 @@
+const convertDuration = (duration) => {
+  if (!duration) return '00:00:00';
+
+  let hour = `${Math.floor(duration / 3600)}`;
+  let min = `${Math.floor((duration % 3600) / 60)}`;
+  let sec = `${Math.floor((duration % 3600) % 60)}`;
+
+  if (hour.length === 1) hour = `0${hour}`;
+  if (min.length === 1) min = `0${min}`;
+  if (sec.length === 1) sec = `0${sec}`;
+
+  return `${hour}:${min}:${sec}`;
+};
+
+export default convertDuration;

package/src/scripts/editProxy.js

@@ -0,0 +1,9 @@
+const editProxy = (item) => new Proxy(item, {
+  set(obj, prop, value) {
+    obj._dirty = true;
+    obj[prop] = value;
+    return obj;
+  },
+});
+
+export default editProxy;

package/src/scripts/eventBus.js

@@ -0,0 +1,4 @@
+import Vue from 'vue';
+
+const eventBus = new Vue();
+export default eventBus;

package/src/scripts/isEmpty.js

@@ -0,0 +1,9 @@
+// checks if value is Falsy,
+// including empty arrays or objects
+const isEmpty = (value) => {
+  if (Array.isArray(value)) return !value.length;
+  if (typeof value === 'object') return !value || !Object.keys(value).length;
+  return !value;
+};
+
+export default isEmpty;

package/src/scripts/prettifyFileSize.js

@@ -0,0 +1,11 @@
+const prettifyFileSize = (size) => {
+  // eslint-disable-next-line no-param-reassign
+  if (typeof size === 'string') size = +size;
+  if (!size) return '0';
+  const k = 1024;
+  const sizes = ['b', 'Kb', 'Mb', 'Gb', 'Tb', 'Pb', 'Eb', 'Zb', 'Yb'];
+  const i = Math.floor(Math.log(size) / Math.log(k));
+  return `${parseFloat((size / k ** i).toFixed(2))} ${sizes[i]}`;
+};
+
+export default prettifyFileSize;

package/src/scripts/prettifyTime.js

@@ -0,0 +1,9 @@
+const prettifyTime = (time) => {
+  let date;
+  if (time instanceof Date) date = time;
+  else if (typeof time === 'number') date = new Date(time);
+  else date = new Date(+time);
+  return date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
+};
+
+export default prettifyTime;

package/src/scripts/preventHiddenPageCallsDecorator.js

@@ -0,0 +1,6 @@
+const isPageHidden = () => (
+   document.hidden || document.msHidden || document.webkitHidden || document.mozHidden
+);
+
+const preventHiddenPageCallsDecorator = (method) => (args) => isPageHidden() || method(args);
+export default preventHiddenPageCallsDecorator;

package/src/scripts/sortQueryAdapters.js

@@ -0,0 +1,21 @@
+export const SortSymbols = Object.freeze({
+  ASC: 'asc',
+  DESC: 'desc',
+  NONE: null,
+});
+
+export const sortToQueryAdapter = (order) => {
+  switch (order) {
+    case SortSymbols.ASC: return '+';
+    case SortSymbols.DESC: return '-';
+    default: return '';
+  }
+};
+
+export const queryToSortAdapter = (order) => {
+  switch (order) {
+    case '+': return SortSymbols.ASC;
+    case '-': return SortSymbols.DESC;
+    default: return SortSymbols.NONE;
+  }
+};

package/src/store/BaseStoreModules/BaseStoreModule.js

@@ -0,0 +1,49 @@
+export default class BaseStoreModule {
+  state = {};
+
+  getters = {};
+
+  actions = {};
+
+  mutations = {};
+
+  modules = {};
+
+  attachAPIModule(APIModule) {
+    this._APIModule = APIModule;
+    return this;
+  }
+
+  generateAPIActions() {
+    if (!this._APIModule) throw new ReferenceError('attach API module first!');
+    this.actions.GET_LIST = (context, params = {}) => this._APIModule.getList({ ...context.state, ...params });
+    this.actions.GET_ITEM = (context, params = {}) => this._APIModule.get({ ...context.state, ...params });
+    this.actions.POST_ITEM = (context) => this._APIModule.add(context.state);
+    this.actions.PATCH_ITEM = (context, { id, changes }) => (this._APIModule.patch({ ...context.state, id, changes }));
+    this.actions.UPD_ITEM = (context) => this._APIModule.update(context.state);
+    this.actions.DELETE_ITEM = (context, id) => this._APIModule.delete({ ...context.state, id });
+    return this;
+  }
+
+  setChildModules(modules) {
+    this.modules = modules;
+    return this;
+  }
+
+  getModule({
+              state = {},
+              getters = {},
+              actions = {},
+              mutations = {},
+              namespaced = true,
+            } = {}) {
+    return {
+      namespaced,
+      state: { ...this.state, ...state },
+      getters: { ...this.getters, ...getters },
+      actions: { ...this.actions, ...actions },
+      mutations: { ...this.mutations, ...mutations },
+      modules: this.modules,
+    };
+  }
+}

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

@@ -0,0 +1,104 @@
+import BaseStoreModule from '../BaseStoreModule';
+
+const APIModule = {
+  getList: jest.fn(),
+  get: jest.fn(),
+  add: jest.fn(),
+  update: jest.fn(),
+  patch: jest.fn(),
+  delete: jest.fn(),
+};
+
+describe('Base Store Module', () => {
+  let module;
+  beforeEach(() => {
+    module = new BaseStoreModule();
+  });
+  it('attaches api module and generates API actions from it', () => {
+    const _module = module
+      .attachAPIModule(APIModule)
+      .generateAPIActions()
+      .getModule();
+    expect(_module.actions.GET_LIST).toBeTruthy();
+    expect(_module.actions.GET_ITEM).toBeTruthy();
+    expect(_module.actions.POST_ITEM).toBeTruthy();
+    expect(_module.actions.PATCH_ITEM).toBeTruthy();
+    expect(_module.actions.UPD_ITEM).toBeTruthy();
+    expect(_module.actions.DELETE_ITEM).toBeTruthy();
+  });
+  it('generated GET_LIST correctly gets passed params', () => {
+    const state = { jest: 'jest' };
+    const params = { jest2: 'jest1' };
+    const context = { state };
+    const expectedParams = { jest: 'jest', jest2: 'jest1' };
+    const _module = module
+      .attachAPIModule(APIModule)
+      .generateAPIActions()
+      .getModule();
+    _module.actions.GET_LIST(context, params);
+    expect(APIModule.getList).toHaveBeenCalledWith(expectedParams);
+  });
+  it('generated GET_ITEM correctly gets passed params', () => {
+    const state = { jest: 'jest' };
+    const params = { jest2: 'jest1' };
+    const context = { state };
+    const expectedParams = { jest: 'jest', jest2: 'jest1' };
+    const _module = module
+      .attachAPIModule(APIModule)
+      .generateAPIActions()
+      .getModule();
+    _module.actions.GET_ITEM(context, params);
+    expect(APIModule.get).toHaveBeenCalledWith(expectedParams);
+  });
+  it('generated POST_ITEM correctly gets passed params', () => {
+    const state = { jest: 'jest' };
+    const context = { state };
+    const expectedParams = { jest: 'jest' };
+    const _module = module
+      .attachAPIModule(APIModule)
+      .generateAPIActions()
+      .getModule();
+    _module.actions.POST_ITEM(context);
+    expect(APIModule.add).toHaveBeenCalledWith(expectedParams);
+  });
+  it('generated PATCH_ITEM correctly gets passed params', () => {
+    const state = { jest: 'jest' };
+    const params = { id: '1', changes: { jest: 'my change!' } };
+    const context = { state };
+    const expectedParams = { jest: 'jest', id: '1', changes: { jest: 'my change!' } };
+    const _module = module
+      .attachAPIModule(APIModule)
+      .generateAPIActions()
+      .getModule();
+    _module.actions.PATCH_ITEM(context, params);
+    expect(APIModule.patch).toHaveBeenCalledWith(expectedParams);
+  });
+  it('generated UPD_ITEM correctly gets passed params', () => {
+    const state = { jest: 'jest' };
+    const context = { state };
+    const expectedParams = { jest: 'jest' };
+    const _module = module
+      .attachAPIModule(APIModule)
+      .generateAPIActions()
+      .getModule();
+    _module.actions.UPD_ITEM(context);
+    expect(APIModule.update).toHaveBeenCalledWith(expectedParams);
+  });
+  it('generated DELETE_ITEM correctly gets passed params', () => {
+    const state = { jest: 'jest' };
+    const params = '1';
+    const context = { state };
+    const expectedParams = { jest: 'jest', id: '1' };
+    const _module = module
+      .attachAPIModule(APIModule)
+      .generateAPIActions()
+      .getModule();
+    _module.actions.DELETE_ITEM(context, params);
+    expect(APIModule.delete).toHaveBeenCalledWith(expectedParams);
+  });
+  it('sets child modules', () => {
+    const jest = { state: 'jest' };
+    const _module = module.setChildModules({ jest }).getModule();
+    expect(_module.modules).toEqual({ jest });
+  });
+});

package/src/store/helpers/__tests__/getNamespacedState.spec.js

@@ -0,0 +1,11 @@
+import getNamespacedState from '../getNamespacedState';
+
+describe('getNamespacedState', () => {
+  const searchedValue = 'jest!';
+  const state = { lvl1: { lvl2: { lvl3: searchedValue } } };
+
+  it('correctly returns nested object values', () => {
+    const namespace = 'lvl1/lvl2/lvl3';
+    expect(getNamespacedState(state, namespace)).toBe(searchedValue);
+  });
+});

package/src/store/helpers/getNamespacedState.js

@@ -0,0 +1,5 @@
+const getNamespacedState = (state, namespace) => (
+  namespace.split('/').reduce((subState, subNamespace) => subState[subNamespace], state)
+);
+
+export default getNamespacedState;

package/dist/img/arrow-down--active--md.7b60f2fb6090366652124f77c543a516.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M11.5049 14.7841L7.20524 10.2583C6.93159 9.97038 6.93159 9.5036 7.20524 9.21584C7.47865 8.92805 7.9221 8.92805 8.19549 9.21584L12.0001 13.2205L15.8045 9.21595C16.078 8.92817 16.5214 8.92817 16.7949 9.21595C17.0684 9.50374 17.0684 9.97049 16.7949 10.2584L12.4951 14.7842C12.3583 14.9281 12.1792 15 12.0001 15C11.8209 15 11.6417 14.928 11.5049 14.7841Z" fill="black"/>
-</svg>

package/dist/img/arrow-down--disabled--md.f58424cd673258365e78863edd1e92cc.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M11.5049 14.7841L7.20524 10.2583C6.93159 9.97038 6.93159 9.5036 7.20524 9.21584C7.47865 8.92805 7.9221 8.92805 8.19549 9.21584L12.0001 13.2205L15.8045 9.21595C16.078 8.92817 16.5214 8.92817 16.7949 9.21595C17.0684 9.50374 17.0684 9.97049 16.7949 10.2584L12.4951 14.7842C12.3583 14.9281 12.1792 15 12.0001 15C11.8209 15 11.6417 14.928 11.5049 14.7841Z" fill="#EAEAEA"/>
-</svg>

package/dist/img/arrow-down--md.1843b60e1c244e066a650e8d19ea83c9.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M11.5049 14.7841L7.20524 10.2583C6.93159 9.97038 6.93159 9.5036 7.20524 9.21584C7.47865 8.92805 7.9221 8.92805 8.19549 9.21584L12.0001 13.2205L15.8045 9.21595C16.078 8.92817 16.5214 8.92817 16.7949 9.21595C17.0684 9.50374 17.0684 9.97049 16.7949 10.2584L12.4951 14.7842C12.3583 14.9281 12.1792 15 12.0001 15C11.8209 15 11.6417 14.928 11.5049 14.7841Z" fill="#ACACAC"/>
-</svg>

package/dist/img/calendar--active--md.7fd3d949ec7234a4940ea452d95b4165.svg

@@ -1,6 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M16 1.25C16.4142 1.25 16.75 1.58579 16.75 2V6C16.75 6.41421 16.4142 6.75 16 6.75C15.5858 6.75 15.25 6.41421 15.25 6V2C15.25 1.58579 15.5858 1.25 16 1.25Z" fill="black"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M8 1.25C8.41421 1.25 8.75 1.58579 8.75 2V6C8.75 6.41421 8.41421 6.75 8 6.75C7.58579 6.75 7.25 6.41421 7.25 6V2C7.25 1.58579 7.58579 1.25 8 1.25Z" fill="black"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M2.25 9C2.25 8.58579 2.58579 8.25 3 8.25H21C21.4142 8.25 21.75 8.58579 21.75 9C21.75 9.41421 21.4142 9.75 21 9.75H3C2.58579 9.75 2.25 9.41421 2.25 9Z" fill="black"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M2.25 6C2.25 4.48579 3.48579 3.25 5 3.25H19C20.5142 3.25 21.75 4.48579 21.75 6V19C21.75 20.5142 20.5142 21.75 19 21.75H5C3.48579 21.75 2.25 20.5142 2.25 19V6ZM5 4.75C4.31421 4.75 3.75 5.31421 3.75 6V19C3.75 19.6858 4.31421 20.25 5 20.25H19C19.6858 20.25 20.25 19.6858 20.25 19V6C20.25 5.31421 19.6858 4.75 19 4.75H5Z" fill="black"/>
-</svg>

package/dist/img/calendar--disabled--md.8e7a1e18f93ae8af270060400e6f881c.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M8.75 2C8.75 1.58579 8.41421 1.25 8 1.25C7.58579 1.25 7.25 1.58579 7.25 2V3.25H5C3.48579 3.25 2.25 4.48579 2.25 6V19C2.25 20.5142 3.48579 21.75 5 21.75H19C20.5142 21.75 21.75 20.5142 21.75 19V6C21.75 4.48579 20.5142 3.25 19 3.25H16.75V2C16.75 1.58579 16.4142 1.25 16 1.25C15.5858 1.25 15.25 1.58579 15.25 2V3.25H8.75V2ZM7.25 4.75V6C7.25 6.41421 7.58579 6.75 8 6.75C8.41421 6.75 8.75 6.41421 8.75 6V4.75H15.25V6C15.25 6.41421 15.5858 6.75 16 6.75C16.4142 6.75 16.75 6.41421 16.75 6V4.75H19C19.6858 4.75 20.25 5.31421 20.25 6V8.25H3.75V6C3.75 5.31421 4.31421 4.75 5 4.75H7.25ZM3.75 9.75V19C3.75 19.6858 4.31421 20.25 5 20.25H19C19.6858 20.25 20.25 19.6858 20.25 19V9.75H3.75Z" fill="#EAEAEA"/>
-</svg>

package/dist/img/calendar--md.9c265581c3a405ff0f0e46e8092f36b8.svg

@@ -1,6 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M16 1.25C16.4142 1.25 16.75 1.58579 16.75 2V6C16.75 6.41421 16.4142 6.75 16 6.75C15.5858 6.75 15.25 6.41421 15.25 6V2C15.25 1.58579 15.5858 1.25 16 1.25Z" fill="#808080"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M8 1.25C8.41421 1.25 8.75 1.58579 8.75 2V6C8.75 6.41421 8.41421 6.75 8 6.75C7.58579 6.75 7.25 6.41421 7.25 6V2C7.25 1.58579 7.58579 1.25 8 1.25Z" fill="#808080"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M2.25 9C2.25 8.58579 2.58579 8.25 3 8.25H21C21.4142 8.25 21.75 8.58579 21.75 9C21.75 9.41421 21.4142 9.75 21 9.75H3C2.58579 9.75 2.25 9.41421 2.25 9Z" fill="#808080"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M2.25 6C2.25 4.48579 3.48579 3.25 5 3.25H19C20.5142 3.25 21.75 4.48579 21.75 6V19C21.75 20.5142 20.5142 21.75 19 21.75H5C3.48579 21.75 2.25 20.5142 2.25 19V6ZM5 4.75C4.31421 4.75 3.75 5.31421 3.75 6V19C3.75 19.6858 4.31421 20.25 5 20.25H19C19.6858 20.25 20.25 19.6858 20.25 19V6C20.25 5.31421 19.6858 4.75 19 4.75H5Z" fill="#808080"/>
-</svg>

package/src/css/fonts.scss

@@ -1,9 +0,0 @@
-@font-face {
-  font-family: 'Montserrat Semi';
-  src: url('./fonts/Montserrat/Montserrat-SemiBold.ttf') format('truetype');
-}
-
-@font-face {
-  font-family: 'Montserrat Regular';
-  src: url('./fonts/Montserrat/Montserrat-Regular.ttf') format('truetype');
-}