@tuki-io/tuki-widgets 0.0.63 → 0.0.65

package/projects/tuki/widgets/di2mt/widgets/site-upgrade/site-upgrade-data-table/site-upgrade-data-table.component.ts

@@ -0,0 +1,205 @@
+import { SelectionModel } from "@angular/cdk/collections";
+import { Component, OnInit, OnDestroy, inject, Input, ViewEncapsulation } from "@angular/core";
+import { MatTableDataSource } from "@angular/material/table";
+import { TableColumn } from "../../../shared/types/data-table";
+import { TableFilter } from "../../../shared/types/table/filter";
+import { SiteUpgradeRecord } from "../types/user-upgrade";
+import { UpgradeOverviewService } from "../../upgrade-overview/upgrade-overview.service";
+import { Subject } from "rxjs";
+import { takeUntil } from "rxjs";
+import { SiteUpgradeService } from "../site-upgrade.service";
+import { STATUS_ENTRIES } from "../../../shared/types/constants";
+import { APIService } from "../../../shared/services/api.service";
+
+@Component({
+    selector: 'tk-site-upgrade-data-table',
+    templateUrl: './site-upgrade-data-table.component.html',
+    styleUrls: ['./site-upgrade-data-table.component.scss'],
+    // encapsulation: ViewEncapsulation.ShadowDom
+})
+export class SiteUpgradeDataTableComponent implements OnInit, OnDestroy {
+    readonly siteUpgradeService = inject(SiteUpgradeService);
+    private readonly apiService = inject(APIService);
+    readonly destroy$ = new Subject<void>();
+    readonly STATUS_ENTRIES = STATUS_ENTRIES
+
+    @Input() token!: string;
+    @Input() customerId!: string;
+
+    columns!: TableColumn[];
+    data!: MatTableDataSource<any>;
+    displayedColumns: string[] = ['site', 'ready users', 'upgraded users', 'location mapping', 'pstn trunk', 'site upgrade status'];
+    selection = new SelectionModel<any>(true, []);
+    filters: TableFilter[] = [];
+    private activeFilters: { [key: string]: any } = {};
+
+    statusCounts: any = {};
+
+    constructor() { }
+
+    ngOnInit(): void {
+        this.apiService.token = this.token;
+        this.siteUpgradeService.customerId = this.customerId;
+
+        this.siteUpgradeService.getSiteUpgradeRecords()
+            .pipe(takeUntil(this.destroy$))
+            .subscribe((records: SiteUpgradeRecord[]) => {
+                this.data = new MatTableDataSource<SiteUpgradeRecord>(records);
+                this.setupCustomFilter();
+                this.initializeFilters(records);
+            });
+
+        this.siteUpgradeService.getSiteUpgradeStatusCounts()
+            .pipe(takeUntil(this.destroy$))
+            .subscribe((statusCounts) => {
+                this.statusCounts['Ready'] = statusCounts['READY'] || 0;
+                this.statusCounts['Not Ready'] = statusCounts['NOT_READY'] || 0;
+                this.statusCounts['Completed'] = statusCounts['COMPLETED'] || 0;
+                this.statusCounts['Failed'] = statusCounts['FAILED'] || 0;
+            });
+    }
+
+    private initializeFilters(records: SiteUpgradeRecord[]): void {
+        // Extract unique sites from actual data
+        const uniqueSites = [...new Set(records.map(record => record.siteName))];
+        const siteOptions = uniqueSites.map(site => ({
+            label: site,
+            value: site.toLowerCase().replace(/\s+/g, '-')
+        }));
+
+        // Extract unique statuses from actual data
+        const uniqueStatuses = [...new Set(records.map(record => record.upgradeStatus))];
+        const statusOptions = uniqueStatuses.map(status => ({
+            label: STATUS_ENTRIES[status],
+            value: status.toLowerCase().replace(/\s+/g, '-')
+        }));
+
+        this.filters = [
+            {
+                id: 'sites',
+                type: 'select',
+                columnKey: 'Site',
+                placeholder: 'Sites',
+                options: siteOptions
+            },
+            {
+                id: 'status',
+                type: 'select',
+                columnKey: 'Site Upgrade Status',
+                placeholder: 'Upgrade Status',
+                options: statusOptions
+            }
+        ];
+    }
+
+    onFilter(filterEvent: { key: string, value: any }) {
+        const { key, value } = filterEvent;
+
+        let filterValue: any;
+        if (value && value.value !== undefined) {
+            filterValue = value.value;
+        } else if (value && value.target) {
+            filterValue = value.target.value;
+        } else {
+            filterValue = value;
+        }
+
+        // Handle "All" option or empty values - remove the filter
+        if (filterValue === 'all' || !filterValue || filterValue === '') {
+            delete this.activeFilters[key];
+        } else {
+            this.activeFilters[key] = filterValue;
+        }
+
+        this.applyFilters();
+    }
+
+    private setupCustomFilter() {
+        this.data.filterPredicate = (data: any, filter: string) => {
+            const filters = JSON.parse(filter || '{}');
+
+            for (const [key, value] of Object.entries(filters)) {
+                if (!value) continue;
+
+                switch (key) {
+                    case 'Site':
+                        if (data.siteName !== this.getSiteNameFromValue(value as string)) {
+                            return false;
+                        }
+                        break;
+                    case 'Site Upgrade Status':
+                        if (!this.matchesUpgradeStatus(data.upgradeStatus, value as string)) {
+                            return false;
+                        }
+                        break;
+                }
+            }
+
+            return true;
+        };
+    }
+
+    private applyFilters() {
+        this.data.filter = JSON.stringify(this.activeFilters);
+    }
+
+    private getSiteNameFromValue(value: string): string {
+        // Since we're now using actual site names, just convert back from slug format
+        return value.split('-').map(word =>
+            word.charAt(0).toUpperCase() + word.slice(1)
+        ).join(' ');
+    }
+
+    private matchesUpgradeStatus(status: string, filterValue: string): boolean {
+        // Handle direct status matching for cleaner implementation
+        return status.toLowerCase().replace(/\s+/g, '-') === filterValue.toLowerCase();
+    }
+
+    get filteredDataCount(): number {
+        return this.data?.filteredData?.length || 0;
+    }
+
+    /** Whether the number of selected elements matches the total number of rows. */
+    isAllSelected() {
+        const numSelected = this.selection.selected.length;
+        const numRows = this.data?.data.length || 0;
+        return numSelected === numRows;
+    }
+
+    /** Selects all rows if they are not all selected; otherwise clear selection. */
+    masterToggle() {
+        this.isAllSelected() ?
+            this.selection.clear() :
+            this.data?.data.forEach(row => this.selection.select(row));
+    }
+
+    getLocationMappingClass(locationMapping: boolean): string {
+        return locationMapping ? 'success' : 'error';
+    }
+
+    getSiteUpgradeStatusClass(status: string): string {
+        switch (status.toLowerCase()) {
+            case 'ready':
+                return 'ready';
+            case 'partial ready':
+                return 'partial-ready';
+            case 'completed':
+                return 'completed';
+            case 'failed':
+                return 'failed';
+            case 'not ready':
+                return 'not-ready';
+            default:
+                return 'not-ready';
+        }
+    }
+
+    upgradeSite(site: SiteUpgradeRecord) {
+        this.siteUpgradeService.upgradeSite(site);
+    }
+
+    ngOnDestroy(): void {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+}

package/projects/tuki/widgets/di2mt/widgets/site-upgrade/site-upgrade.module.ts

@@ -0,0 +1,24 @@
+import { NgModule } from "@angular/core";
+import { SiteUpgradeDataTableComponent } from "./site-upgrade-data-table/site-upgrade-data-table.component";
+import { CommonModule } from "@angular/common";
+import { MatTableModule } from "@angular/material/table";
+import { MatIconModule } from "@angular/material/icon";
+import { MatButtonModule } from "@angular/material/button";
+import { SharedModule } from "../../public-api";
+
+@NgModule({
+    declarations: [
+        SiteUpgradeDataTableComponent
+    ],
+    imports: [
+        CommonModule, 
+        SharedModule,
+        MatTableModule,
+        MatIconModule,
+        MatButtonModule
+    ],
+    exports: [
+        SiteUpgradeDataTableComponent
+    ]
+})
+export class SiteUpgradeModule { }

package/projects/tuki/widgets/di2mt/widgets/site-upgrade/site-upgrade.service.ts

@@ -0,0 +1,45 @@
+import { inject, Injectable } from "@angular/core";
+import { map, Observable } from "rxjs";
+import { SiteUpgradeRecord } from "./types/user-upgrade";
+import { API } from "../../api/api.endpoints";
+import { UserUpgradeRecord } from "../user-upgrade/types/user-upgrade";
+import { APIService } from "../../shared/services/api.service";
+
+@Injectable({
+    providedIn: 'root'
+})
+export class SiteUpgradeService {
+    private apiService = inject(APIService);
+    customerId!: string;
+
+    getSiteUpgradeStatusCounts(): Observable<any> {
+        return this.apiService.fetch(
+            API.SITE_UPGRADE.GET_SITES_UPGRADE_STATUS_COUNTS.replace(':customerId', this.customerId)
+        );
+    }
+
+    getSiteUpgradeRecords(): Observable<SiteUpgradeRecord[]> {
+        return this.apiService.fetch(
+            API.SITE_UPGRADE.GET_SITES_UPGRADE_DATA.replace(':customerId', this.customerId)
+        ).pipe(map((resp) => {
+            return resp.content.map((record: any) => ({
+                siteId: record.siteId,
+                siteName: record.siteName,
+                totalUsers: record.totalUsers,
+                totalReadyUsers: record.readyUsers,
+                totalNotReadyUsers: record.notReadyUsers,
+                totalUpgradedUsers: record.totalUpgradedUsers,
+                totalFailedUsers: record.totalFailedToUpgradeUsers,
+                locationMapping: record.locationMappingStatus,
+                PSTNTrunk: record.pstnTrunkStatus,
+                upgradeStatus: record.siteUpgradeStatus
+            } as SiteUpgradeRecord));
+        }));
+    }
+
+    // TODO: Impl the site upgrade logic here
+    upgradeSite(site: SiteUpgradeRecord): void {
+        const customerId = site.customerId;
+        const siteId = site.siteId;
+    }
+}

package/projects/tuki/widgets/di2mt/widgets/site-upgrade/types/user-upgrade.ts

@@ -0,0 +1,15 @@
+import { Status } from "../../../shared/types/constants";
+
+export interface SiteUpgradeRecord {
+    customerId: string;
+    siteId: string;
+    siteName: string;
+    totalUsers: number;
+    totalReadyUsers: number;
+    totalNotReadyUsers: number;
+    totalUpgradedUsers: number;
+    totalFailedUsers: number;
+    locationMapping: boolean;
+    PSTNTrunk: boolean;
+    upgradeStatus: Status;
+};

package/projects/tuki/widgets/di2mt/widgets/upgrade-overview/cards/already-upgraded-sites/already-upgraded-sites-card.component.ts

@@ -0,0 +1,52 @@
+import { Component, Input, OnInit, OnDestroy, inject } from "@angular/core";
+import { UpgradeOverviewService } from "../../upgrade-overview.service";
+import { SitesUpgradeSummary } from "../../types/upgrade-overview";
+import { Subject } from "rxjs";
+import { takeUntil } from "rxjs";
+import { APIService } from "../../../../shared/services/api.service";
+
+@Component({
+    selector: 'tk-already-upgraded-sites-card',
+    template: `
+        <tk-stat-card
+            *ngIf="!loading"
+            [title]="title"
+            [type]="type"
+            [readinessStats]="readinessStats"
+            [upgradeStatus]="upgradeStatus"
+        ></tk-stat-card>
+    `
+})
+export class AlreadyUpgradedSitesCardComponent implements OnInit, OnDestroy {
+    private apiService = inject(APIService);
+    private upgradeOverviewService = inject(UpgradeOverviewService);
+    private destroy$ = new Subject<void>();
+
+    @Input() token!: string;
+    @Input() customerId!: string;
+
+    title: string = 'Upgraded Sites';
+    type: 'site' | 'user' = 'site';
+    readinessStats!: SitesUpgradeSummary;
+    upgradeStatus: any = 'already';
+
+    loading: boolean = false;
+
+    ngOnInit(): void {
+        this.apiService.token = this.token;
+        this.upgradeOverviewService.customerId = this.customerId;
+
+        this.loading = true;
+        this.upgradeOverviewService.getSitesUpgradeSummary()
+            .pipe(takeUntil(this.destroy$))
+            .subscribe((stats) => {
+                this.readinessStats = stats;
+                this.loading = false;
+            });
+    }
+
+    ngOnDestroy(): void {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+}

package/projects/tuki/widgets/di2mt/widgets/upgrade-overview/cards/already-upgraded-users/already-upgraded-users-card.component.ts

@@ -0,0 +1,53 @@
+import { Component, Input, OnInit, OnDestroy, inject } from "@angular/core";
+import { UpgradeOverviewService } from "../../upgrade-overview.service";
+import { UsersUpgradeSummary } from "../../types/upgrade-overview";
+import { Subject } from "rxjs";
+import { takeUntil } from "rxjs";
+import { APIService } from "../../../../shared/services/api.service";
+
+
+@Component({
+    selector: 'tk-already-upgraded-users-card',
+    template: `
+        <tk-stat-card
+            *ngIf="!loading"
+            [title]="title"
+            [type]="type"
+            [readinessStats]="readinessStats"
+            [upgradeStatus]="upgradeStatus"
+        ></tk-stat-card>
+    `
+})
+export class AlreadyUpgradedUsersCardComponent implements OnInit, OnDestroy {
+    private apiService = inject(APIService);
+    private upgradeOverviewService = inject(UpgradeOverviewService);
+    private destroy$ = new Subject<void>();
+
+    @Input() token!: string;
+    @Input() customerId!: string;
+
+    title: string = 'Upgraded Users';
+    type: any = 'user';
+    readinessStats!: UsersUpgradeSummary;
+    upgradeStatus: any = 'already';
+
+    loading: boolean = false;
+
+    ngOnInit(): void {
+        this.apiService.token = this.token;
+        this.upgradeOverviewService.customerId = this.customerId;
+
+        this.loading = true;
+        this.upgradeOverviewService.getUsersUpgradeSummary()
+            .pipe(takeUntil(this.destroy$))
+            .subscribe((stats) => {
+                this.readinessStats = stats;
+                this.loading = false;
+            });
+    }
+
+    ngOnDestroy(): void {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+}

package/projects/tuki/widgets/di2mt/widgets/upgrade-overview/cards/preconditions-status-list/preconditions-status-list-card.component.ts

@@ -0,0 +1,67 @@
+import { Component, inject, Input, OnDestroy, OnInit } from "@angular/core";
+import { UpgradePreconditions } from "../../types/upgrade-overview";
+import { UpgradeOverviewService } from "../../upgrade-overview.service";
+import { Subject, takeUntil } from "rxjs";
+import { APIService } from "../../../../shared/services/api.service";
+
+
+@Component({
+    selector: 'tk-preconditions-status-list-card',
+    template: `
+        <tk-status-list-card 
+            [title]="title"
+            [items]="items"
+        ></tk-status-list-card>
+    `,
+    styles: [` :host { width: 100%; } `]
+})
+export class PreconditionsStatusListCardComponent implements OnInit, OnDestroy {
+    private apiService = inject(APIService);
+    private destroy$ = new Subject<void>();
+    private upgradeOverviewService = inject(UpgradeOverviewService);
+
+    @Input() token!: string;
+    @Input() customerId!: string;
+
+    title: string = 'Preconditions';
+    preconditions!: UpgradePreconditions;
+
+    items: any;
+
+    ngOnInit(): void {
+        this.apiService.token = this.token;
+        this.upgradeOverviewService.customerId = this.customerId;
+        
+        this.upgradeOverviewService.getUpgradePreconditions()
+            .pipe(takeUntil(this.destroy$))
+            .subscribe((resp) => {
+                this.preconditions = resp;
+                this.init();
+            });
+    }
+
+    ngOnDestroy(): void {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+
+    private init(): void {
+        this.items = [
+            {
+                label: 'Control Hub Integration',
+                description: 'Control Hub Connectivity',
+                status: this.preconditions.controlHubIntegration === 'CONNECTED'
+            },
+            {
+                label: 'SIP Trunk (Local Gateway)',
+                description: 'CUCM trunk connectivity estabilished',
+                status: false
+            },
+            {
+                label: `${this.preconditions.numberOfAvailableLicences} Available User Licences`,
+                description: 'Webex calling licences provisioned and assgined',
+                status: this.preconditions.numberOfAvailableLicences > 0
+            }
+        ];
+    }
+}

package/projects/tuki/widgets/di2mt/widgets/upgrade-overview/cards/ready-to-upgrade-sites/ready-to-upgrade-sites-card.component.html

@@ -0,0 +1,7 @@
+  <tk-stat-card
+    *ngIf="!loading"
+    [title]="title"
+    [type]="type"
+    [readinessStats]="readinessStats"
+    [upgradeStatus]="upgradeStatus">
+  </tk-stat-card>

package/projects/tuki/widgets/di2mt/widgets/upgrade-overview/cards/ready-to-upgrade-sites/ready-to-upgrade-sites-card.component.ts

@@ -0,0 +1,45 @@
+import { Component, Input, OnInit, OnDestroy, inject } from "@angular/core";
+import { UpgradeOverviewService } from "../../upgrade-overview.service";
+import { SitesUpgradeReadiness } from "../../types/upgrade-overview";
+import { Subject } from "rxjs";
+import { takeUntil } from "rxjs";
+import { APIService } from "../../../../shared/services/api.service";
+
+@Component({
+    selector: 'tk-ready-to-upgrade-sites-card',
+    templateUrl: './ready-to-upgrade-sites-card.component.html',
+    styleUrls: ['./ready-to-upgrade-sites-card.component.scss']
+})
+export class ReadyToUpgradeSitesCardComponent implements OnInit, OnDestroy {
+    private apiService = inject(APIService);
+    private upgradeOverviewService = inject(UpgradeOverviewService);
+    private destroy$ = new Subject<void>();
+
+    @Input() token!: string;
+    @Input() customerId!: string;
+
+    title: string = 'Ready Sites';
+    type: any = 'site';
+    readinessStats!: SitesUpgradeReadiness;
+    upgradeStatus: any = 'ready';
+
+    loading: boolean = false;
+
+    ngOnInit(): void {
+        this.apiService.token = this.token;
+        this.upgradeOverviewService.customerId = this.customerId;
+        
+        this.loading = true;
+        this.upgradeOverviewService.getSitesUpgradeReadiness()
+            .pipe(takeUntil(this.destroy$))
+            .subscribe((stats) => {
+                this.readinessStats = stats;
+                this.loading = false;
+            });
+    }
+
+    ngOnDestroy(): void {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+}

package/projects/tuki/widgets/di2mt/widgets/upgrade-overview/cards/ready-to-upgrade-users/ready-to-upgrade-users-card.component.html

@@ -0,0 +1,7 @@
+  <tk-stat-card
+    *ngIf="!loading"
+    [title]="title"
+    [type]="type"
+    [readinessStats]="readinessStats"
+    [upgradeStatus]="upgradeStatus">
+  </tk-stat-card>

package/projects/tuki/widgets/di2mt/widgets/upgrade-overview/cards/ready-to-upgrade-users/ready-to-upgrade-users-card.component.ts

@@ -0,0 +1,45 @@
+import { Component, Input, OnInit, OnDestroy, inject } from "@angular/core";
+import { UpgradeOverviewService } from "../../upgrade-overview.service";
+import { UsersUpgradeReadiness } from "../../types/upgrade-overview";
+import { Subject } from "rxjs";
+import { takeUntil } from "rxjs";
+import { APIService } from "../../../../shared/services/api.service";
+
+@Component({
+    selector: 'tk-ready-to-upgrade-users-card',
+    templateUrl: './ready-to-upgrade-users-card.component.html',
+    styleUrls: ['./ready-to-upgrade-users-card.component.scss']
+})
+export class ReadyToUpgradeUsersCardComponent implements OnInit, OnDestroy {
+    private apiService = inject(APIService);
+    private upgradeOverviewService = inject(UpgradeOverviewService);
+    private destroy$ = new Subject<void>();
+
+    @Input() token!: string;
+    @Input() customerId!: string;
+
+    title: string = 'Ready Users';
+    type: any = 'user';
+    readinessStats!: UsersUpgradeReadiness;
+    upgradeStatus: any = 'ready';
+
+    loading: boolean = false;
+
+    ngOnInit(): void {
+        this.apiService.token = this.token;
+        this.upgradeOverviewService.customerId = this.customerId;
+        
+        this.loading = true;
+        this.upgradeOverviewService.getUsersUpgradeReadiness()
+            .pipe(takeUntil(this.destroy$))
+            .subscribe((stats) => {
+                this.readinessStats = stats;
+                this.loading = false;
+            });
+    }
+
+    ngOnDestroy(): void {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+}

package/projects/tuki/widgets/di2mt/widgets/upgrade-overview/cards/site-infrastructure-status-list/site-infrastructure-status-list-card.component.ts

@@ -0,0 +1,59 @@
+import { Component, Input, OnInit, OnDestroy, inject } from "@angular/core";
+import { SiteInfrastructureSummary } from "../../types/upgrade-overview";
+import { UpgradeOverviewService } from "../../upgrade-overview.service";
+import { Subject } from "rxjs";
+import { takeUntil } from "rxjs";
+import { APIService } from "../../../../shared/services/api.service";
+
+@Component({
+    selector: 'tk-site-infrastructure-status-list-card',
+    template: `
+        <tk-status-list-card 
+            [title]="title"
+            [items]="items"
+        ></tk-status-list-card>
+    `,
+    styles: [` :host { width: 100%; } `]
+})
+export class SiteInfrastructureStatusListCardComponent implements OnInit {
+    title: string = 'Site Infrastructure';
+    items: any;
+
+    @Input() token!: string;
+    @Input() customerId!: string;
+
+    private apiService = inject(APIService);
+    private upgradeOverviewService = inject(UpgradeOverviewService);
+    private destroy$ = new Subject<void>();
+
+    ngOnInit(): void {
+        this.apiService.token = this.token;
+        this.upgradeOverviewService.customerId = this.customerId;
+
+        this.upgradeOverviewService.getSiteInfrastructureSummary()
+            .pipe(takeUntil(this.destroy$))
+            .subscribe((siteInfrastructure) => {
+                this.items = [
+                    {
+                        label: 'PSTN Trunk',
+                        description: 'Public network connectivity',
+                        status: false,
+                        totalSites: siteInfrastructure.totalSites,
+                        value: siteInfrastructure.totalPSTNs
+                    },
+                    {
+                        label: 'Location Mapping',
+                        description: 'Sites defined in Control Hub with proper configuration',
+                        status: false,
+                        totalSites: siteInfrastructure.totalSites,
+                        value: siteInfrastructure.totalLocations
+                    }
+                ];
+            });
+    }
+
+    ngOnDestroy(): void {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+}