Skip to content

Commit 77d78f9

Browse files
committed
Upgrade the Angular to 20.0.3
1 parent 19aeb16 commit 77d78f9

13 files changed

+118
-75
lines changed

angular.json

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -22,11 +22,12 @@
2222
"prefix": "app",
2323
"architect": {
2424
"build": {
25-
"builder": "@angular-devkit/build-angular:browser",
25+
"builder": "@angular-devkit/build-angular:application",
2626
"options": {
27-
"outputPath": "dist/angular-notes-manager",
27+
"outputPath": {
28+
"base": "dist/angular-notes-manager"
29+
},
2830
"index": "src/index.html",
29-
"main": "src/main.ts",
3031
"polyfills": [
3132
"zone.js"
3233
],
@@ -39,7 +40,8 @@
3940
"styles": [
4041
"src/styles.less"
4142
],
42-
"scripts": []
43+
"scripts": [],
44+
"browser": "src/main.ts"
4345
},
4446
"configurations": {
4547
"production": {
@@ -58,9 +60,7 @@
5860
"outputHashing": "all"
5961
},
6062
"development": {
61-
"buildOptimizer": false,
6263
"optimization": false,
63-
"vendorChunk": true,
6464
"extractLicenses": false,
6565
"sourceMap": true,
6666
"namedChunks": true
@@ -72,18 +72,18 @@
7272
"builder": "@angular-devkit/build-angular:dev-server",
7373
"configurations": {
7474
"production": {
75-
"browserTarget": "angular-notes-manager:build:production"
75+
"buildTarget": "angular-notes-manager:build:production"
7676
},
7777
"development": {
78-
"browserTarget": "angular-notes-manager:build:development"
78+
"buildTarget": "angular-notes-manager:build:development"
7979
}
8080
},
8181
"defaultConfiguration": "development"
8282
},
8383
"extract-i18n": {
8484
"builder": "@angular-devkit/build-angular:extract-i18n",
8585
"options": {
86-
"browserTarget": "angular-notes-manager:build"
86+
"buildTarget": "angular-notes-manager:build"
8787
}
8888
},
8989
"test": {

src/app/app.component.html

Lines changed: 18 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,21 @@
11
<section class="app">
2-
<header>
3-
<app-new-button (invokeEvent)="addNoteButtonClick()" />
4-
<app-save-button [isSavingInProgress]="isSavingInProgress" (invokeEvent)="saveNoteButtonClick()" />
5-
<app-delete-button (invokeEvent)="deleteNote(selectedNote)" />
6-
</header>
7-
<article>
8-
<app-note-detail *ngIf="selectedNote" [note]="selectedNote" />
9-
</article>
10-
<aside *ngIf="notes$ | async as notes">
11-
<app-note-list
12-
[notes]="notes"
13-
[selectedNote]="selectedNote"
14-
(noteSelectionChange)="selectedNoteChange($event)"
15-
(noteDeleted)="deleteNote($event)" />
2+
<header>
3+
<app-new-button (invokeEvent)="addNoteButtonClick()" />
4+
<app-save-button [isSavingInProgress]="isSavingInProgress" (invokeEvent)="saveNoteButtonClick()" />
5+
<app-delete-button (invokeEvent)="deleteNote(selectedNote)" />
6+
</header>
7+
<article>
8+
@if (selectedNote) {
9+
<app-note-detail [note]="selectedNote" />
10+
}
11+
</article>
12+
@if (notes$ | async; as notes) {
13+
<aside>
14+
<app-note-list
15+
[notes]="notes"
16+
[selectedNote]="selectedNote"
17+
(noteSelectionChange)="selectedNoteChange($event)"
18+
(noteDeleted)="deleteNote($event)" />
1619
</aside>
20+
}
1721
</section>

src/app/app.component.spec.ts

Lines changed: 20 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -16,30 +16,45 @@ describe('AppComponent', () => {
1616
let fixture: ComponentFixture<AppComponent>;
1717
let appComponent: AppComponent;
1818

19-
@Component({ selector: 'app-note-detail', template: '' })
19+
@Component({
20+
selector: 'app-note-detail', template: '',
21+
standalone: false
22+
})
2023
class MockNoteDetailComponent {
2124
@Input() note!: Note;
2225
}
2326

24-
@Component({ selector: 'app-note-list', template: '' })
27+
@Component({
28+
selector: 'app-note-list', template: '',
29+
standalone: false
30+
})
2531
class MockNoteListComponent {
2632
@Input() notes!: Note[];
2733
@Input() selectedNote!: Note;
2834
@Output() noteSelectionChange = new EventEmitter<Note>();
2935
@Output() noteDeleted = new EventEmitter<Note>();
3036
}
3137

32-
@Component({ selector: 'app-delete-button', template: '' })
38+
@Component({
39+
selector: 'app-delete-button', template: '',
40+
standalone: false
41+
})
3342
class MockDeleteButtonComponent {
3443
@Output() invokeEvent = new EventEmitter();
3544
}
3645

37-
@Component({ selector: 'app-new-button', template: '' })
46+
@Component({
47+
selector: 'app-new-button', template: '',
48+
standalone: false
49+
})
3850
class MockNewButtonComponent {
3951
@Output() invokeEvent = new EventEmitter();
4052
}
4153

42-
@Component({ selector: 'app-save-button', template: '' })
54+
@Component({
55+
selector: 'app-save-button', template: '',
56+
standalone: false
57+
})
4358
class MockSaveButtonComponent {
4459
@Input() isSavingInProgress = false;
4560
@Output() invokeEvent = new EventEmitter();

src/app/app.component.ts

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,11 @@ import { BrowserInteractionService } from './services/browser-interaction.servic
55
import { BehaviorSubject, Subject, map, of, switchMap, take, zip } from 'rxjs';
66

77
@Component({
8-
selector: 'app-root',
9-
templateUrl: './app.component.html',
10-
styleUrls: ['./app.component.less'],
11-
changeDetection: ChangeDetectionStrategy.OnPush
8+
selector: 'app-root',
9+
templateUrl: './app.component.html',
10+
styleUrls: ['./app.component.less'],
11+
changeDetection: ChangeDetectionStrategy.OnPush,
12+
standalone: false
1213
})
1314
export class AppComponent implements OnInit {
1415
selectedNote!: Note;

src/app/base-button/base-button.component.ts

Lines changed: 17 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,10 @@ import { Component, EventEmitter, Input, Output } from '@angular/core';
33
const buttonTemplate = '<span>[<a (click)="invoke()" (keypress)="invoke()" tabindex="0">{{ label }}</a>]</span>';
44

55
@Component({
6-
selector: 'app-button',
7-
template: buttonTemplate,
8-
styles: []
6+
selector: 'app-button',
7+
template: buttonTemplate,
8+
styles: [],
9+
standalone: false
910
})
1011
abstract class BaseButtonComponent {
1112

@@ -22,9 +23,10 @@ abstract class BaseButtonComponent {
2223
}
2324

2425
@Component({
25-
selector: 'app-delete-button',
26-
template: buttonTemplate,
27-
styles: []
26+
selector: 'app-delete-button',
27+
template: buttonTemplate,
28+
styles: [],
29+
standalone: false
2830
})
2931
export class DeleteButtonComponent extends BaseButtonComponent {
3032

@@ -36,9 +38,10 @@ export class DeleteButtonComponent extends BaseButtonComponent {
3638
}
3739

3840
@Component({
39-
selector: 'app-new-button',
40-
template: buttonTemplate,
41-
styles: []
41+
selector: 'app-new-button',
42+
template: buttonTemplate,
43+
styles: [],
44+
standalone: false
4245
})
4346
export class NewButtonComponent extends BaseButtonComponent {
4447

@@ -50,11 +53,12 @@ export class NewButtonComponent extends BaseButtonComponent {
5053
}
5154

5255
@Component({
53-
selector: 'app-save-button',
54-
template: `<span>[<a tabindex="0" [class.workInProgress]="isSavingInProgress" (click)="invoke()" (keypress)="invoke()" (keydown)="invoke()">{{ isSavingInProgress ? '...' : label }}</a>]</span>`,
55-
styles: [`a.workInProgress {
56+
selector: 'app-save-button',
57+
template: `<span>[<a tabindex="0" [class.workInProgress]="isSavingInProgress" (click)="invoke()" (keypress)="invoke()" (keydown)="invoke()">{{ isSavingInProgress ? '...' : label }}</a>]</span>`,
58+
styles: [`a.workInProgress {
5659
font-weight: bold;
57-
}`]
60+
}`],
61+
standalone: false
5862
})
5963
export class SaveButtonComponent extends BaseButtonComponent {
6064

src/app/note-detail/note-detail.component.ts

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,10 @@ import { Note } from '../note';
33
import { ChangeDetector } from '../change-detector';
44

55
@Component({
6-
selector: 'app-note-detail',
7-
template: '<textarea (keyup)="onKey($event)" [(ngModel)]="note.text"></textarea>',
8-
styleUrls: ['./note-detail.component.less']
6+
selector: 'app-note-detail',
7+
template: '<textarea (keyup)="onKey($event)" [(ngModel)]="note.text"></textarea>',
8+
styleUrls: ['./note-detail.component.less'],
9+
standalone: false
910
})
1011
export class NoteDetailComponent implements OnChanges {
1112
@Input()

src/app/note-list-item/note-list-item.component.spec.ts

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,17 +12,26 @@ describe('NoteListItemComponent', () => {
1212
let noteListItemComponent: NoteListItemComponent;
1313
let fixture: ComponentFixture<NoteListItemComponent>;
1414

15-
@Component({ selector: 'app-note-title', template: '' })
15+
@Component({
16+
selector: 'app-note-title', template: '',
17+
standalone: false
18+
})
1619
class MockNoteTitleComponent {
1720
@Input() title!: Note;
1821
}
1922

20-
@Component({ selector: 'app-delete-button', template: '' })
23+
@Component({
24+
selector: 'app-delete-button', template: '',
25+
standalone: false
26+
})
2127
class MockDeleteButtonComponent {
2228
@Output() deletedEvent = new EventEmitter();
2329
}
2430

25-
@Pipe({ name: 'noteTitle' })
31+
@Pipe({
32+
name: 'noteTitle',
33+
standalone: false
34+
})
2635
class MockNoteTitlePipe implements PipeTransform {
2736
transform(value: Note): string { return value?.text ?? ''; }
2837
}

src/app/note-list-item/note-list-item.component.ts

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,14 @@ import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from
22
import { Note } from '../note';
33

44
@Component({
5-
selector: 'app-note-list-item',
6-
template: `<li [class.selected]="isSelected" [class.not-saved]="!(note?.isSaved)" tabindex="0">
5+
selector: 'app-note-list-item',
6+
template: `<li [class.selected]="isSelected" [class.not-saved]="!(note?.isSaved)" tabindex="0">
77
<app-note-title [title]="note! | noteTitle" />
88
<app-delete-button (invokeEvent)="deleteNote()" />
99
</li>`,
10-
styleUrls: ['./note-list-item.component.less'],
11-
changeDetection: ChangeDetectionStrategy.OnPush
10+
styleUrls: ['./note-list-item.component.less'],
11+
changeDetection: ChangeDetectionStrategy.OnPush,
12+
standalone: false
1213
})
1314
export class NoteListItemComponent {
1415

src/app/note-list/note-list.component.spec.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,10 @@ describe('NoteListComponent', () => {
1111
let component: NoteListComponent;
1212
let fixture: ComponentFixture<NoteListComponent>;
1313

14-
@Component({ selector: 'app-note-list-item', template: '' })
14+
@Component({
15+
selector: 'app-note-list-item', template: '',
16+
standalone: false
17+
})
1518
class MockNoteListItemComponent {
1619
@Input() note!: Note;
1720
@Input() isSelected!: boolean;

src/app/note-list/note-list.component.ts

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -2,17 +2,20 @@ import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from
22
import { Note } from '../note';
33

44
@Component({
5-
selector: 'app-note-list',
6-
template: `<ol>
7-
<app-note-list-item *ngFor="let note of notes"
8-
[note]="note"
9-
[isSelected]="note === selectedNote"
10-
(click)="selectNote(note)"
11-
(keypress)="selectNote(note)"
12-
(noteDeleted)="deleteNote(note)" />
13-
</ol>`,
14-
styles: [],
15-
changeDetection: ChangeDetectionStrategy.OnPush
5+
selector: 'app-note-list',
6+
template: `<ol>
7+
@for (note of notes; track note) {
8+
<app-note-list-item
9+
[note]="note"
10+
[isSelected]="note === selectedNote"
11+
(click)="selectNote(note)"
12+
(keypress)="selectNote(note)"
13+
(noteDeleted)="deleteNote(note)" />
14+
}
15+
</ol>`,
16+
styles: [],
17+
changeDetection: ChangeDetectionStrategy.OnPush,
18+
standalone: false
1619
})
1720
export class NoteListComponent {
1821

0 commit comments

Comments
 (0)