[ACS-5199] upgrade 3rd party depedencies to support angular 14 and later (#8669)

* ACS-5199 Upgraded ng2-charts and chart.js

* ACS-5199 Removed reports tab from demoshell

* ACS-5199 Versions correction after upgrading charts

* ACS-5199 Replaced ngx-monaco-editor with ngx-monaco-editor-v2

demo-shell/src/app/app.module.ts

@@ -18,7 +18,7 @@
 import { BrowserModule } from '@angular/platform-browser';
 import { APP_INITIALIZER, NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { ChartsModule } from 'ng2-charts';
+import { NgChartsModule } from 'ng2-charts';
 import { HttpClientModule } from '@angular/common/http';
 import { BrowserAnimationsModule, NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { TranslateModule } from '@ngx-translate/core';
@@ -59,7 +59,7 @@ import { TaskAttachmentsComponent } from './components/process-service/task-atta
 import { ProcessAttachmentsComponent } from './components/process-service/process-attachments.component';
 import { SharedLinkViewComponent } from './components/shared-link-view/shared-link-view.component';
 import { DemoPermissionComponent } from './components/permissions/demo-permissions.component';
-import { MonacoEditorModule } from 'ngx-monaco-editor';
+import { MonacoEditorModule } from 'ngx-monaco-editor-v2';
 import { ContentModule } from '@alfresco/adf-content-services';
 import { InsightsModule } from '@alfresco/adf-insights';
 import { ProcessModule } from '@alfresco/adf-process-services';
@@ -151,7 +151,7 @@ registerLocaleData(localeSv);
         ProcessServicesCloudModule.forRoot(),
         ExtensionsModule.forRoot(),
         ThemePickerModule,
-        ChartsModule,
+        NgChartsModule,
         AppCloudSharedModule,
         MonacoEditorModule.forRoot()
     ],

demo-shell/src/app/components/config-editor/config-editor.module.ts

@@ -20,7 +20,7 @@ import { ConfigEditorComponent } from './config-editor.component';
 import { Routes, RouterModule } from '@angular/router';
 import { CommonModule } from '@angular/common';
 import { CoreModule } from '@alfresco/adf-core';
-import { MonacoEditorModule } from 'ngx-monaco-editor';
+import { MonacoEditorModule } from 'ngx-monaco-editor-v2';
 
 const routes: Routes = [
     {

demo-shell/src/app/components/process-service/process-service.component.html

@@ -245,29 +245,6 @@
             </div>
         </div>
     </mat-tab>
-    <mat-tab id="report-header" href="#report"
-             label="{{'PS-TAB.REPORTS-TAB' | translate}}">
-        <div class="app-grid">
-            <div class="app-grid-item app-reports-menu">
-                <span><h5>Report List</h5></span>
-                <mat-divider></mat-divider>
-            </div>
-            <div class="app-grid-item app-reports-details">
-                <adf-analytics
-                    *ngIf="report"
-                    [appId]="appId"
-                    [reportId]="report.id"
-                    [hideParameters]="false"
-                    (editReport)="onEditReport()"
-                    (reportSaved)="onReportSaved($event)"
-                    (reportDeleted)="onReportDeleted()">
-                </adf-analytics>
-                <div *ngIf="!report">
-                    <span>{{'ANALYTICS_REPORT.NO_REPORT_MESSAGE' | translate}}</span>
-                </div>
-            </div>
-        </div>
-    </mat-tab>
     <mat-tab id="settings-header" href="#settings"
              label="{{'PS-TAB.SETTINGS-TAB' | translate}}">
         <div class="app-grid">

demo-shell/src/app/components/process-service/process-service.component.scss

@@ -104,13 +104,13 @@
             min-width: 225px;
         }
 
-        .app-reports-menu, .app-settings-menu {
+        .app-settings-menu {
             flex: 1 1 300px;
             max-width: 300px;
             min-width: 300px;
         }
 
-        .app-tasks-details, .app-tasks-start, .app-processes-details, .app-processes-start, .app-reports-details, .app-settings-details {
+        .app-tasks-details, .app-tasks-start, .app-processes-details, .app-processes-start, .app-settings-details {
             flex: 1 1 auto;
             min-width: auto;
         }

demo-shell/src/app/components/process-service/process-service.component.ts

@@ -38,9 +38,6 @@ import {
     FORM_FIELD_VALIDATORS, FormRenderingService, FormService, AppConfigService, PaginationComponent, UserPreferenceValues,
     AlfrescoApiService, UserPreferencesService, LogService, DataCellEvent, NotificationService
 } from '@alfresco/adf-core';
-
-import { AnalyticsReportListComponent } from '@alfresco/adf-insights';
-
 import {
     ProcessFiltersComponent,
     ProcessInstance,
@@ -109,9 +106,6 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
     @ViewChild('activitiStartProcess')
     activitiStartProcess: StartProcessInstanceComponent;
 
-    @ViewChild('analyticsReportList', { static: true })
-    analyticsReportList: AnalyticsReportListComponent;
-
     @Input()
     appId: number = null;
 
@@ -120,7 +114,6 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
     @Output()
     changePageSize = new EventEmitter<Pagination>();
 
-    selectFirstReport = false;
     multiSelectTask = false;
     multiSelectProcess = false;
     selectionMode = 'single';
@@ -147,7 +140,6 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
     activeTab: number = this.tabs.tasks; // tasks|processes|reports
 
     taskFilter: FilterRepresentationModel;
-    report: any;
     processFilter: UserProcessInstanceFilterRepresentation;
     blobFile: any;
     flag = true;
@@ -313,10 +305,6 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
         this.changePageSize.emit(event);
     }
 
-    onReportClick(event: any): void {
-        this.report = event;
-    }
-
     onSuccessTaskFilterList(): void {
         this.applyTaskFilter(this.activitiFilter.getCurrentFilter());
     }
@@ -380,19 +368,6 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
         this.currentProcessInstanceId = processInstanceId;
     }
 
-    onEditReport(): void {
-        this.analyticsReportList.reload();
-    }
-
-    onReportSaved(reportId: number): void {
-        this.analyticsReportList.reload(reportId);
-    }
-
-    onReportDeleted(): void {
-        this.analyticsReportList.reload();
-        this.analyticsReportList.selectReport(null);
-    }
-
     navigateStartProcess(): void {
         this.currentProcessInstanceId = currentProcessIdNew;
     }