@tuki-io/tuki-widgets 0.0.8 → 0.0.9

package/user-manage/src/notifications/notification.component.ts

@@ -0,0 +1,46 @@
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core';
+import { Subscription } from 'rxjs';
+import { NotificationService } from '../services/notification.service';
+import { Notification } from '../classes/notification';
+
+@Component({
+  selector: 'app-notification',
+  templateUrl: './notification.component.html',
+  styleUrls: ['./notification.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class NotificationsComponent implements OnInit, OnDestroy {
+  public list!: Notification[];
+  public isReadMore!: boolean;
+  private listSubscription!: Subscription;
+
+  constructor(
+    public notificationService: NotificationService,
+    private ref: ChangeDetectorRef
+  ) {
+  }
+
+  ngOnInit() {
+    this.listChangeSubscribe();
+  }
+
+  ngOnDestroy() {
+    this.listSubscription.unsubscribe();
+  }
+
+  public readMore(): void {
+    this.isReadMore = !this.isReadMore;
+  }
+
+  public removeNotification(notification: Notification): void {
+    this.notificationService.remove(notification);
+  }
+
+  private listChangeSubscribe(): void {
+    this.listSubscription = this.notificationService.listChange
+      .subscribe((list: any) => {
+        this.list = list;
+        this.ref.detectChanges();
+      });
+  }
+}

package/user-manage/src/removeKynFromIBM.service.ts

@@ -0,0 +1,25 @@
+import { Injectable } from '@angular/core';
+import { CUCMS_TO_IGNORE, CUCS_TO_IGNORE } from './app.constants';
+
+@Injectable()
+export class RemoveKynFromIBMService {
+  constructor() {
+  }
+
+
+  removeCUCMS(date: any, customerId: number) {
+    if (customerId === 8) {
+      return date.filter((val: any) => !CUCMS_TO_IGNORE.includes(Math.round(val.cucmId)));
+    }
+    return date;
+  }
+
+  removeCUCS(date: any, customerId: number) {
+    if (customerId === 8) {
+      return date.filter((val: any) => !CUCS_TO_IGNORE.includes(Math.round(val.cucId)));
+    }
+    return date;
+  }
+
+
+}

package/user-manage/src/services/api.service.ts

@@ -0,0 +1,90 @@
+import { Injectable } from '@angular/core';
+import { HttpClient, HttpHeaders } from '@angular/common/http';
+import { TableDataInterface } from '../classes/table-data';
+import { Observable } from 'rxjs';
+
+
+
+@Injectable()
+export class APIService {
+  public token: any;
+  apiUrl = window.location.protocol + '//' + window.location.hostname + '/dcp';
+
+  constructor(
+    private httpClient: HttpClient
+  ) {
+  }
+
+  fetch(url: string, params?: any, cache?: boolean) {
+    const headers = this.getHeaders(cache);
+    params = params || {};
+    return this.httpClient.get(this.apiUrl + url, {params: this.prepareEncodedParams(params), headers});
+  }
+
+  post(url: string, body: any, params = {}): any {
+    body = body || null;
+    const headers = this.getHeaders();
+    return this.httpClient.post(this.apiUrl + url, body, {params: this.prepareEncodedParams(params), headers});
+  }
+
+  // use when response extended data is necessary:
+  postExtended(url: string, body = null, params = {}, headers = {}) {
+    headers = headers || this.getHeaders();
+    return this.httpClient.post(this.apiUrl + url, body, {
+      headers,
+      observe: 'response',
+      params: this.prepareEncodedParams(params)
+    });
+  }
+
+  put(url: string, body = null, params = {}) {
+    const headers = this.getHeaders();
+    return this.httpClient.put(this.apiUrl + url, body, {headers, params: this.prepareEncodedParams(params)});
+  }
+
+  delete(url: string, params = {}) {
+    const headers = this.getHeaders();
+    return this.httpClient.delete(this.apiUrl + url, {headers, params: this.prepareEncodedParams(params)});
+  }
+
+  fetchPagination(url: string, pageSize: number, pageNumber: number, additionalParams = {}, cache?: boolean): Observable<TableDataInterface> {
+    const copyAdditionalParams = JSON.parse(JSON.stringify(additionalParams));
+    const params = Object.assign(copyAdditionalParams, {size: pageSize.toString(), page: pageNumber.toString()});
+    return this.fetch(url, params, cache) as Observable<TableDataInterface>;
+  }
+
+  private prepareEncodedParams(params: any) {
+    const result: any = {};
+
+    if (!params) {
+      return {};
+    }
+    for (const key of Object.keys(params)) {
+      if (params[key]) {
+        const stringParam = params[key].toString();
+        result[key] = stringParam.includes('+') ? encodeURIComponent(stringParam) : stringParam;
+      }
+    }
+    return result;
+  }
+
+  private getHeaders(cache?: boolean): HttpHeaders {
+    let headers = new HttpHeaders();
+    if (cache) {
+      headers = headers.append('_Cache', 'true ');
+    }
+    const token = this.token || this.getParameterByName('token');
+    headers = headers.append('Authorization', 'Bearer '+ token);
+    return headers;
+  }
+
+  private getParameterByName(name: any, url = window.location.href) {
+    name = name.replace(/[\[\]]/g, '\\$&');
+    var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
+      results = regex.exec(url);
+    if (!results) return null;
+    if (!results[2]) return '';
+    return decodeURIComponent(results[2].replace(/\+/g, ' '));
+  }
+
+}

package/user-manage/src/services/notification.service.ts

@@ -0,0 +1,68 @@
+import { Injectable } from '@angular/core';
+import { Notification } from '../classes/notification';
+import { Subject } from 'rxjs';
+const SUCCESS_TIME = 5000;
+const INACTIVE_SESSION_MESSAGE = 'Your session was lost due to inactivity. Please login again';
+const INACTIVE_SESSION = 'SESSION_INACTIVE';
+
+@Injectable()
+export class NotificationService {
+
+  public listChange = new Subject();
+
+  private max = 0;
+  private list: Notification[] = [];
+
+  constructor(
+  ) {
+  }
+
+  error(message: string, ttl?: number): void {
+    this.notify('error', message, ttl);
+  }
+
+  success(message: string, ttl?: number): void {
+    this.notify('success', message, (!ttl) ? SUCCESS_TIME : ttl);
+  }
+
+  warning(message: string, ttl?: number): void {
+    this.notify('warning', message, ttl);
+  }
+
+  info(message: string, ttl?: number): void {
+    this.notify('info', message, ttl);
+  }
+  private notify(type: string, message: string, ttl?: number): void {
+    const found = this.list.find((n: Notification) => n.message === message);
+    if (found) {
+      this.remove(found);
+    }
+    const notification = new Notification({
+      id: ++this.max,
+      type, message, ttl
+    });
+    if (notification.ttl > 0) {
+      notification.timerId = setTimeout(() => this.remove(notification, true), notification.ttl);
+    }
+    this.list.push(notification);
+    this.listChange.next(this.list);
+  }
+
+  remove(notification: Notification, auto?: boolean): void {
+    if (!auto && notification.timerId) {
+      // clear timeout in case of manual remove
+      clearInterval(notification.timerId);
+    }
+    this.list = this.list.filter(n => n.id !== notification.id);
+    this.listChange.next(this.list);
+  }
+
+  private removeInactiveSessionError(): void {
+    if (!this.list || !this.list.length) {
+      return;
+    }
+    this.list = this.list.filter(n => n.message !== INACTIVE_SESSION_MESSAGE && n.message !== INACTIVE_SESSION);
+    this.listChange.next(this.list);
+  }
+
+}

package/user-manage/src/services/removeKynFromIBM.service.ts

@@ -0,0 +1,25 @@
+import { Injectable } from '@angular/core';
+import { CUCMS_TO_IGNORE, CUCS_TO_IGNORE } from '../app.constants';
+
+@Injectable()
+export class RemoveKynFromIBMService {
+  constructor() {
+  }
+
+
+  removeCUCMS(date: any, customerId: number) {
+    if (customerId === 8) {
+      return date.filter((val: any) => !CUCMS_TO_IGNORE.includes(Math.round(val.cucmId)));
+    }
+    return date;
+  }
+
+  removeCUCS(date: any, customerId: number) {
+    if (customerId === 8) {
+      return date.filter((val: any) => !CUCS_TO_IGNORE.includes(Math.round(val.cucId)));
+    }
+    return date;
+  }
+
+
+}

package/user-manage/src/services/site-settings.service.ts

@@ -0,0 +1,35 @@
+import { Injectable, OnInit } from '@angular/core';
+import { APIService } from './api.service';
+import { API } from '../app.constants';
+import { Observable } from 'rxjs';
+import { map } from 'rxjs/operators';
+const urlMap = {
+  locations: API.LOCATION,
+  userLocales: API.USER_LOCALES,
+  userProfiles: API.USER_PROFILES
+}
+
+@Injectable()
+export class SiteSettingsService {
+
+  constructor(
+    private apiService: APIService
+  ) {
+
+  }
+  public getSelectionOptions(siteId: number, token: string): any {
+    if(!siteId) {
+      return;
+    }
+    // @ts-ignore
+    const URL = urlMap[token];
+    return this.apiService.fetch(URL.replace(':siteId', String(siteId)), null, true)
+      // @ts-ignore
+      .pipe(map((options: string[]) => {
+        // @ts-ignore
+        this[token] = options ? options.sort() : [];
+        // @ts-ignore
+        return this[token];
+      }))
+  }
+}

package/user-manage/src/services/user.service.ts

@@ -0,0 +1,120 @@
+import {Injectable, OnInit} from '@angular/core';
+import { Observable, of, forkJoin } from 'rxjs';
+import { SimplifiedUser } from '../classes/simplified-user';
+import { API } from '../app.constants';
+import { APIService } from './api.service';
+import { map } from 'rxjs/operators';
+import { UtilsService } from './utils.service';
+
+@Injectable()
+export class UserService implements OnInit{
+  siteId: number = -1;
+  userId: string = '';
+  userIdExistPending = false;
+  hasExistedUserId = false;
+  user!: SimplifiedUser;
+  originUser!: SimplifiedUser;
+
+  constructor(
+    private apiService: APIService
+  ) {
+
+  }
+
+  ngOnInit(): void {
+    console.log(this.siteId)
+  }
+
+  public fetchUserToken(siteId: number, userId: string): any {
+    if (this.siteId === siteId && this.userId === userId && this.user) {
+      return of(this.user);
+    }
+    this.siteId = siteId;
+    this.userId = userId;
+    return this.apiService.fetch(API.USER_TOKEN.replace(':siteId', String(this.siteId)).replace(':userId', encodeURIComponent(encodeURIComponent(userId))))
+      .pipe(map((result: any) => {
+        this.setSimplifiedUser(Object.values(result)[0]);
+      }))
+    // .pipe(this.handleError(false, true));
+  }
+
+  public updateUserFields(body: any): any {
+    if (!this.userId || !this.siteId || !this.user?.token) {
+      return;
+    }
+    return this.apiService.post(API.UPDATE_USER_FIELDS.replace(':siteId', String(this.siteId)).replace(':token', this.user.token), body)
+      // .pipe(this.handleError(false, true));
+  }
+
+  public fetchUserById(id: string) {
+    this.userIdExistPending = true;
+    return this.apiService.fetch(API.USER_BY_ID.replace(':siteId', String(this.siteId)).replace(':userId', encodeURIComponent(encodeURIComponent(id))))
+      .pipe(map(result => {
+        this.userIdExistPending = false;
+        return result;
+      }));
+  }
+
+  public persistCacheChanges() {
+    const params = {
+      excludeDeviceExtraOptions: true
+    };
+    return this.processUserChangesToCache()
+      .pipe(map((result: any) => {
+        return this.apiService.post(API.PERSIST_USER_CACHE.replace(':siteId', String(this.siteId)).replace(':token', this.user.token), {}, params)
+          .subscribe(() => {
+
+          })
+          // .pipe(map((user) => {
+          //   // this.setUser(user, false, this.user.token);
+          //   this.user.hasModifiedCache = false;
+          // }))
+          // .pipe(this.handleError(true, true));
+      }));
+  }
+
+  public processUserChangesToCache(): any {
+    const calls = [];
+    const body = UtilsService.diff(this.originUser.getSavableData(), this.user.getSavableData(), 'user');
+    if (body) {
+      calls.push(this.updateUserFields(body));
+    }
+    if (!calls?.length) {
+      return of(this.user);
+    }
+
+    return forkJoin(calls)
+      .pipe(map((responses: any) => {
+        // ApiUserResponse
+        this.handleSaveUserResponse(responses);
+      }))
+      // .pipe(this.handleError(false, true));
+
+  }
+
+  public hasUnsavedChanges() {
+    if (this.user && this.originUser) {
+      return !this.user.equal(this.originUser);
+    }
+    return false;
+  }
+
+  public setSimplifiedUser(user: any): void {
+    this.user = new SimplifiedUser(user);
+    const copiedUser = JSON.parse(JSON.stringify(user));
+    this.originUser = new SimplifiedUser(copiedUser);
+  }
+
+  private handleSaveUserResponse(responses: any) {
+    if (!responses?.length) {
+      return;
+    }
+    for (let len = responses.length, i = len - 1; i >= 0; i--) {
+      if (responses[i] && responses[i].currentUpdatedUser) {
+        // this.setUser(responses[i].currentUpdatedUser, false, this.user.token);
+        this.user.hasModifiedCache = true;
+        return;
+      }
+    }
+  }
+}

package/user-manage/src/services/users-search.service.ts

@@ -0,0 +1,58 @@
+import { Injectable, OnInit } from '@angular/core';
+import { SimplifiedUser } from '../classes/simplified-user';
+import { APIService } from './api.service';
+import { ListUser, ListUserInterface } from '../classes/user-list';
+import { BehaviorSubject, Observable } from 'rxjs';
+import { API, PAGINATION_DEFAULTS, PAGINATION_SIZE_OPTIONS } from '../app.constants';
+import { TableDataInterface } from '../classes/table-data';
+import { map } from 'rxjs/operators';
+import { RemoveKynFromIBMService } from '../removeKynFromIBM.service';
+import { PaginationDataDto } from '../classes/pagination';
+
+
+
+@Injectable()
+export class UsersSearchService  {
+  siteId: number = -1;
+  userId: string = '';
+  customerId!: number;
+  userIdExistPending = false;
+  hasExistedUserId = false;
+  pageSize = PAGINATION_DEFAULTS.SIZE;
+  pageIndex = PAGINATION_DEFAULTS.SIZE;
+  pageSizeOptions = PAGINATION_SIZE_OPTIONS;
+  total!: number;
+  searchParams!: any;
+  foundUsers$!: any;
+
+  constructor(
+    private apiService: APIService,
+    private removeKynFromIBMService: RemoveKynFromIBMService
+  ) {
+    this.foundUsers$ = new BehaviorSubject(null);
+
+  }
+
+  public getPagination(): PaginationDataDto {
+    return {
+      total: this.total,
+      pageSizeOptions: this.pageSizeOptions,
+      pageSize: this.pageSize,
+      pageIndex: this.pageIndex
+    };
+  }
+
+  public quickRegularUsersSearch() {
+    this.searchParams = this.searchParams || {customerid: this.customerId};
+    return this.apiService.fetchPagination(API.QUICK_USERS_SEARCH, this.pageSize, this.pageIndex, this.searchParams)
+      .pipe(map((res: TableDataInterface) => {
+        this.total = res.total;
+        // this.totals = this.totals || {};
+        // this.totals['users'] = res.total;
+        const users = res.pageData && res.pageData.length ? res.pageData.map(user => new ListUser(user)) : [];
+        // this.foundUsers$.next(this.removeKynFromIBMService.removeCUCMS(users, this.customerId));
+        this.foundUsers$.next(users);
+      }));
+      // .pipe(this.handleError(true));
+  }
+}

package/user-manage/src/services/utils.service.ts

@@ -0,0 +1,71 @@
+import { Injectable } from '@angular/core';
+
+@Injectable()
+export class UtilsService {
+
+  static sortSortArrayByProperty(array: [], sortBy: string) {
+    if (!array) {
+      return null;
+    }
+    return array.sort((a, b) => {
+      if (!a[sortBy] && !b[sortBy]) {
+        return 0;
+      }
+      if (a[sortBy] && !b[sortBy]) {
+        return 1;
+      }
+      if (!a[sortBy] && b[sortBy]) {
+        return -1;
+      }
+      const positionA = a[sortBy];
+      const positionB = b[sortBy];
+      return (positionA < positionB) ? -1 : (positionA > positionB) ? 1 : 0;
+    });
+  }
+
+  static diff(origObject: any, updatedObj: any, path: string, keysToIgnore?: string[]) {
+    let result: any = [];
+    if (Object.is(origObject, updatedObj)) {
+      return undefined;
+    }
+    if (!updatedObj || typeof updatedObj !== 'object') {
+      return updatedObj;
+    }
+    const concat = Array.from(new Set([...Object.keys(origObject || {}), ...Object.keys(updatedObj || {})]));
+    const filter = keysToIgnore ? concat.filter(key => !keysToIgnore.includes(key)) : concat;
+    filter
+      .forEach(key => {
+        if (typeof updatedObj[key] === 'object' && typeof origObject[key] === 'object') {
+          if (UtilsService.differs(updatedObj[key], origObject[key])) {
+            const newPath = `${path}${path ? '.' : ''}${key}`;
+            const values = UtilsService.diff(origObject[key], updatedObj[key], newPath, keysToIgnore);
+            if (values !== undefined) {
+              result = [...result, ...values];
+            }
+          }
+        } else if (updatedObj && !origObject || updatedObj[key] !== origObject[key] && !Object.is(origObject[key], updatedObj[key])) {
+          const value = updatedObj ? UtilsService.formatIfEmpty(updatedObj[key]) : null;
+          result.push(`${path}${path ? '.' : ''}${key}=${value}`);
+        }
+      });
+    return result;
+  }
+
+  static formatIfEmpty(value: any) {
+    if (value) {
+      return value;
+    }
+    switch (typeof value) {
+      case 'boolean':
+        return value;
+      case 'string':
+        return '';
+      default:
+        return null;
+    }
+  }
+
+  static differs(obj1: any, obj2: any): boolean {
+    return JSON.stringify(obj1) !== JSON.stringify(obj2);
+  }
+}

package/user-manage/src/styles/_variables.scss

@@ -0,0 +1,90 @@
+//@import url( 'https://fonts.googleapis.com/css?family=Roboto:400,700|Material+Icons');
+//@import url('https://fonts.googleapis.com/css?family=Raleway:400,100,200,300,500,600,800,700,900');
+@import url('https://fonts.googleapis.com/css?family=Poppins:400,100,200,300,500,600,800,700,900');
+//@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap');
+
+$fa-font-path : '../../node_modules/font-awesome/fonts';
+
+//$common-font: Raleway, 'Raleway', sans-serif;
+//$special-font: Raleway, 'Roboto', sans-serif;
+//$content-font: 'Roboto', sans-serif;
+//$buttons-font: Raleway, 'Raleway', sans-serif;
+//$input-font: 'Roboto', sans-serif;
+$menu-font: Poppins, 'Poppins', sans-serif;
+$main-font: Poppins, 'Poppins', sans-serif;
+//$sub-menu-font: Inter, 'Inter', sans-serif;
+$font-size: 14px;
+$txt-color: rgba(0, 0, 0, 0.87);
+$table-title-color: rgba(0,0,0,.54);;
+$txt-grey-color: #454e5e;
+$header-gradient: linear-gradient(90deg,#0d56aa,#0d56ab);
+$poppins-font: Poppins, 'Poppins', sans-serif;
+
+$icon-color: #8E9FB7;
+$active-color: #0D56AA;
+$icon-box-color: #0773BC;
+$mark-color: #009FDB;
+$hover-color: #0985A0;
+$error-color: #C73636;
+$main-txt-color: #333;
+
+$table-border-color: rgba(0, 0, 0, 0.12);
+$input-border-color: rgba(0, 0, 0, 0.30);
+$bg-color: #F7F9FB;
+
+$error-bg-color: #f2dede;
+$error-border-color: #ebccd1;
+$error-txt-color: #bc1e1b;
+$qob-error-color: #E70707;
+
+$warning-bg-color: #fcf8e3;
+$warning-border-color: #e5e1cd;
+$warning-txt-color: #8a6d3b;
+
+$success-bg-color: #e3f4dc;
+$success-border-color: #b3d692;
+$success-txt-color: #3c763d;
+
+$read-only-txt-color: rgba(0, 0, 0, 0.38);
+$my-menu-txt-color: #555555;
+
+$page-background-color: #F3F6F6;
+$disabled-button-text-color: #BABCC5;
+$dark-elements-color: #2C355D;
+$dark-disabled-btn-color: #DFE3E7;
+$disabled-color: #DFE3E7;
+$link-color: #0985A0;
+$title-color: #0985A0;
+$active-link-color: #0985A0;
+$text-color: #646464;
+$light-border-color: #DEE5EA;
+$icon-background: #D2E5E5;
+
+// QOB style
+$navy: #2399DA;
+$dark-blue: #2C355D;
+$qob-danger-color: #E70707;
+$qob-disabled-color: #D4D4D4;
+
+// WEBEX STYLE
+
+$webex-body-bg: #f7f7f7;
+
+
+$webex-icon-bg: #d0d0d0;
+$webex-icon-color: #2a2a2a;
+$webex-text-color: #252525;
+
+$webex-tr-hover-bg: #ededed;
+$webex-tr-border: #dedede;
+
+$webex-table-th-bg: #f7f7f7;
+$webex-table-th-txt: #636363;
+$webex-table-th-size: 12px;
+
+$webex-table-td-bg: #fff;
+$webex-table-td-txt: #636363;
+$webex-table-td-size: 14px;
+
+$webex-pagination-txt: #636363;
+$webex-pagination-hover-bg: #ededed;