@webitel/ui-sdk 24.12.95 → 24.12.97

package/src/modules/Filters/v2/table/createTableStore.store.ts

@@ -32,7 +32,7 @@ export const createTableStore = <Entity extends { id: string; etag?: string }>(
 
     const headersStore = useHeadersStore();
     const { headers, shownHeaders, fields, sort } = storeToRefs(headersStore);
-    const { updateSort, updateShownHeaders } = headersStore;
+    const { updateSort, updateShownHeaders, setupPersistence: setupHeadersPersistence } = headersStore;
 
     const filtersStore = useFiltersStore();
     const { filtersManager, isRestoring: isFiltersRestoring } =
@@ -116,12 +116,13 @@ export const createTableStore = <Entity extends { id: string; etag?: string }>(
       await Promise.allSettled([
         setupPaginationPersistence(),
         setupFiltersPersistence(),
+        setupHeadersPersistence(),
       ]);
 
       let loadingAfterFiltersChange = false;
 
       watch(
-        [() => filtersManager.value.getAllValues(), sort, size],
+        [() => filtersManager.value.getAllValues(), sort, fields, size],
         async () => {
           loadingAfterFiltersChange = true;
           updatePage(1);

package/src/modules/Userinfo/api/userinfo.js

@@ -1,38 +1,25 @@
-import applyTransform, {
-  notify,
-  snakeToCamel,
-} from '../../../api/transformers/index.js';
+import {
+  getSession,
+  getUiVisibilityAccess,
+  logout,
+  setInstance,
+} from '../v2/api/UserinfoAPI';
 
-const userinfo = (instance) => ({
-  async getSession() {
-    const url = '/userinfo';
-    try {
-      const response = await instance.get(url);
-      return applyTransform(response.data, [snakeToCamel()]);
-    } catch (err) {
-      throw applyTransform(err, [notify]);
-    }
-  },
+/**
+ * @deprecated remove after v25.06 release
+ * @description
+ * backward compat
+ * */
+const userinfo = (instance) => {
+  if (instance) {
+    setInstance(instance);
+  }
 
-  async getApplicationsAccess() {
-    const url = 'role/metadata/access';
-    try {
-      const response = await instance.get(url);
-      return applyTransform(response.data, [snakeToCamel()]);
-    } catch (err) {
-      throw applyTransform(err, [notify]);
-    }
-  },
-
-  async logout() {
-    const url = '/logout';
-
-    try {
-      return await instance.post(url, {});
-    } catch (err) {
-      throw applyTransform(err, [notify]);
-    }
-  },
-});
+  return {
+    getSession,
+    logout,
+    getUiVisibilityAccess,
+  };
+};
 
 export default userinfo;

package/src/modules/Userinfo/store/UserinfoStoreModule.js

@@ -117,7 +117,7 @@ export default class UserinfoStoreModule extends BaseStoreModule {
       }
 
       await context.dispatch('SET_SESSION', session);
-      const access = await userinfo.getApplicationsAccess();
+      const access = await userinfo.getUiVisibilityAccess();
       await context.dispatch(
         'SET_APPLICATIONS_ACCESS',
         new ApplicationsAccess({ access }).getAccess(),

package/src/modules/Userinfo/v2/api/UserinfoAPI.ts

@@ -0,0 +1,62 @@
+import type { AxiosInstance } from 'axios';
+
+import getDefaultInstance from '../../../../api/defaults/getDefaultInstance/getDefaultInstance';
+import applyTransform, {
+  merge,
+  notify,
+  snakeToCamel,
+} from '../../../../api/transformers/index.js';
+import type {
+  GlobalAccessApiResponseItem,
+  ScopeAccessApiResponseItem,
+  VisibilityAccess,
+} from '../types/UserAccess';
+
+let instance = getDefaultInstance();
+
+const setInstance = (newInstance: AxiosInstance) => {
+  instance = newInstance;
+};
+
+const getSession = async (): Promise<{
+  scope: ScopeAccessApiResponseItem[];
+  permissions: GlobalAccessApiResponseItem[];
+  userId: string;
+}> => {
+  const url = '/userinfo';
+  try {
+    const defaultObject = () => ({
+      scope: [],
+      permissions: [],
+    });
+
+    const response = await instance.get(url);
+    return applyTransform(response.data, [
+      merge(defaultObject()),
+      snakeToCamel(),
+    ]);
+  } catch (err) {
+    throw applyTransform(err, [notify]);
+  }
+};
+
+const getUiVisibilityAccess = async (): Promise<VisibilityAccess> => {
+  const url = 'role/metadata/access';
+  try {
+    const response = await instance.get(url);
+    return applyTransform(response.data, [snakeToCamel()]);
+  } catch (err) {
+    throw applyTransform(err, [notify]);
+  }
+};
+
+const logout = async () => {
+  const url = '/logout';
+  try {
+    return await instance.post(url, {});
+  } catch (err) {
+    throw applyTransform(err, [notify]);
+  }
+};
+
+export { getSession, getUiVisibilityAccess, logout, setInstance };

package/src/modules/Userinfo/v2/enums/GlobalActions/GlobalActions.ts

@@ -0,0 +1,36 @@
+/**
+ * @internal
+ * @description
+ * Represents backend response
+ * format for Global Access to Crud Actions.
+ * Should be converted to {@link CrudAction}
+ * */
+export const CrudGlobalAction = {
+  Read: 'read',
+  Write: 'write',
+  Delete: 'delete',
+  Add: 'add',
+} as const;
+
+export type CrudGlobalAction =
+  (typeof CrudGlobalAction)[keyof typeof CrudGlobalAction];
+
+/**
+ * @description
+ * Represents access to global specific actions
+ * like downloading files or exporting data
+ * */
+export const SpecialGlobalAction = {
+  PlaybackRecordFile: 'playbackRecordFile',
+  ManageUserLicense: 'manageUserLicense',
+  SchemeVariables: 'schemeVariables',
+  SystemSetting: 'systemSetting',
+  ManageUserRoles: 'manageUserRoles',
+  ExportDataGrid: 'exportDataGrid',
+  ViewCdrPhoneNumbers: 'viewCdrPhoneNumbers',
+  ChangeUserPassword: 'changeUserPassword',
+  EavesdropCall: 'eavesdropCall',
+} as const;
+
+export type SpecialGlobalAction =
+  (typeof SpecialGlobalAction)[keyof typeof SpecialGlobalAction];

package/src/modules/Userinfo/v2/enums/ScopeClass/ScopeClass.ts

@@ -0,0 +1,47 @@
+/**
+ * @description
+ * backend `scope` field userinfo response classes
+ * `class` represents a group of entities, managed by this one class
+ */
+export const ScopeClass = {
+  /**
+   * Includes:
+   * - {@link WtObject.Agent}
+   * - {@link }
+   */
+  Agent: 'cc_agent',
+  Queue: 'cc_queue',
+  Dictionaries: 'dictionaries',
+  EmailProfile: 'email_profile',
+
+  Skills: 'cc_skill',
+  Users: 'users',
+  Devices: 'devices',
+  AcrRouting: 'acr_routing',
+  Gateways: 'gateways',
+  AcrChatPlan: 'acr_chat_plan',
+  Chats: 'chats',
+  List: 'cc_list',
+  Calendars: 'calendars',
+  Team: 'cc_team',
+  ResourceGroup: 'cc_resource_group',
+  Resource: 'cc_resource',
+  StorageProfile: 'storage_profile',
+  CognitiveProfile: 'cognitive_profile',
+  SingleSignOn: 'single_sign_on',
+  ImportTemplate: 'import_template',
+  Trigger: 'trigger',
+  Schema: 'schema',
+  Role: 'roles',
+  Contacts: 'contacts',
+  MediaFile: 'media_file',
+  Logger: 'logger',
+  Calls: 'calls',
+  RecordFile: 'record_file',
+  ContactGroups: 'contact_groups',
+  ChatBots: 'chat_bots',
+  Cases: 'cases',
+  CaseComments: 'case_comments',
+} as const;
+
+export type ScopeClass = (typeof ScopeClass)[keyof typeof ScopeClass];

package/src/modules/Userinfo/v2/enums/index.ts

@@ -0,0 +1,7 @@
+import {
+  CrudGlobalAction,
+  SpecialGlobalAction,
+} from './GlobalActions/GlobalActions';
+import { ScopeClass } from './ScopeClass/ScopeClass';
+
+export { CrudGlobalAction, ScopeClass, SpecialGlobalAction };

package/src/modules/Userinfo/v2/mappings/mappings.ts

@@ -0,0 +1,161 @@
+import invert from 'lodash/fp/invert';
+
+import {
+  AdminSections,
+  AuditorSections,
+  CrmSections,
+  CrudAction,
+  SupervisorSections,
+  WtApplication,
+  WtObject,
+} from '../../../../enums';
+import { CrudGlobalAction, ScopeClass } from '../enums';
+
+export const mapGlobalActionToCrudAction = {
+  [CrudGlobalAction.Add]: CrudAction.Create,
+  [CrudGlobalAction.Read]: CrudAction.Read,
+  [CrudGlobalAction.Write]: CrudAction.Update,
+  [CrudGlobalAction.Delete]: CrudAction.Delete,
+};
+
+export const mapCrudActionToGlobalAction = invert(mapGlobalActionToCrudAction);
+
+/* one-to-many */
+export const mapScopeClassToWtObjects: Record<ScopeClass, WtObject[]> = {
+  [ScopeClass.Users]: [WtObject.User],
+  [ScopeClass.Devices]: [WtObject.Device],
+  [ScopeClass.Schema]: [WtObject.Flow],
+  [ScopeClass.AcrRouting]: [WtObject.Dialplan],
+  [ScopeClass.Gateways]: [WtObject.Gateway],
+  [ScopeClass.AcrChatPlan]: [WtObject.Chatplan],
+  [ScopeClass.Chats]: [WtObject.ChatGateway],
+  [ScopeClass.Dictionaries]: [
+    WtObject.Region,
+    WtObject.Bucket,
+    WtObject.Communication,
+    WtObject.PauseCause,
+  ],
+  [ScopeClass.List]: [WtObject.Blacklist],
+  [ScopeClass.Skills]: [WtObject.Skill],
+  [ScopeClass.Calendars]: [WtObject.Calendar],
+  [ScopeClass.MediaFile]: [WtObject.Media],
+  [ScopeClass.Agent]: [WtObject.Agent],
+  [ScopeClass.Queue]: [WtObject.Queue, WtObject.Member],
+  [ScopeClass.ResourceGroup]: [WtObject.ResourceGroup],
+  [ScopeClass.Resource]: [WtObject.Resource],
+  [ScopeClass.Team]: [WtObject.Team],
+  [ScopeClass.StorageProfile]: [WtObject.Storage],
+  [ScopeClass.CognitiveProfile]: [WtObject.CognitiveProfile],
+  [ScopeClass.EmailProfile]: [WtObject.EmailProfile],
+  [ScopeClass.SingleSignOn]: [WtObject.SingleSignOn],
+  [ScopeClass.ImportTemplate]: [WtObject.ImportCsv],
+  [ScopeClass.Trigger]: [WtObject.Trigger],
+  [ScopeClass.Role]: [WtObject.Role],
+  [ScopeClass.Contacts]: [WtObject.Contact],
+  [ScopeClass.Logger]: [WtObject.Logger], // Change log in Admin
+  [ScopeClass.Calls]: [WtObject.Call], // Call history
+  [ScopeClass.RecordFile]: [WtObject.RecordFile], // Call history
+  [ScopeClass.ContactGroups]: [WtObject.ContactGroup], //CRM
+  [ScopeClass.ChatBots]: [WtObject.ChatBot], // routing cht_gateway
+  [ScopeClass.Cases]: [WtObject.Cases], // CRM
+  [ScopeClass.CaseComments]: [WtObject.CaseComment],
+};
+
+export const mapScopeClassAccessTokenToCrudAction = {
+  r: CrudAction.Read,
+  w: CrudAction.Update,
+  d: CrudAction.Delete,
+  x: CrudAction.Create,
+};
+
+export const mapCrudActionToScopeClassAccessToken = invert(
+  mapScopeClassAccessTokenToCrudAction,
+);
+
+type UiSection =
+  | AdminSections
+  | AuditorSections
+  | CrmSections
+  | SupervisorSections;
+export const mapWtObjectToUiSection: Record<
+  WtApplication,
+  Partial<Record<WtObject, UiSection>>
+> = {
+  // if we don`t need empty objects we can use  Partial<Record<WtApplication, Partial<Record<WtObject, UiSection>>>>
+  [WtApplication.Agent]: {},
+  [WtApplication.History]: {},
+  [WtApplication.Analytics]: {},
+
+  // Admin sections
+  [WtApplication.Admin]: {
+    [WtObject.User]: AdminSections.Users,
+    [WtObject.Agent]: AdminSections.Agents,
+    [WtObject.License]: AdminSections.License,
+    [WtObject.Device]: AdminSections.Devices,
+    [WtObject.Flow]: AdminSections.Flow,
+    [WtObject.Dialplan]: AdminSections.Dialplan,
+    [WtObject.Gateway]: AdminSections.Gateways,
+    [WtObject.Chatplan]: AdminSections.Chatplan,
+    [WtObject.ChatGateway]: AdminSections.ChatGateways,
+    [WtObject.Skill]: AdminSections.Skills,
+    [WtObject.Bucket]: AdminSections.Buckets,
+    [WtObject.Blacklist]: AdminSections.Blacklist,
+    [WtObject.Region]: AdminSections.Regions,
+    [WtObject.Calendar]: AdminSections.Calendars,
+    [WtObject.Communication]: AdminSections.Communications,
+    [WtObject.PauseCause]: AdminSections.PauseCause,
+    [WtObject.Media]: AdminSections.Media,
+    [WtObject.Team]: AdminSections.Teams,
+    [WtObject.Resource]: AdminSections.Resources,
+    [WtObject.ResourceGroup]: AdminSections.ResourceGroups,
+    [WtObject.Queue]: AdminSections.Queues,
+    [WtObject.Storage]: AdminSections.Storage,
+    [WtObject.CognitiveProfile]: AdminSections.CognitiveProfiles,
+    [WtObject.EmailProfile]: AdminSections.EmailProfiles,
+    [WtObject.ImportCsv]: AdminSections.ImportCsv,
+    [WtObject.Trigger]: AdminSections.Triggers,
+    [WtObject.Role]: AdminSections.Roles,
+    [WtObject.Object]: AdminSections.Objects,
+    [WtObject.ChangeLog]: AdminSections.Changelogs,
+    [WtObject.Configuration]: AdminSections.Configuration,
+    [WtObject.GlobalVariable]: AdminSections.GlobalVariables,
+    [WtObject.ShiftTemplate]: AdminSections.ShiftTemplates,
+    [WtObject.PauseTemplate]: AdminSections.PauseTemplates,
+    [WtObject.WorkingCondition]: AdminSections.WorkingConditions,
+    [WtObject.Member]: AdminSections.Members,
+  },
+
+  // Auditor sections
+  [WtApplication.Audit]: {
+    [WtObject.Scorecard]: AuditorSections.Scorecards,
+  },
+
+  // Crm sections
+  [WtApplication.Crm]: {
+    [WtObject.Contact]: CrmSections.Contacts,
+    [WtObject.Cases]: CrmSections.Cases,
+    [WtObject.Slas]: CrmSections.Slas,
+    [WtObject.ServiceCatalog]: CrmSections.ServiceCatalogs,
+    [WtObject.CaseSource]: CrmSections.CaseSources,
+    [WtObject.CloseReasonGroup]: CrmSections.CloseReasonGroups,
+    [WtObject.Priorities]: CrmSections.Priorities,
+    [WtObject.Status]: CrmSections.Statuses,
+    [WtObject.Source]: CrmSections.Sources,
+    [WtObject.ContactGroup]: CrmSections.ContactGroups,
+    [WtObject.CustomLookup]: CrmSections.CustomLookups,
+  },
+
+  // Supervisor sections
+  [WtApplication.Supervisor]: {
+    [WtObject.Queue]: SupervisorSections.Queues,
+    [WtObject.Agent]: SupervisorSections.Agents,
+    [WtObject.Communication]: SupervisorSections.ActiveCalls,
+  },
+};
+
+export const mapUiSectionToWtObject = invert(mapWtObjectToUiSection);
+
+export const AdminSectionsValues = invert(AdminSections);
+export const AuditorSectionsValues = invert(AuditorSections);
+export const CrmSectionsValues = invert(CrmSections);
+export const SupervisorSectionsValues = invert(SupervisorSections);

package/src/modules/Userinfo/v2/scripts/utils.ts

@@ -0,0 +1,123 @@
+import { CrudAction, WtApplication, WtObject } from '../../../../enums';
+import { _wtUiLog as wtlog } from '../../../../scripts/logger';
+import {
+  AdminSectionsValues,
+  AuditorSectionsValues,
+  CrmSectionsValues,
+  mapGlobalActionToCrudAction,
+  mapScopeClassAccessTokenToCrudAction,
+  mapScopeClassToWtObjects,
+  mapUiSectionToWtObject,
+  mapWtObjectToUiSection,
+  SupervisorSectionsValues,
+} from '../mappings/mappings';
+import type {
+  AppVisibilityMap,
+  GlobalAccessApiResponseItem,
+  GlobalAction,
+  GlobalActionAccessMap,
+  ScopeAccessApiResponseItem,
+  ScopeAccessMap,
+  SectionVisibilityMap,
+  UiSection,
+  VisibilityAccess,
+} from '../types/UserAccess.d.ts';
+
+/**
+ * @internal
+ * @description
+ * backend -> frontend
+ * */
+const castGlobalActionToCrudAction = (
+  globalAction: GlobalAction,
+): CrudAction | null => {
+  return mapGlobalActionToCrudAction[globalAction] || null;
+};
+
+export const makeGlobalAccessMap = (
+  rawGlobalAccess: GlobalAccessApiResponseItem[],
+): GlobalActionAccessMap => {
+  return rawGlobalAccess.reduce((map, { id }) => {
+    const key = castGlobalActionToCrudAction(id) || id;
+    return map.set(key, true);
+  }, new Map());
+};
+
+export const makeScopeAccessMap = (
+  rawScope: ScopeAccessApiResponseItem[],
+): ScopeAccessMap => {
+  const map = new Map();
+
+  rawScope.forEach(({ class: scopeClass, access: scopeAccess }) => {
+    const access = scopeAccess.split('').reduce((accessMap, token) => {
+      accessMap.set(mapScopeClassAccessTokenToCrudAction[token], true);
+      return accessMap;
+    }, new Map());
+
+    const scopeClassObjects = mapScopeClassToWtObjects[scopeClass];
+
+    if (!scopeClassObjects) {
+      wtlog.error({ module: 'modules/userinfo' })(
+        'Unknown scope class to convert to WtObject:',
+        scopeClass,
+      );
+      map.set(scopeClass, access);
+    } else {
+      scopeClassObjects.forEach((object) => {
+        map.set(object, access);
+      });
+    }
+  });
+
+  return map;
+};
+
+export const makeAppVisibilityMap = (
+  rawVisibility: VisibilityAccess,
+): AppVisibilityMap => {
+  const map = new Map();
+  Object.entries(rawVisibility).forEach(([app, visibility]) => {
+    map.set(app, visibility._enabled);
+  });
+  return map;
+};
+
+export const makeSectionVisibilityMap = (
+  rawVisibility: VisibilityAccess,
+): SectionVisibilityMap => {
+  const map = new Map();
+
+  Object.values(rawVisibility).forEach((appSectionsVisibility) => {
+    Object.entries(appSectionsVisibility).forEach(([section, visibility]) => {
+      if (section.startsWith('_')) return map; // skip private fields
+      map.set(section, visibility._enabled);
+    });
+  });
+
+  return map;
+};
+
+export const castUiSectionToWtObject = (section: UiSection): WtObject => {
+  return mapUiSectionToWtObject[section];
+};
+
+export const castWtObjectToUiSection = (object: WtObject): UiSection => {
+  return mapWtObjectToUiSection[object];
+};
+
+export const getWtAppByUiSection = (section: UiSection): WtApplication => {
+  /* use inverted maps because UiSection is the enum value, not key */
+  if (AdminSectionsValues[section]) {
+    return WtApplication.Admin;
+  }
+  if (AuditorSectionsValues[section]) {
+    return WtApplication.Audit;
+  }
+  if (CrmSectionsValues[section]) {
+    return WtApplication.Crm;
+  }
+  if (SupervisorSectionsValues[section]) {
+    return WtApplication.Supervisor;
+  }
+  wtlog.error({ module: 'modules/userinfo' })('Unknown section:', section);
+};

package/src/modules/Userinfo/v2/stores/__tests__/accessStore.spec.ts

@@ -0,0 +1,136 @@
+import {createPinia, setActivePinia, type StoreDefinition} from 'pinia';
+import { beforeEach, describe, expect,it } from 'vitest';
+import {createApp, h} from "vue";
+import {createRouter, createWebHistory, type Router} from "vue-router";
+
+import {AdminSections, WtApplication, WtObject} from "../../../../../enums";
+import {CrudGlobalAction} from "../../enums";
+import { createUserAccessStore } from '../accessStore';
+
+describe('AccessStore', () => {
+  let router: Router;
+  let useAccessStore: StoreDefinition;
+
+  beforeEach(async () => {
+    router = createRouter({
+      history: createWebHistory(),
+      routes: [
+        {
+          path: '/',
+          name: 'home',
+          component: () => h('div', 'home'),
+        },
+        {
+          path: '/users',
+          name: 'users',
+          component: () => h('div', 'users'),
+          meta: {
+            WtObject: WtObject.User,
+            UiSection: AdminSections.Users,
+          },
+        },
+      ],
+    });
+
+    const pinia = createPinia();
+    const app = createApp({});
+    app.use(router);
+    app.use(pinia)
+    setActivePinia(pinia);
+    useAccessStore = createUserAccessStore();
+  });
+
+  it('restricts route if no access', async () => {
+    const { initialize, routeAccessGuard } = useAccessStore();
+    router.beforeEach(routeAccessGuard);
+
+    initialize({
+      permissions: [],
+      scope: [],
+      access: {},
+    });
+
+    await router.push({ name: 'users' });
+
+    /* because guard should not allow to navigate
+    there since we pass empty permissions */
+    expect(router.currentRoute.value.name).not.toBe('users');
+  });
+
+  it('allows route access if has global permission', async () => {
+    const { initialize, routeAccessGuard } = useAccessStore();
+    router.beforeEach(routeAccessGuard);
+
+    initialize({
+      permissions: [{ id: CrudGlobalAction.Read }],
+      scope: [],
+      access: {},
+    });
+
+    await router.push({ name: 'users' });
+    expect(router.currentRoute.value.name).toBe('users');
+  });
+
+  it('allows route access if has scope permission, app visibility and section visibility', async () => {
+    const { initialize, routeAccessGuard } = useAccessStore();
+    router.beforeEach(routeAccessGuard);
+
+    initialize({
+      permissions: [],
+      scope: [{ class: 'users', access: 'r' }],
+      access: {
+        [WtApplication.Admin]: {
+          _enabled: true,
+            [AdminSections.Users]: {
+                _enabled: true,
+            },
+        },
+      },
+    });
+
+    await router.push({ name: 'users' });
+    expect(router.currentRoute.value.name).toBe('users');
+  });
+
+  it('restricts route access if has scope permission, app visibility, but no section visibility', async () => {
+    const { initialize, routeAccessGuard } = useAccessStore();
+    router.beforeEach(routeAccessGuard);
+
+    initialize({
+      permissions: [],
+      scope: [{ class: 'users', access: 'r' }],
+      access: {
+        [WtApplication.Admin]: {
+          _enabled: true,
+            [AdminSections.Users]: {
+                _enabled: false,
+            },
+        },
+      },
+    });
+
+    await router.push({ name: 'users' });
+    expect(router.currentRoute.value.name).not.toBe('users');
+  });
+
+  it('restricts route access if has scope permission, section visibility but no app visibility', async () => {
+    const { initialize, routeAccessGuard } = useAccessStore();
+    router.beforeEach(routeAccessGuard);
+
+    initialize({
+      permissions: [],
+      scope: [{ class: 'users', access: 'r' }],
+      access: {
+        [WtApplication.Admin]: {
+          _enabled: false,
+            [AdminSections.Users]: {
+                _enabled: true,
+            },
+        },
+      },
+    });
+
+    await router.push({ name: 'users' });
+    expect(router.currentRoute.value.name).not.toBe('users');
+  });
+});