@tuki-io/tuki-widgets 0.0.26 → 0.0.28

package/projects/tuki/widgets/users-list/src/services/user.service.ts

@@ -0,0 +1,168 @@
+import {Injectable, OnInit} from '@angular/core';
+import { Observable, of, forkJoin } from 'rxjs';
+import { SimplifiedUser } from '../classes/simlified-user';
+import { API } from '../app.constants';
+import { APIService } from './api.service';
+import { map } from 'rxjs/operators';
+import { UtilsService } from '../utils/utils.service';
+import { ListUser } from '../classes/user-list';
+import { ApiWebexService } from './api-webex.service';
+
+@Injectable()
+export class UserService implements OnInit{
+  siteId: number = -1;
+  userId: string = '';
+  userIdExistPending = false;
+  hasExistedUserId = false;
+  user!: SimplifiedUser;
+  originUser!: SimplifiedUser;
+
+  constructor(
+    private apiService: APIService,
+    private apiWebexService: ApiWebexService
+  ) {
+
+  }
+
+  ngOnInit(): void {
+    console.log(this.siteId)
+  }
+
+  public fetchUserToken(siteId: number, userId: string): any {
+    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) => {
+        const token = Object.keys(result)[0];
+        this.setSimplifiedUser(Object.values(result)[0], token);
+      }))
+    // .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 moveUser(customerId: any, user: ListUser): any {
+    // return new Observable<boolean>(observer => {
+    //   setTimeout(() => {
+    //     observer.next(true);
+    //
+    //   }, 80000);
+    // });
+    return this.apiWebexService.post(API.MOVE_USER, this.getMoveUserBody(customerId, user))
+    // .pipe(this.handleError(true, true));
+  }
+
+  public moveUserToMT(customerId: any, user: ListUser): any {
+    // return new Observable<boolean>(observer => {
+    //   setTimeout(() => {
+    //     observer.next(true);
+    //
+    //   }, 80000);
+    // });
+    return this.apiWebexService.post(API.MOVE_USER, this.getMoveUserBody(customerId, user))
+    // .pipe(this.handleError(true, true));
+  }
+
+  public moveUserToDI(customerId: any, user: ListUser): any {
+    // return new Observable<boolean>(observer => {
+    //   setTimeout(() => {
+    //     observer.next(true);
+    //
+    //   }, 80000);
+    // });
+    const URL = API.REVERT_WEBEX_USER.replace(':customerId', customerId).replace(':webexUUID', String(user.webexUUID));
+    return this.apiWebexService.post(URL, this.getMoveUserBody(customerId, user))
+    // .pipe(this.handleError(true, true));
+  }
+
+  private getMoveUserBody(customerId: any, user: ListUser): any {
+    return {
+      customerId: customerId,
+      entities: {
+        PERSON: [{cucmId: user.cucmId, entityId: user.userid}]
+      }
+    };
+  }
+
+  public deleteUser(siteId: number, userId: string): Observable<any> {
+    return this.apiService.delete(API.DELETE_USER.replace(':siteId', String(siteId)).replace(':userId', encodeURIComponent(encodeURIComponent(userId))))
+      // .pipe(this.handleError(true, 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() {
+    return !this.user.equal(this.originUser);
+  }
+
+  public setSimplifiedUser(user: any, token?: any): void {
+    this.user = new SimplifiedUser(user);
+    const copiedUser = JSON.parse(JSON.stringify(user));
+    this.originUser = new SimplifiedUser(copiedUser);
+    this.user.token = this.user.token || token;
+    this.originUser.token = this.originUser.token || token;
+  }
+
+  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/projects/tuki/widgets/users-list/src/services/users-search.service.ts

@@ -0,0 +1,135 @@
+import { Injectable, OnInit } from '@angular/core';
+import { SimplifiedUser } from '../classes/simlified-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';
+import { ApiWebexService } from './api-webex.service';
+
+
+
+@Injectable()
+export class UsersSearchService  {
+  siteId: number = -1;
+  userId: string = '';
+  customerId!: number;
+  siteid!: number;
+  userIdExistPending = false;
+  hasExistedUserId = false;
+  pageSize = PAGINATION_DEFAULTS.SIZE;
+  pageIndex = PAGINATION_DEFAULTS.SIZE;
+  pageSizeOptions = PAGINATION_SIZE_OPTIONS;
+  migratedUsersIds!: any;
+  total!: number;
+  migratedUsers!: any;
+  searchParams!: any;
+  foundUsers$!: any;
+
+  constructor(
+    private apiService: APIService,
+    private webexApiService: ApiWebexService,
+    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 setDefaultValues() {
+    this.total = 0;
+    this.pageSize = PAGINATION_DEFAULTS.SIZE;
+    this.pageIndex = PAGINATION_DEFAULTS.INDEX;
+    this.pageSizeOptions = PAGINATION_SIZE_OPTIONS;
+  }
+  public quickRegularUsersSearch(searchParams?: any, isMigratedUsersOnly?: boolean, pageSize?: number): any {
+    console.log('searchParams = ', searchParams);
+    this.searchParams = searchParams || {customerid: this.customerId, siteid: this.siteId};
+    return this.apiService.fetchPagination(API.QUICK_USERS_SEARCH, this.pageSize, pageSize ||this.pageIndex, this.searchParams)
+      .pipe(map((res: TableDataInterface) => {
+        // this.totals = this.totals || {};
+        // this.totals['users'] = res.total;
+
+        // this.foundUsers$.next(this.removeKynFromIBMService.removeCUCMS(users, this.customerId));
+        if (!isMigratedUsersOnly) {
+          const users = res.pageData && res.pageData.length ? res.pageData
+            .map(user => new ListUser(user, 'Dedicated Instance Calling user')) : [];
+          if (this.migratedUsersIds?.length) {
+            this.setMigratedPropToUsers(users);
+          }
+          this.total = res.total;
+          this.foundUsers$.next(users);
+        } else {
+          this.migratedUsersIds = res.pageData && res.pageData.length ? res.pageData
+            .map(user => user.userid) : [];
+        }
+      }));
+      // .pipe(this.handleError(true));
+  }
+
+  public quickWebexUsersSearch(searchParams?: any, isMigratedUsersOnly?: boolean, pageSize?: number): any {
+    this.searchParams = searchParams || {customerid: this.customerId, siteid: this.siteId};
+    return this.webexApiService.fetchPagination(API.QUICK_USERS_SEARCH, this.pageSize, pageSize ||this.pageIndex, this.searchParams)
+      .pipe(map((res: TableDataInterface) => {
+        if (!isMigratedUsersOnly) {
+          const users = res.pageData && res.pageData.length ? res.pageData
+            .map(user => new ListUser(user, 'Dedicated Instance Calling user')) : [];
+          if (this.migratedUsersIds?.length) {
+            this.setMigratedPropToUsers(users);
+          }
+          this.total = res.total;
+          this.foundUsers$.next(users);
+        } else {
+          this.migratedUsersIds = res.pageData && res.pageData.length ? res.pageData
+            .map(user => user.userid) : [];
+        }
+      }));
+    // .pipe(this.handleError(true));
+  }
+
+  getMigratedUsers(customerId: number): any {
+    return this.webexApiService.fetch(API.WEBEX_USERS.replace(':customerId', String(customerId)), {})
+      .pipe(map((result: any) => {
+        if (result && result.length) {
+          this.migratedUsers = result.filter((user: any) => user.webexUUID && user.devices && user.devices.length);
+        }
+      }))
+  }
+
+  getMigratedWebexUsers(customerId: number): any {
+    const params = {customerid: customerId, type: 'PERSON'};
+    return this.webexApiService.fetch(API.MIGRATED_USERS.replace(':customerId', String(customerId)), params, true)
+      .pipe(map((result: any) => {
+      }))
+  }
+
+  setMigratedPropToUsers(users: any): void {
+    users.forEach((user: any) => {
+      const migratedUser = this.migratedUsers.filter((migratedUser: any) => migratedUser.userid === user.email);
+      if (migratedUser && migratedUser[0]) {
+        user.roleName = '';
+        user.isMigrated = true;
+        user.status = 'Migrated';
+        user.webexUUID = migratedUser[0].webexUUID;
+      } else {
+        user.roleName = 'Dedicated Instance Calling user';
+        user.isMigrated = false;
+        user.status = 'Active';
+        user.webexUUID = '';
+      }
+    })
+    console.log('users ttt', users);
+  }
+
+}

package/projects/tuki/widgets/users-list/src/user-list-confirm-dialog/user-list-confirm-dialog.component.html

@@ -0,0 +1,14 @@
+<div id="info-dialog" class="app-dialog" aria-labelledby="info-dialog-label" role="dialog">
+  <h3 *ngIf="title" class="app-dialog-title">{{title}}</h3>
+  <div mat-dialog-content *ngIf="message" class="app-dialog-content">
+    <div [innerHTML]="message"></div>
+  </div>
+  <div mat-dialog-actions class="flex-gap-container">
+    <button class="app-dialog-button app-dialog-cancel-button" (click)="onClose(false)">
+      Cancel
+    </button>
+    <button class="app-dialog-button app-dialog-confirm-button" (click)="onClose(true)">
+      {{confirmButtonText}}
+    </button>
+  </div>
+</div>

package/projects/tuki/widgets/users-list/src/user-list-confirm-dialog/user-list-confirm-dialog.component.scss

@@ -0,0 +1,79 @@
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');
+$main-webex-font: Inter, 'Inter', sans-serif;
+
+#info-dialog {
+  min-height: 150px;
+  width: 400px;
+  box-sizing: border-box;
+  position: relative;
+
+
+  .fa  {
+    font-size: 35px;
+    margin: 0 auto 20px;
+    display: block;
+    text-align: center;
+    color: #009fdb;
+    cursor: default;
+
+    /*&:hover {
+      color: darken(#009fdb, 3%);
+    }*/
+  }
+
+
+
+  /*button {
+    width: calc(1/2*100% - (1 - 1/2)*10px);
+  }*/
+}
+.scroll-content {
+  overflow-y: auto;
+  margin: auto;
+  max-height: 150px;
+  width: 100%;
+}
+.app-dialog {
+  font-family: $main-webex-font;
+
+  .app-dialog-title {
+    text-align: center;
+    font-weight: 600;
+    font-size: 16px;
+    font-family: $main-webex-font;
+    margin: 0 0 24px 0;
+  }
+  .flex-gap-container {
+    gap: 16px;
+    position: absolute;
+    right: 0;
+    bottom: 0;
+    gap: 15px;
+    display: flex;
+  
+  }
+  .app-dialog-content {
+    color: rgba(0, 0, 0, 0.70);
+    font-size: 14px;
+  }
+}
+.app-dialog-button {
+  height: 32px;
+  padding: 10px 12px;
+  text-align: center;
+  border-radius: 50px;
+  box-shadow: none;
+  line-height: 11px;
+  border: none;
+  font-size: 14px;
+  font-family: $main-webex-font;
+  cursor: pointer;
+}
+.app-dialog-cancel-button {
+  border: 1px solid rgba(0, 0, 0, 0.50);
+  color: black;
+}
+.app-dialog-confirm-button {
+  background: #F23933;
+  color: white;
+}

package/projects/tuki/widgets/users-list/src/user-list-confirm-dialog/user-list-confirm-dialog.component.ts

@@ -0,0 +1,35 @@
+import { Component, Inject, OnInit, ViewEncapsulation } from '@angular/core';
+import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
+
+@Component({
+  selector: 'app-info-dialog',
+  templateUrl: './user-list-confirm-dialog.component.html',
+  styleUrls: ['./user-list-confirm-dialog.component.scss'],
+  encapsulation: ViewEncapsulation.None
+})
+export class UserListConfirmDialogComponent implements OnInit {
+  public confirmButtonText = 'OK';
+  public message = '';
+  public title = '';
+
+  constructor(
+    public dialogRef: MatDialogRef<any>,
+    @Inject(MAT_DIALOG_DATA) public data: InfoDialogConfig
+  ) { }
+
+  ngOnInit(): void {
+    this.confirmButtonText = this.data.confirmButtonText || '';
+    this.message = this.data.message || '';
+    this.title = this.data.title || '';
+  }
+
+  public onClose(val: boolean): void {
+    this.dialogRef.close(val);
+  }
+}
+
+export class InfoDialogConfig {
+  message!: string;
+  title!: string;
+  confirmButtonText!: string;
+}

package/projects/tuki/widgets/users-list/src/users-list.component.css

@@ -0,0 +1,4 @@
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}/*# sourceMappingURL=users-list.component.css.map */

package/projects/tuki/widgets/users-list/src/users-list.component.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["users-list.component.scss","users-list.component.css"],"names":[],"mappings":"AAAA;EACE,yBAAA;EACA,iBAAA;ACCF","file":"users-list.component.css"}

package/projects/tuki/widgets/users-list/src/users-list.component.html

@@ -0,0 +1,86 @@
+<app-loader *ngIf="dataPending"></app-loader>
+<div *ngIf="!showMoveUserWizard" id="users-list">
+  <app-pagination
+    [pagination]="usersSearchService.getPagination()"
+    [showPageSizeOptions]="true"
+    (pageNumberChangeEmitter)="pageNumberChangeEvent($event)"
+    (pageEmitter)="pageEvent($event)">
+  </app-pagination>
+new users list 2
+  <table class="webex-table" mat-table *ngIf="users?.length" #table [dataSource]="dataSource">
+
+    <ng-container matColumnDef="user-icon">
+      <th mat-header-cell *matHeaderCellDef class="webex-table-th"></th>
+      <td class="user-site" mat-cell *matCellDef="let user"
+          [ngClass]="{'disabled-user-row': moveUserPending && moveInProgressUserId && moveInProgressUserId === user?.userid}"
+          (click)="onUserClick(user)">
+        <span class="icon-webex-box"><span class="icon-webex icon-webex-user"></span></span>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="name">
+      <th mat-header-cell *matHeaderCellDef class="webex-table-th">First / Last Name</th>
+      <td class="user-site" mat-cell *matCellDef="let user"
+          [ngClass]="{'disabled-user-row': moveUserPending && moveInProgressUserId && moveInProgressUserId === user?.userid}"
+          (click)="onUserClick(user)"> {{ user.firstName }} {{ user.lastName }}
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="email">
+      <th mat-header-cell *matHeaderCellDef class="webex-table-th">Email</th>
+      <td class="user-site" [ngClass]="{'disabled-user-row': moveUserPending && moveInProgressUserId && moveInProgressUserId === user?.userid}"
+          mat-cell *matCellDef="let user" (click)="onUserClick(user)">
+        {{ user.email }}
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="status">
+      <th mat-header-cell *matHeaderCellDef class="webex-table-th">Status</th>
+      <td class="user-site" mat-cell *matCellDef="let user"
+          [ngClass]="{'disabled-user-row': moveUserPending && moveInProgressUserId && moveInProgressUserId === user?.userid}"
+          (click)="onUserClick(user)">
+        <span class="icon-user-status icon-user-status-active"></span>{{user.status}}
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="actions">
+      <th mat-header-cell *matHeaderCellDef class="webex-table-th"></th>
+      <td class="user-site" mat-cell *matCellDef="let user, let i = index"
+          [ngClass]="{'disabled-user-row': moveUserPending && moveInProgressUserId && moveInProgressUserId === user?.userid}">
+        <mat-progress-spinner class="field-spinner"
+                              [diameter]="20"
+                              mode="indeterminate"
+                              *ngIf="user.status === 'In Progress'"></mat-progress-spinner>
+        <button *ngIf="!(moveUserPending && moveInProgressUserId && moveInProgressUserId === user?.userid)"
+                class="button-action-dot" mat-icon-button [matMenuTriggerFor]="menu">
+          <div class="icon-actions-dots">
+            <span class="icon-dot">.</span>
+            <span class="icon-dot">.</span>
+            <span class="icon-dot">.</span>
+          </div>
+        </button>
+        <mat-menu #menu="matMenu">
+          <button mat-menu-item [disabled]="true">Resend Invitation</button>
+          <button mat-menu-item [disabled]="true">Reset Password</button>
+          <button *ngIf="!user.isMigrated" mat-menu-item (click)="onMoveUser(user, i, 'QuickMove')">Quick Move User</button>
+          <button *ngIf="!user.isMigrated" mat-menu-item (click)="onMoveUser(user, i, 'MT')">Move User to MT</button>
+          <button *ngIf="user.isMigrated" mat-menu-item (click)="onMoveUser(user, i, 'DI')">Move User to DI</button>
+          <button mat-menu-item [disabled]="true">Deactivate User</button>
+          <button mat-menu-item [disabled]="true">Delete User</button>
+        </mat-menu>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="role">
+      <th mat-header-cell *matHeaderCellDef class="webex-table-th">Administrator Role</th>
+      <td class="user-site" mat-cell *matCellDef="let user" (click)="onUserClick(user)">{{ user.roleName || '' }}</td>
+    </ng-container>
+
+    <tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
+    <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
+  </table>
+</div>
+
+<app-move-user-wizard *ngIf="showMoveUserWizard" [user]="moveUser"
+                      [customerId]="customerId" (runMoveUser)="runMoveUserToMT()"
+                      (closeMoveUserWizard)="closeMoveUserWizard()"></app-move-user-wizard>