@tuki-io/tuki-widgets 0.0.134 → 0.0.136

package/projects/tuki/widgets/contact-center/cc-readiness/cc-readiness.module.ts

@@ -1,44 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { HttpClientModule } from '@angular/common/http';
-import { LicencesRequirementComponent } from './widgets/licences-requirement/licences-requirement.component';
-import { SummaryGridComponent } from './widgets/summary-grid/summary-grid.component';
-import { CardComponent } from './components/card/card.component';
-import { NgApexchartsModule } from 'ng-apexcharts';
-import { MaterialModule } from '../shared/material.module';
-import { SharedModule } from '../shared/shared.module';
-import { MatButtonModule } from '@angular/material/button';
-import { MatCheckboxModule } from '@angular/material/checkbox';
-import { MatOptionModule } from '@angular/material/core';
-import { MatPaginatorModule } from '@angular/material/paginator';
-import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-import { MatSelectModule } from '@angular/material/select';
-import { MatTableModule } from '@angular/material/table';
-
-
-
-@NgModule({
-  declarations: [
-    LicencesRequirementComponent,
-    SummaryGridComponent,
-    CardComponent
-  ],
-  imports: [
-    CommonModule,
-    HttpClientModule,
-    NgApexchartsModule,
-    MatTableModule,
-    MatButtonModule,
-    MatCheckboxModule,
-    MatSelectModule,
-    MatProgressSpinnerModule,
-    MatOptionModule,
-    MatPaginatorModule,
-    MatSelectModule
-  ],
-  exports: [
-    LicencesRequirementComponent,
-    SummaryGridComponent
-  ]
-})
-export class CcReadinessModule { }

package/projects/tuki/widgets/contact-center/cc-readiness/cc-readiness.service.spec.ts

@@ -1,16 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-
-import { CcReadinessService } from './cc-readiness.service';
-
-describe('CcReadinessService', () => {
-  let service: CcReadinessService;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({});
-    service = TestBed.inject(CcReadinessService);
-  });
-
-  it('should be created', () => {
-    expect(service).toBeTruthy();
-  });
-});

package/projects/tuki/widgets/contact-center/cc-readiness/cc-readiness.service.ts

@@ -1,33 +0,0 @@
-import { inject, Inject, Injectable } from '@angular/core';
-import { APIService } from '../shared/api.service';
-import { UccxServerEntityStats, WebexLicenseUsageSummary } from './types/cc-readiness';
-import { API } from '../shared/api.endpoints';
-import { catchError, map, Observable, throwError } from 'rxjs';
-
-@Injectable({
-  providedIn: 'root'
-})
-export class CcReadinessService {
-  private readonly api = inject(APIService);
-
-  constructor() { }
-
-  fetchUccxServerEntityStats(customerId: number): Observable<UccxServerEntityStats[]> {
-    return this.api.fetch(API.READINESS.UCCX_SERVER_ENTITY_STATS(customerId))
-      .pipe(map((stats: UccxServerEntityStats[]) => {
-        stats.forEach(stat => {
-          // @ts-ignore
-          delete stat.counts.reasonCodes;
-        });
-        return stats;
-      }));
-  }
-
-  fetchWebexLicenseUsageSummary(customerId: number): Observable<WebexLicenseUsageSummary[]> {
-    return this.api.fetch(API.READINESS.LICENSE_USAGE_SUMMARY(customerId));
-  }
-
-  setToken(token: string): void {
-    this.api.token = token;
-  }
-}

package/projects/tuki/widgets/contact-center/cc-readiness/components/card/card.component.html

@@ -1,11 +0,0 @@
-<article class="card">
-    <header class="card__header">
-        <h2>{{ title }}</h2>
-        <!--<div class="card__menu-button">
-            <img width="18" src="assets/icons/menu_icon.png" alt="Menu Icon">
-        </div>-->
-    </header>
-    <div class="card__content">
-        <ng-content select="card-content"></ng-content>
-    </div>
-</article>

package/projects/tuki/widgets/contact-center/cc-readiness/components/card/card.component.scss

@@ -1,48 +0,0 @@
-@import "../../../shared/styles/variables.scss";
-
-:host {
-  display: block;
-  height: 100%;
-  box-sizing: border-box;
-}
-
-.card {
-  font-family: $main-font;
-  background-color: white;
-  border-radius: 1rem;
-  padding: 2rem;
-  border: 1px solid hsl(0, 0%, 0%, 0.2);
-  min-width: 300px;
-  // width: fit-content;
-  max-width: 100%;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  box-sizing: border-box;
-  gap: 2.5rem;
-}
-
-.card__header {
-  position: relative;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-
-  h2 {
-    font-size: 16px;
-    margin: 0;
-  }
-
-  .card__menu-button {
-    position: relative;
-    display: flex;
-    align-items: center;
-  }
-}
-
-.card__content {
-  display: flex;
-  flex-direction: column;
-  gap: 2.5rem;
-  flex-grow: 1;
-}

package/projects/tuki/widgets/contact-center/cc-readiness/components/card/card.component.ts

@@ -1,10 +0,0 @@
-import { Component, Input } from "@angular/core";
-
-@Component({
-    selector: 'tk-card',
-    templateUrl: './card.component.html',
-    styleUrls: ['./card.component.scss']
-})
-export class CardComponent {
-    @Input() title!: string;
-}

package/projects/tuki/widgets/contact-center/cc-readiness/types/cc-readiness.ts

@@ -1,34 +0,0 @@
-export type EntityType =
-    | 'applications'
-    | 'triggers'
-    | 'contactServiceQueues'
-    | 'resources'
-    | 'resourceGroups'
-    | 'skills'
-    | 'xml'
-    | 'scripts'
-    | 'audioPrompts'
-    | 'teams'
-    // | 'reasonCodes'
-    | 'phonebooks'
-    | 'wrapUpCodes';
-
-export interface UccxServerEntityStats {
-    uccxIp: string;
-    counts: { [key in EntityType]: number }
-};
-
-export interface WebexLicenseFeatureUsage {
-    feature: 'PERSON' | 'ORPHANED_DEVICE',
-    totalCount: number,
-    usageCount: number,
-    unUsedCount: number
-};
-
-export interface WebexLicenseUsageSummary {
-    webexReadinessLicenseStats: WebexLicenseFeatureUsage[],
-    totalProfessionalLicenseCount: number,
-    totalWorkspaceProfessionalLicenseCount: number,
-    professionalWebexReadinessTotalLicenseStatCoverage: number,
-    workspaceWebexReadinessTotalLicenseStatCoverage: number
-};

package/projects/tuki/widgets/contact-center/cc-readiness/widgets/licences-requirement/licences-requirement.component.html

@@ -1,74 +0,0 @@
-<tk-card title="Licenses requirement">
-  <ng-container ngProjectAs="card-content">
-    <div
-      class="widget-body"
-      *ngIf="!loading && !error && viewModel; else widgetState"
-    >
-      <div class="left-section">
-        <mat-select
-          [(value)]="selectedSummaryIndex"
-          (selectionChange)="onFilterChange($event.value)"
-          class="filter-select"
-        >
-          <mat-option *ngFor="let option of filters; index as i" [value]="i">
-            {{ option }}
-          </mat-option>
-        </mat-select>
-
-        <div class="chart-section">
-          <div class="chart-wrapper">
-            <apx-chart
-              [series]="viewModel.chartOptions.series"
-              [chart]="viewModel.chartOptions.chart"
-              [labels]="viewModel.chartOptions.labels"
-              [colors]="viewModel.chartOptions.colors"
-              [legend]="viewModel.chartOptions.legend"
-              [plotOptions]="viewModel.chartOptions.plotOptions"
-              [dataLabels]="viewModel.chartOptions.dataLabels"
-            >
-            </apx-chart>
-          </div>
-          <div class="legend">
-            <div class="legend-item" *ngFor="let item of viewModel.legendItems">
-              <span
-                class="legend-marker"
-                [style.backgroundColor]="item.color"
-              ></span>
-              <span class="legend-label">{{ item.label }}</span>
-              <span class="legend-value">{{ item.count | number }}</span>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div class="divider" aria-hidden="true"></div>
-
-      <div class="table-section">
-        <div class="lic-table-header">
-          <span>License</span>
-          <span>Required</span>
-        </div>
-        <div class="table-row" *ngFor="let row of viewModel.rows">
-          <span>{{ row.label }}</span>
-          <span>{{ row.value | number }}</span>
-        </div>
-        <div class="table-row total-row">
-          <span>Total</span>
-          <span>{{ viewModel.totalRequired | number }}</span>
-        </div>
-      </div>
-    </div>
-
-    <ng-template #widgetState>
-      <div class="state-message" *ngIf="loading">
-        Loading license requirements…
-      </div>
-      <div class="state-message error" *ngIf="!loading && error">
-        Unable to load license requirements.
-      </div>
-      <div class="state-message" *ngIf="!loading && !error && !viewModel">
-        No license data available.
-      </div>
-    </ng-template>
-  </ng-container>
-</tk-card>

package/projects/tuki/widgets/contact-center/cc-readiness/widgets/licences-requirement/licences-requirement.component.scss

@@ -1,177 +0,0 @@
-@import "../../../shared/styles/variables.scss";
-
-:host {
-  display: block;
-  width: 100%;
-  box-sizing: border-box;
-}
-
-.filter-select {
-  font-family: $main-font;
-  font-size: 14px;
-  min-width: 140px;
-  border: 1px solid #e5e7eb;
-  border-radius: 0.5rem;
-  padding: 0.5rem 0.75rem;
-  background-color: #fff;
-}
-
-.filter-select:hover {
-  border-color: #d1d5db;
-}
-
-:host ::ng-deep .filter-select.mat-mdc-select {
-  border: 1px solid #e5e7eb;
-  border-radius: 0.5rem;
-  background-color: #fff;
-}
-
-:host ::ng-deep .filter-select.mat-mdc-select:hover {
-  border-color: #d1d5db;
-}
-
-:host ::ng-deep .filter-select.mat-mdc-select.mat-focused {
-  border-color: #16a693;
-}
-
-:host ::ng-deep .filter-select .mat-mdc-select-trigger {
-  font-size: 14px;
-  padding: 0.5rem 0.75rem;
-}
-
-:host ::ng-deep .filter-select .mat-mdc-select-value {
-  color: #111827;
-}
-
-:host ::ng-deep .filter-select .mat-mdc-select-arrow-wrapper {
-  padding-left: 0.5rem;
-}
-
-.widget-body {
-  display: flex;
-  gap: 2.5rem;
-  align-items: flex-start;
-}
-
-.left-section {
-  flex: 2;
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-}
-
-.chart-section {
-  display: flex;
-  gap: 1.5rem;
-  align-items: center;
-}
-
-.chart-wrapper {
-  width: 220px;
-  min-height: 220px;
-  flex-shrink: 0;
-}
-
-.chart-wrapper apx-chart {
-  width: 220px !important;
-  height: 220px !important;
-}
-
-.legend {
-  display: flex;
-  flex-direction: column;
-  gap: 0.75rem;
-}
-
-.legend-item {
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  font-family: $main-font;
-  font-size: 14px;
-}
-
-.legend-marker {
-  width: 14px;
-  height: 14px;
-  border-radius: 50%;
-  display: inline-flex;
-}
-
-.legend-label {
-  color: #4b5563;
-}
-
-.legend-value {
-  margin-left: auto;
-  font-weight: 600;
-  color: #111827;
-}
-
-.divider {
-  width: 1px;
-  min-height: 200px;
-  align-self: stretch;
-  background: #e5e7eb;
-}
-
-.table-section {
-  flex: 3;
-  display: flex;
-  flex-direction: column;
-  gap: 0.75rem;
-  font-family: $main-font;
-}
-
-.lic-table-header,
-.table-row {
-  display: flex;
-  justify-content: space-between;
-  font-size: 14px;
-}
-
-.lic-table-header {
-  font-weight: 600;
-  color: #6b7280;
-  padding-bottom: 0.5rem;
-  border-bottom: 1px solid #e5e7eb;
-}
-
-.table-row {
-  color: #111827;
-}
-
-.total-row {
-  font-weight: 700;
-  margin-top: 0.5rem;
-  padding-top: 0.5rem;
-  border-top: 1px solid #e5e7eb;
-}
-
-.state-message {
-  font-family: $main-font;
-  font-size: 14px;
-  color: #6b7280;
-}
-
-.state-message.error {
-  color: #b91c1c;
-}
-
-@media (max-width: 960px) {
-  .widget-body {
-    flex-direction: column;
-  }
-
-  .divider {
-    display: none;
-  }
-
-  .chart-section {
-    justify-content: space-between;
-  }
-}
-
-:host ::ng-deep .apexcharts-legend {
-  display: none !important;
-}

package/projects/tuki/widgets/contact-center/cc-readiness/widgets/licences-requirement/licences-requirement.component.spec.ts

@@ -1,35 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { NgApexchartsModule } from 'ng-apexcharts';
-import { of } from 'rxjs';
-import { CardComponent } from '../../components/card/card.component';
-import { CcReadinessService } from '../../cc-readiness.service';
-import { LicencesRequirementComponent } from './licences-requirement.component';
-
-class CcReadinessServiceMock {
-  setToken = jasmine.createSpy('setToken');
-  fetchWebexLicenseUsageSummary = jasmine.createSpy('fetchWebexLicenseUsageSummary').and.returnValue(of([]));
-}
-
-describe('LicencesRequirementComponent', () => {
-  let component: LicencesRequirementComponent;
-  let fixture: ComponentFixture<LicencesRequirementComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [LicencesRequirementComponent, CardComponent],
-      imports: [CommonModule, NgApexchartsModule],
-      providers: [{ provide: CcReadinessService, useClass: CcReadinessServiceMock }]
-    }).compileComponents();
-
-    fixture = TestBed.createComponent(LicencesRequirementComponent);
-    component = fixture.componentInstance;
-    component.customerId = 1477;
-    component.token = 'token';
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});