Merge pull request #9410 from Sunbird-Ed/v16

Angular 16 migration changes

Author: pallakartheekreddy

.github/workflows/image-push.yml

@@ -35,6 +35,13 @@ jobs:
           mkdir -p app_dist/
           rm -rf dist-cdn
 
+      - name: Update Browserslist DB
+        working-directory: src/app/client
+        run: |
+          echo "Updating browserslist/caniuse-lite database to include latest browser versions"
+          # This updates caniuse-lite so Browserslist knows about the newest browser versions
+          npx browserslist@latest --update-db --no-progress || true
+
       - name: Install Client Dependencies
         working-directory: src/app/client
         run: |

src/app/client/__mocks__/chart.js

@@ -0,0 +1,19 @@
+// Mock Chart.js module for Jest tests
+module.exports = {
+  Chart: {
+    register: jest.fn(),
+    registerables: [],
+    defaults: { global: {} }
+  },
+  registerables: [],
+  CategoryScale: jest.fn(),
+  LinearScale: jest.fn(),
+  BarElement: jest.fn(),
+  Title: jest.fn(),
+  Tooltip: jest.fn(),
+  Legend: jest.fn(),
+  PointElement: jest.fn(),
+  LineElement: jest.fn(),
+  Filler: jest.fn(),
+  ArcElement: jest.fn(),
+};

src/app/client/__mocks__/ng2-charts.js

@@ -0,0 +1,18 @@
+// Mock ng2-charts module for Jest tests
+module.exports = {
+  BaseChartDirective: class MockBaseChartDirective {
+    constructor() {
+      this.data = null;
+      this.options = null;
+      this.chart = null;
+      this.update = jest.fn();
+      this.render = jest.fn();
+    }
+  },
+  NgChartsModule: class MockNgChartsModule {},
+  Chart: {
+    register: jest.fn(),
+    registerables: [],
+    defaults: { global: {} }
+  }
+};

src/app/client/angular.json

@@ -36,17 +36,17 @@
               },
                {
                 "glob": "**/*",
-                "input": "./node_modules/@project-sunbird/sunbird-pdf-player-web-component/lib/assets/",
+                "input": "./node_modules/@project-sunbird/sunbird-pdf-player-web-component/assets/",
                 "output": "/assets/"
               },
               {
                 "glob": "**/*",
-                "input": "./node_modules/@project-sunbird/sunbird-epub-player-web-component/lib/assets/",
+                "input": "./node_modules/@project-sunbird/sunbird-epub-player-web-component/assets/",
                 "output": "/assets/"
               },
               {
                 "glob": "**/*",
-                "input": "./node_modules/@project-sunbird/sunbird-video-player-web-component/lib/assets/",
+                "input": "./node_modules/@project-sunbird/sunbird-video-player-web-component/assets/",
                 "output": "/assets/"
               },
               {
@@ -76,7 +76,7 @@
               },
               {
                 "glob": "**/*",
-                "input": "node_modules/@project-sunbird/sunbird-quml-player-web-component/lib/assets",
+                "input": "node_modules/@project-sunbird/sunbird-quml-player-web-component/assets",
                 "output": "/assets/"
               },
               {

src/app/client/jest-global-mocks.ts

@@ -80,4 +80,17 @@ if (!global.crypto) {
 const util = require('util');
 if (!(global as any).util) {
   (global as any).util = util;
-}
+}
+
+// Mock Chart.js for ng2-charts compatibility
+const Chart = {
+  register: jest.fn(),
+  registerables: [],
+  defaults: {
+    global: {}
+  }
+};
+
+// Make Chart available globally for tests
+(global as any).Chart = Chart;
+(window as any).Chart = Chart;

src/app/client/package.json

@@ -28,8 +28,7 @@
     "inject-cdn-fallback": "gulp inject:cdnFallBack:script",
     "with-stats": "node --max_old_space_size=8096 node_modules/.bin/ng build --configuration production --stats-json",
     "build:stats": "ng build --stats-json",
-    "analyze": "webpack-bundle-analyzer dist/stats.json",
-    "postinstall": "ngcc"
+    "analyze": "webpack-bundle-analyzer dist/stats.json"
   },
   "nodemonConfig": {
     "ext": "png,jpeg,js,ts,html,json,css,scss"
@@ -40,57 +39,57 @@
   },
   "private": true,
   "dependencies": {
-    "@angular-devkit/build-angular": "14.2.10",
-    "@angular/animations": "14.3.0",
-    "@angular/cdk": "14.2.7",
-    "@angular/cli": "14.2.10",
-    "@angular/common": "14.3.0",
-    "@angular/compiler": "14.3.0",
-    "@angular/compiler-cli": "14.3.0",
-    "@angular/core": "14.3.0",
-    "@angular/forms": "14.3.0",
-    "@angular/localize": "14.3.0",
+    "@angular-devkit/build-angular": "16.2.14",
+    "@angular/animations": "16.2.12",
+    "@angular/cdk": "16.2.14",
+    "@angular/cli": "16.2.14",
+    "@angular/common": "16.2.12",
+    "@angular/compiler": "16.2.12",
+    "@angular/compiler-cli": "16.2.12",
+    "@angular/core": "16.2.12",
+    "@angular/forms": "16.2.12",
+    "@angular/localize": "16.2.12",
     "@angular/material": "14.2.7",
     "@angular/material-moment-adapter": "14.2.7",
-    "@angular/platform-browser": "14.3.0",
-    "@angular/platform-browser-dynamic": "14.3.0",
-    "@angular/router": "14.3.0",
+    "@angular/platform-browser": "16.2.12",
+    "@angular/platform-browser-dynamic": "16.2.12",
+    "@angular/router": "16.2.12",
     "@derekbaker/ngx-ace-editor-wrapper": "12.2.16",
-    "@ngx-translate/core": "14.0.0",
-    "@ngx-translate/http-loader": "7.0.0",
-    "@project-sunbird/chatbot-client": "4.0.0",
+    "@ngx-translate/core": "15.0.0",
+    "@ngx-translate/http-loader": "8.0.0",
+    "@project-sunbird/chatbot-client": "8.0.1",
     "@project-sunbird/ckeditor-build-classic": "4.1.3",
     "@project-sunbird/client-services": "8.0.2",
-    "@project-sunbird/common-consumption": "7.0.12",
-    "@project-sunbird/common-form-elements-full": "6.0.3",
-    "@project-sunbird/discussions-ui": "5.4.0",
+    "@project-sunbird/common-consumption": "8.0.2-v16",
+    "@project-sunbird/common-form-elements-full": "8.0.6",
+    "@project-sunbird/discussions-ui": "8.0.3-v16",
     "@project-sunbird/ng2-semantic-ui": "8.0.2",
-    "@project-sunbird/sb-content-section": "7.0.1",
-    "@project-sunbird/sb-dashlet": "6.0.5",
-    "@project-sunbird/sb-notification": "6.1.0",
+    "@project-sunbird/sb-content-section": "8.0.2",
+    "@project-sunbird/sb-dashlet": "8.0.2",
+    "@project-sunbird/sb-notification": "8.0.1-v16.1",
     "@project-sunbird/sb-styles": "0.0.15",
-    "@project-sunbird/sb-themes": "7.0.2",
+    "@project-sunbird/sb-themes": "7.0.3-v16",
     "@project-sunbird/sunbird-collection-editor": "8.0.4",
     "@project-sunbird/sunbird-epub-player-v9": "5.6.0",
     "@project-sunbird/sunbird-epub-player-web-component": "1.4.1",
     "@project-sunbird/sunbird-file-upload-library": "1.0.4",
     "@project-sunbird/sunbird-pdf-player-v9": "5.5.0",
     "@project-sunbird/sunbird-pdf-player-web-component": "1.4.0",
     "@project-sunbird/sunbird-questionset-editor": "8.0.6",
-    "@project-sunbird/sunbird-quml-player": "7.0.4",
+    "@project-sunbird/sunbird-quml-player": "8.0.2",
     "@project-sunbird/sunbird-quml-player-v9": "5.1.5",
     "@project-sunbird/sunbird-quml-player-web-component": "4.0.2",
-    "@project-sunbird/sunbird-resource-library": "7.0.4",
+    "@project-sunbird/sunbird-resource-library": "8.0.2",
     "@project-sunbird/sunbird-video-player-v9": "5.5.1",
     "@project-sunbird/sunbird-video-player-web-component": "1.2.5",
     "@project-sunbird/telemetry-sdk": "0.0.29",
-    "@project-sunbird/web-extensions": "6.0.0",
+    "@project-sunbird/web-extensions": "8.0.1",
     "@samagra-x/uci-console": "6.0.3",
-    "@shikshalokam/sl-questionnaire": "2.3.1",
-    "@shikshalokam/sl-reports-library": "3.0.1",
+    "@shikshalokam/sl-questionnaire": "7.0.0",
+    "@shikshalokam/sl-reports-library": "6.0.0",
     "@swimlane/ngx-datatable": "20.1.0",
     "@types/jquery.fancytree": "2.7.34",
-    "angular-datatables": "14.0.2",
+    "angular-datatables": "16.0.0",
     "angular2-uuid": "1.1.1",
     "chart.js": "2.9.4",
     "common-form-elements-v9": "4.5.0",
@@ -128,8 +127,7 @@
     "md5": "2.2.1",
     "ng-recaptcha": "9.0.0",
     "ng2-cache-service": "1.1.1",
-    "ng2-charts": "2.4.2",
-    "ng2-semantic-ui-v9": "0.0.6",
+    "ng2-charts": "5.0.4",
     "ngx-bootstrap": "8.0.0",
     "ngx-chips": "2.2.2",
     "ngx-daterangepicker-material": "6.0.4",
@@ -165,11 +163,13 @@
     "minimist": "1.2.5",
     "protractor": "7.0.0",
     "ts-node": "10.9.1",
-    "typescript": "4.7.4",
+    "typescript": "5.1.6",
     "typescript-eslint": "8.32.0",
     "webpack-bundle-analyzer": "4.7.0"
   },
-  "resolutions": {},
+  "resolutions": {
+    "datatables.net": "1.10.20"
+  },
   "jest": {
     "preset": "jest-preset-angular",
     "verbose": true,
@@ -220,6 +220,8 @@
     ],
     "moduleNameMapper": {
       "canvas": "<rootDir>/__mocks__/canvas.js",
+      "chart.js": "<rootDir>/__mocks__/chart.js",
+      "ng2-charts": "<rootDir>/__mocks__/ng2-charts.js",
       "^@sunbird/core": "<rootDir>/src/app/modules/core",
       "^@sunbird/shared": "<rootDir>/src/app/modules/shared",
       "^@sunbird/home": "<rootDir>/src/app/modules/home",

src/app/client/src/app/app.module.ts

@@ -2,7 +2,7 @@ import { NgModule } from '@angular/core';
 import { AppComponent } from './app.component';
 import { AppRoutingModule } from './app.routing';
 import { HttpClientModule, HTTP_INTERCEPTORS, HttpClient } from '@angular/common/http';
-import { SuiModalModule } from 'ng2-semantic-ui-v9';
+import { SuiModalModule } from '@project-sunbird/ng2-semantic-ui';
 import { CommonModule } from '@angular/common';
 import { CoreModule, SessionExpiryInterceptor } from '@sunbird/core';
 import { SharedModule } from '@sunbird/shared';

src/app/client/src/app/app.routing.ts

@@ -44,9 +44,6 @@ const appRoutes: Routes = [
   {
     path: 'manage', loadChildren: () => import('./modules/manage/manage.module').then(m => m.ManageModule)
   },
-  {
-    path: 'uci-admin', loadChildren: () => import('./modules/uci-admin/uci-admin.module').then(m => m.UciAdminModule)
-  },
   {
     path: '', loadChildren: () => import('./modules/public/public.module').then(m => m.PublicModule)
   },
@@ -83,7 +80,7 @@ const appRoutes: Routes = [
 ];
 
 @NgModule({
-  imports: [RouterModule.forRoot(appRoutes, { relativeLinkResolution: 'corrected' })],
+  imports: [RouterModule.forRoot(appRoutes)],
   exports: [RouterModule]
 })
 export class AppRoutingModule { }

src/app/client/src/app/modules/badging/badging.module.ts

@@ -1,6 +1,6 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { SuiModule } from 'ng2-semantic-ui-v9';
+import { SuiModule } from '@project-sunbird/ng2-semantic-ui';
 import { SharedModule } from '@sunbird/shared';
 import { ContentBadgeComponent, AssignBadgesContentComponent } from './components';
 import { ContentBadgeService } from './services';

src/app/client/src/app/modules/certificate/certificate.module.ts

@@ -2,7 +2,7 @@ import { SharedFeatureModule } from '@sunbird/shared-feature';
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { CertificateRoutingModule } from './certificate-routing.module';
-import { SuiModalModule, SuiSelectModule, SuiDropdownModule, SuiPopupModule } from 'ng2-semantic-ui-v9';
+import { SuiModalModule, SuiSelectModule, SuiDropdownModule, SuiPopupModule } from '@project-sunbird/ng2-semantic-ui';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { SharedModule } from '@sunbird/shared';
 import { TelemetryModule } from '@sunbird/telemetry';