Skip to content

Commit 80e5b61

Browse files
pollyndospollyndos
committed
update to Angular 17
1 parent 0dc41cf commit 80e5b61

21 files changed

+104
-293
lines changed

‎dashboard-angular-app/.browserslistrc

-16
This file was deleted.

‎dashboard-angular-app/angular.json

+18-25
Original file line numberDiff line numberDiff line change
@@ -11,12 +11,14 @@
1111
"prefix": "app",
1212
"architect": {
1313
"build": {
14-
"builder": "@angular-devkit/build-angular:browser",
14+
"builder": "@angular-devkit/build-angular:application",
1515
"options": {
1616
"outputPath": "dist/dashboard-angular-app",
1717
"index": "src/index.html",
18-
"main": "src/main.ts",
19-
"polyfills": "src/polyfills.ts",
18+
"browser": "src/main.ts",
19+
"polyfills": [
20+
"zone.js"
21+
],
2022
"tsConfig": "tsconfig.app.json",
2123
"assets": [
2224
"src/favicon.ico",
@@ -32,30 +34,21 @@
3234
"budgets": [
3335
{
3436
"type": "initial",
35-
"maximumWarning": "2mb",
36-
"maximumError": "5mb"
37+
"maximumWarning": "500kb",
38+
"maximumError": "1mb"
3739
},
3840
{
3941
"type": "anyComponentStyle",
40-
"maximumWarning": "6kb",
41-
"maximumError": "10kb"
42-
}
43-
],
44-
"fileReplacements": [
45-
{
46-
"replace": "src/environments/environment.ts",
47-
"with": "src/environments/environment.prod.ts"
42+
"maximumWarning": "2kb",
43+
"maximumError": "4kb"
4844
}
4945
],
5046
"outputHashing": "all"
5147
},
5248
"development": {
53-
"buildOptimizer": false,
5449
"optimization": false,
55-
"vendorChunk": true,
5650
"extractLicenses": false,
57-
"sourceMap": true,
58-
"namedChunks": true
51+
"sourceMap": true
5952
}
6053
},
6154
"defaultConfiguration": "production"
@@ -64,27 +57,28 @@
6457
"builder": "@angular-devkit/build-angular:dev-server",
6558
"configurations": {
6659
"production": {
67-
"browserTarget": "dashboard-angular-app:build:production"
60+
"buildTarget": "dashboard-angular-app:build:production"
6861
},
6962
"development": {
70-
"browserTarget": "dashboard-angular-app:build:development"
63+
"buildTarget": "dashboard-angular-app:build:development"
7164
}
7265
},
7366
"defaultConfiguration": "development"
7467
},
7568
"extract-i18n": {
7669
"builder": "@angular-devkit/build-angular:extract-i18n",
7770
"options": {
78-
"browserTarget": "dashboard-angular-app:build"
71+
"buildTarget": "dashboard-angular-app:build"
7972
}
8073
},
8174
"test": {
8275
"builder": "@angular-devkit/build-angular:karma",
8376
"options": {
84-
"main": "src/test.ts",
85-
"polyfills": "src/polyfills.ts",
77+
"polyfills": [
78+
"zone.js",
79+
"zone.js/testing"
80+
],
8681
"tsConfig": "tsconfig.spec.json",
87-
"karmaConfig": "karma.conf.js",
8882
"assets": [
8983
"src/favicon.ico",
9084
"src/assets"
@@ -97,6 +91,5 @@
9791
}
9892
}
9993
}
100-
},
101-
"defaultProject": "dashboard-angular-app"
94+
}
10295
}

‎dashboard-angular-app/karma.conf.js

-44
This file was deleted.

‎dashboard-angular-app/package.json

+26-28
Original file line numberDiff line numberDiff line change
@@ -10,36 +10,34 @@
1010
},
1111
"private": true,
1212
"dependencies": {
13-
"@angular/animations": "~13.3.0",
14-
"@angular/common": "~13.3.0",
15-
"@angular/compiler": "~13.3.0",
16-
"@angular/core": "~13.3.0",
17-
"@angular/forms": "~13.3.0",
18-
"@angular/platform-browser": "~13.3.0",
19-
"@angular/platform-browser-dynamic": "~13.3.0",
20-
"@angular/router": "~13.3.0",
21-
"@devexpress/analytics-core": "22.2-stable",
22-
"devexpress-dashboard": "22.2-stable",
23-
"devexpress-dashboard-angular": "22.2-stable",
24-
"devextreme": "22.2-stable",
25-
"devextreme-angular": "22.2-stable",
26-
"devexpress-richedit": "22.2-stable",
27-
"rxjs": "~7.5.0",
13+
"@angular/animations": "^17.0.0",
14+
"@angular/common": "^17.0.0",
15+
"@angular/compiler": "^17.0.0",
16+
"@angular/core": "^17.0.0",
17+
"@angular/forms": "^17.0.0",
18+
"@angular/platform-browser": "^17.0.0",
19+
"@angular/platform-browser-dynamic": "^17.0.0",
20+
"@angular/router": "^17.0.0",
21+
"@devexpress/analytics-core": "^23.2.3",
22+
"devexpress-dashboard": "^23.2.3",
23+
"devexpress-dashboard-angular": "^23.2.3",
24+
"devextreme": "^23.2.3",
25+
"devextreme-angular": "^23.2.3",
26+
"rxjs": "~7.8.0",
2827
"tslib": "^2.3.0",
29-
"zone.js": "~0.11.4"
28+
"zone.js": "~0.14.2"
3029
},
3130
"devDependencies": {
32-
"@angular-devkit/build-angular": "~13.3.4",
33-
"@angular/cli": "~13.3.4",
34-
"@angular/compiler-cli": "~13.3.0",
35-
"@types/jasmine": "~3.10.0",
36-
"@types/node": "^12.11.1",
37-
"jasmine-core": "~4.0.0",
38-
"karma": "~6.3.0",
39-
"karma-chrome-launcher": "~3.1.0",
40-
"karma-coverage": "~2.1.0",
41-
"karma-jasmine": "~4.0.0",
42-
"karma-jasmine-html-reporter": "~1.7.0",
43-
"typescript": "~4.6.2"
31+
"@angular-devkit/build-angular": "^17.0.8",
32+
"@angular/cli": "^17.0.8",
33+
"@angular/compiler-cli": "^17.0.0",
34+
"@types/jasmine": "~5.1.0",
35+
"jasmine-core": "~5.1.0",
36+
"karma": "~6.4.0",
37+
"karma-chrome-launcher": "~3.2.0",
38+
"karma-coverage": "~2.2.0",
39+
"karma-jasmine": "~5.1.0",
40+
"karma-jasmine-html-reporter": "~2.1.0",
41+
"typescript": "~5.2.2"
4442
}
4543
}

‎dashboard-angular-app/src/app/app.component.css

-19
Original file line numberDiff line numberDiff line change
@@ -1,19 +0,0 @@
1-
.header {
2-
display: flex;
3-
position: absolute;
4-
top: 0;
5-
height: 46px;
6-
right: 0;
7-
left: 0;
8-
> .dx-widget {
9-
margin: 5px;
10-
}
11-
12-
}
13-
.content {
14-
position: absolute;
15-
top: 46px;
16-
bottom: 0;
17-
right: 0;
18-
left: 0;
19-
}

‎dashboard-angular-app/src/app/app.component.html

+2-1
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,8 @@
1717

1818
<div class="content">
1919
<dx-dashboard-control
20-
endpoint='http://localhost:5000/api/dashboard'
20+
style="display: block;width:100%;height:800px;"
21+
endpoint='https://localhost:5001/api/dashboard'
2122
[(dashboardId)]="dashboardId"
2223
[workingMode]='workingMode'
2324
(onBeforeRender)='onBeforeRender($event)'>

‎dashboard-angular-app/src/app/app.component.spec.ts

+8-10
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,20 @@
1-
import { TestBed, async } from '@angular/core/testing';
1+
import { TestBed } from '@angular/core/testing';
22
import { AppComponent } from './app.component';
33

44
describe('AppComponent', () => {
5-
beforeEach(async(() => {
6-
TestBed.configureTestingModule({
7-
declarations: [
8-
AppComponent
9-
],
5+
beforeEach(async () => {
6+
await TestBed.configureTestingModule({
7+
imports: [AppComponent],
108
}).compileComponents();
11-
}));
9+
});
1210

1311
it('should create the app', () => {
1412
const fixture = TestBed.createComponent(AppComponent);
1513
const app = fixture.componentInstance;
1614
expect(app).toBeTruthy();
1715
});
1816

19-
it(`should have as title 'dashboard-angular-app'`, () => {
17+
it(`should have the 'dashboard-angular-app' title`, () => {
2018
const fixture = TestBed.createComponent(AppComponent);
2119
const app = fixture.componentInstance;
2220
expect(app.title).toEqual('dashboard-angular-app');
@@ -25,7 +23,7 @@ describe('AppComponent', () => {
2523
it('should render title', () => {
2624
const fixture = TestBed.createComponent(AppComponent);
2725
fixture.detectChanges();
28-
const compiled = fixture.nativeElement;
29-
expect(compiled.querySelector('.content span').textContent).toContain('dashboard-angular-app app is running!');
26+
const compiled = fixture.nativeElement as HTMLElement;
27+
expect(compiled.querySelector('h1')?.textContent).toContain('Hello, dashboard-angular-app');
3028
});
3129
});

‎dashboard-angular-app/src/app/app.component.ts

+10-2
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,21 @@
11
import { Component } from '@angular/core';
2+
import { CommonModule } from '@angular/common';
3+
import { RouterOutlet } from '@angular/router';
4+
import { DxDashboardControlModule } from 'devexpress-dashboard-angular';
5+
import { DevExtremeModule } from 'devextreme-angular';
26
import { DashboardControl, DashboardControlArgs } from 'devexpress-dashboard';
37
import { TextBoxItemEditorExtension } from 'devexpress-dashboard/designer/text-box-item-editor-extension';
48

9+
510
@Component({
611
selector: 'app-root',
12+
standalone: true,
13+
imports: [CommonModule, RouterOutlet, DxDashboardControlModule, DevExtremeModule],
714
templateUrl: './app.component.html',
8-
styleUrls: ['./app.component.css']
15+
styleUrl: './app.component.css'
916
})
1017
export class AppComponent {
18+
title = 'DashboardAngularApp';
1119
workingMode: string = 'Viewer';
1220
dashboardId: string = 'support';
1321
dashboards = [
@@ -20,7 +28,7 @@ export class AppComponent {
2028
changeWorkingMode() {
2129
this.workingMode = this.toggleMode(this.workingMode);
2230
}
23-
toggleMode(mode) {
31+
toggleMode(mode: string) {
2432
return mode === 'Viewer' ? "Designer" : "Viewer";
2533
}
2634
onBeforeRender(args: DashboardControlArgs) {

‎dashboard-angular-app/src/app/app.config.ts

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import { ApplicationConfig } from '@angular/core';
2+
import { provideRouter } from '@angular/router';
3+
4+
import { routes } from './app.routes';
5+
6+
export const appConfig: ApplicationConfig = {
7+
providers: [provideRouter(routes)]
8+
};

‎dashboard-angular-app/src/app/app.module.ts

-20
This file was deleted.

‎dashboard-angular-app/src/app/app.routes.ts

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import { Routes } from '@angular/router';
2+
3+
export const routes: Routes = [];

‎dashboard-angular-app/src/environments/environment.prod.ts

-3
This file was deleted.

‎dashboard-angular-app/src/environments/environment.ts

-16
This file was deleted.

‎dashboard-angular-app/src/favicon.ico

13.8 KB
Binary file not shown.

‎dashboard-angular-app/src/main.ts

+5-11
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,6 @@
1-
import { enableProdMode } from '@angular/core';
2-
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
1+
import { bootstrapApplication } from '@angular/platform-browser';
2+
import { appConfig } from './app/app.config';
3+
import { AppComponent } from './app/app.component';
34

4-
import { AppModule } from './app/app.module';
5-
import { environment } from './environments/environment';
6-
7-
if (environment.production) {
8-
enableProdMode();
9-
}
10-
11-
platformBrowserDynamic().bootstrapModule(AppModule)
12-
.catch(err => console.error(err));
5+
bootstrapApplication(AppComponent, appConfig)
6+
.catch((err) => console.error(err));

0 commit comments

Comments
 (0)