Skip to content

Commit af867a1

Browse files
hantsyhantsy
committed
clean codes
1 parent 5ac0f69 commit af867a1

File tree

14 files changed

+329
-200
lines changed

14 files changed

+329
-200
lines changed

‎ui/apps/todolist/project.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,8 @@
6565
"buildTarget": "todolist:build:development"
6666
}
6767
},
68-
"defaultConfiguration": "development"
68+
"defaultConfiguration": "development",
69+
"continuous": true
6970
},
7071
"extract-i18n": {
7172
"executor": "@angular-devkit/build-angular:extract-i18n",

‎ui/apps/todolist/src/app/app.component.html‎

Lines changed: 36 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -27,51 +27,53 @@
2727
</div>
2828

2929
<mat-nav-list>
30-
<a mat-list-item *ngFor="let link of links" [routerLink]="[link.path]">
31-
<mat-icon matListIcon>{{link.icon}}</mat-icon>
32-
<span>{{link.label}}</span>
33-
</a>
30+
@for (link of links; track link) {
31+
<a mat-list-item [routerLink]="[link.path]">
32+
<mat-icon matListIcon>{{link.icon}}</mat-icon>
33+
<span>{{link.label}}</span>
34+
</a>
35+
}
3436
</mat-nav-list>
3537
<!-- <mat-tab-group>
36-
<mat-tab label="Users">
37-
<mat-nav-list>
38-
<mat-list-item *ngFor="let user of users">
39-
<mat-icon matListAvatar svgIcon="avatars:{{user.avatar}}" class="avatar"></mat-icon>
40-
<span>{{user.name}}</span>
41-
</mat-list-item>
42-
</mat-nav-list>
43-
</mat-tab>
44-
<mat-tab label="Settings">
45-
<span>Settings</span>
46-
</mat-tab>
47-
</mat-tab-group> -->
48-
</mat-sidenav>
49-
<div class="content"
38+
<mat-tab label="Users">
39+
<mat-nav-list>
40+
<mat-list-item *ngFor="let user of users">
41+
<mat-icon matListAvatar svgIcon="avatars:{{user.avatar}}" class="avatar"></mat-icon>
42+
<span>{{user.name}}</span>
43+
</mat-list-item>
44+
</mat-nav-list>
45+
</mat-tab>
46+
<mat-tab label="Settings">
47+
<span>Settings</span>
48+
</mat-tab>
49+
</mat-tab-group> -->
50+
</mat-sidenav>
51+
<div class="content"
5052
fxFlex
5153
fxFlex.gt-sm="66"
5254
fxLayout="row space-around"
5355
fxLayoutGap="15px"
5456
fxLayout.sm="column"
5557
fxLayoutGap.sm="0px">
5658

57-
<!-- <mat-card fxFlex="80">
58-
<mat-icon svgIcon="avatars:{{selectedUser.avatar}}" class="avatar"></mat-icon>
59-
<h2>{{selectedUser.name}}</h2>
60-
<p>{{selectedUser.details}}</p>
61-
</mat-card>
59+
<!-- <mat-card fxFlex="80">
60+
<mat-icon svgIcon="avatars:{{selectedUser.avatar}}" class="avatar"></mat-icon>
61+
<h2>{{selectedUser.name}}</h2>
62+
<p>{{selectedUser.details}}</p>
63+
</mat-card>
6264
63-
<mat-card fxFlex fxLayout="column" fxLayoutGap="14px">
64-
<mat-slide-toggle [(ngModel)]="selectedUser.isAdmin">Is Admin?</mat-slide-toggle>
65-
<mat-slide-toggle [(ngModel)]="selectedUser.isCool">Is Cool?</mat-slide-toggle>
66-
</mat-card> -->
67-
<router-outlet fxFlex>
68-
</router-outlet>
65+
<mat-card fxFlex fxLayout="column" fxLayoutGap="14px">
66+
<mat-slide-toggle [(ngModel)]="selectedUser.isAdmin">Is Admin?</mat-slide-toggle>
67+
<mat-slide-toggle [(ngModel)]="selectedUser.isCool">Is Cool?</mat-slide-toggle>
68+
</mat-card> -->
69+
<router-outlet fxFlex>
70+
</router-outlet>
6971

70-
</div>
71-
</mat-sidenav-container>
72-
<mat-menu #themeMenu x-position="before">
73-
<button mat-menu-item (click)="isDarkTheme = !isDarkTheme">Toggle Theme</button>
74-
</mat-menu>
72+
</div>
73+
</mat-sidenav-container>
74+
<mat-menu #themeMenu x-position="before">
75+
<button mat-menu-item (click)="isDarkTheme = !isDarkTheme">Toggle Theme</button>
76+
</mat-menu>
7577

7678

7779
</div>

‎ui/apps/todolist/src/app/auth/signin/signin.component.html‎

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -7,25 +7,33 @@
77
<input type="text" matInput #userControl="ngModel" placeholder="Username" type="text" maxlength="30" name="username" [(ngModel)]="username"
88
required>
99
</mat-form-field>
10-
<mat-hint fxLayoutAlign="start" *ngIf="userControl.invalid && !userControl.pristine">
11-
<span *ngIf="passControl.hasError('required')" class="tc-red-600">username is required</span>
12-
</mat-hint>
10+
@if (userControl.invalid && !userControl.pristine) {
11+
<mat-hint fxLayoutAlign="start">
12+
@if (passControl.hasError('required')) {
13+
<span class="tc-red-600">username is required</span>
14+
}
15+
</mat-hint>
16+
}
1317
</p>
1418

1519
<p>
1620
<mat-form-field fxFlex>
1721
<input type="password" matInput #passControl="ngModel" placeholder="Password" type="password" name="password" [(ngModel)]="password"
1822
required>
19-
<mat-error fxLayoutAlign="start" *ngIf="passControl.hasError('required')">
20-
Password is <strong>Required</strong>.
21-
</mat-error>
23+
@if (passControl.hasError('required')) {
24+
<mat-error fxLayoutAlign="start">
25+
Password is <strong>Required</strong>.
26+
</mat-error>
27+
}
2228
</mat-form-field>
2329

2430
</p>
2531

26-
<p *ngIf="errorMessage" class="loginError">
27-
{{ errorMessage }}
28-
</p>
32+
@if (errorMessage) {
33+
<p class="loginError">
34+
{{ errorMessage }}
35+
</p>
36+
}
2937

3038
<p class="loginButtons">
3139
<button type="submit" color="accent" mat-button md-raised-button fxFlex [disabled]="loginForm.invalid||loginForm.pending">Login</button>

‎ui/apps/todolist/src/app/dialog/dialog.component.html‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,9 @@ <h3>Add User Dialog</h3>
55
<mat-icon svgIcon="avatars:{{selectedAvatar}}" class="avatar"></mat-icon>
66
<mat-form-field>
77
<mat-select name="avatar" fxFlex placeholder="Avatar" [(ngModel)]="selectedAvatar">
8-
<mat-option *ngFor="let avatar of avatars; let i = index;" [value]="avatar">Avatar - {{i + 1}}</mat-option>
8+
@for (avatar of avatars; track avatar; let i = $index) {
9+
<mat-option [value]="avatar">Avatar - {{i + 1}}</mat-option>
10+
}
911
</mat-select>
1012
</mat-form-field>
1113
</div>

‎ui/apps/todolist/src/app/http-client.spec.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,8 +24,8 @@ describe('HttpClient testing', () => {
2424
});
2525

2626
// Inject the http service and test controller for each test
27-
httpClient = TestBed.get(HttpClient);
28-
httpTestingController = TestBed.get(HttpTestingController);
27+
httpClient = TestBed.inject(HttpClient);
28+
httpTestingController = TestBed.inject(HttpTestingController);
2929
});
3030
afterEach(() => {
3131
// After every test, assert that there are no more pending requests.

‎ui/apps/todolist/src/app/post/post-details/comment/comment-form.component.html‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,12 @@
44
<mat-form-field fxFlex>
55
<textarea matInput name="content" id="content" [formControl]="content" rows="8" required>
66
</textarea>
7-
<mat-error align="start" *ngIf="content.hasError('required')">Comment is required</mat-error>
8-
<mat-error align="start" *ngIf="content.hasError('minlength')">At least 10 chars</mat-error>
7+
@if (content.hasError('required')) {
8+
<mat-error align="start">Comment is required</mat-error>
9+
}
10+
@if (content.hasError('minlength')) {
11+
<mat-error align="start">At least 10 chars</mat-error>
12+
}
913
</mat-form-field>
1014
</p>
1115
<p>

‎ui/apps/todolist/src/app/post/post-details/comment/comment-list.component.html‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
1-
<mat-nav-list *ngIf="comments">
2-
<app-comment-list-item [comment]="c" *ngFor="let c of comments"></app-comment-list-item>
3-
</mat-nav-list>
1+
@if (comments) {
2+
<mat-nav-list>
3+
@for (c of comments; track c) {
4+
<app-comment-list-item [comment]="c"></app-comment-list-item>
5+
}
6+
</mat-nav-list>
7+
}

‎ui/apps/todolist/src/app/post/post-list/post-list.component.html‎

Lines changed: 18 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,26 @@
1-
<mat-card fxFlex="50" *ngFor="let post of posts">
1+
@for (post of posts; track post) {
2+
<mat-card fxFlex="50">
23
<mat-card-header>
3-
<mat-card-title>
4-
<h1 class="mat-heading">{{post.title}}</h1>
5-
</mat-card-title>
6-
<mat-card-subtitle>{{post.author?.username||'user'}} &bull; {{post.createdDate|date:'short'}}</mat-card-subtitle>
4+
<mat-card-title>
5+
<h1 class="mat-heading">{{post.title}}</h1>
6+
</mat-card-title>
7+
<mat-card-subtitle>{{post.author?.username||'user'}} &bull; {{post.createdDate|date:'short'}}</mat-card-subtitle>
78
</mat-card-header>
89
<!-- <img matCardImage src="Card wide image source"> -->
910
<!-- <mat-card-content>
10-
Text content
11-
</mat-card-content> -->
12-
<mat-card-actions align="start">
13-
<a mat-button [routerLink]="['/post', 'edit', post.id]">
14-
edit
15-
</a>
16-
<a mat-button [routerLink]="['/post', 'view', post.id]">view</a>
17-
</mat-card-actions>
18-
<!-- <mat-card-footer>
19-
Footer
20-
</mat-card-footer> -->
11+
Text content
12+
</mat-card-content> -->
13+
<mat-card-actions align="start">
14+
<a mat-button [routerLink]="['/post', 'edit', post.id]">
15+
edit
16+
</a>
17+
<a mat-button [routerLink]="['/post', 'view', post.id]">view</a>
18+
</mat-card-actions>
19+
<!-- <mat-card-footer>
20+
Footer
21+
</mat-card-footer> -->
2122
</mat-card>
23+
}
2224
<button mat-fab (click)="addPost()" class="fab-bottom-right">
2325
<mat-icon>add</mat-icon>
2426
</button>

‎ui/apps/todolist/src/app/post/shared/post-form/post-form.component.html‎

Lines changed: 37 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,44 @@
11
<form id="form" #f="ngForm" name="form" class="form" (ngSubmit)="submit()">
2-
<p>
3-
<mat-form-field fxFlex>
4-
<input matInput
5-
id="title"
6-
name="title"
7-
#title="ngModel"
8-
[(ngModel)]="post.title"
9-
required/>
10-
<mat-error align="start" *ngIf="title.hasError('required')">
11-
Post Title is required
12-
</mat-error>
13-
</mat-form-field>
14-
</p>
152
<p>
16-
<mat-form-field fxFlex>
17-
<textarea matInput
18-
#content="ngModel"
19-
name="content"
20-
id="content"
21-
[(ngModel)]="post.content"
22-
rows="8"
23-
required
24-
minlength="10">
25-
</textarea>
26-
<mat-error align="start" *ngIf="content.hasError('required')">
27-
Post Content is required
28-
</mat-error>
29-
<mat-error align="start" *ngIf="content.hasError('minlength')">
30-
At least 10 chars
31-
</mat-error>
32-
</mat-form-field>
3+
<mat-form-field fxFlex>
4+
<input matInput
5+
id="title"
6+
name="title"
7+
#title="ngModel"
8+
[(ngModel)]="post.title"
9+
required/>
10+
@if (title.hasError('required')) {
11+
<mat-error align="start">
12+
Post Title is required
13+
</mat-error>
14+
}
15+
</mat-form-field>
3316
</p>
3417
<p>
35-
<button mat-button mat-raised-button color="primary" type="submit" [disabled]="f.invalid || f.pending"> {{'save'}}</button>
18+
<mat-form-field fxFlex>
19+
<textarea matInput
20+
#content="ngModel"
21+
name="content"
22+
id="content"
23+
[(ngModel)]="post.content"
24+
rows="8"
25+
required
26+
minlength="10">
27+
</textarea>
28+
@if (content.hasError('required')) {
29+
<mat-error align="start">
30+
Post Content is required
31+
</mat-error>
32+
}
33+
@if (content.hasError('minlength')) {
34+
<mat-error align="start">
35+
At least 10 chars
36+
</mat-error>
37+
}
38+
</mat-form-field>
39+
</p>
40+
<p>
41+
<button mat-button mat-raised-button color="primary" type="submit" [disabled]="f.invalid || f.pending"> {{'save'}}</button>
3642
</p>
3743

3844
</form>

‎ui/apps/todolist/src/app/post/shared/post.service.spec.ts‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -45,9 +45,9 @@ describe('Service: Post', () => {
4545

4646
// Inject the http, test controller, and service-under-test
4747
// as they will be referenced by each test.
48-
httpClient = TestBed.get(HttpClient);
49-
httpTestingController = TestBed.get(HttpTestingController);
50-
postService = TestBed.get(PostService);
48+
httpClient = TestBed.inject(HttpClient);
49+
httpTestingController = TestBed.inject(HttpTestingController);
50+
postService = TestBed.inject(PostService);
5151
});
5252

5353
afterEach(() => {
@@ -64,7 +64,7 @@ describe('Service: Post', () => {
6464

6565
beforeEach(() => {
6666
expectedPosts = posts;
67-
postService = TestBed.get(PostService);
67+
postService = TestBed.inject(PostService);
6868
});
6969

7070
it('should get posts...', () => {
@@ -116,7 +116,7 @@ describe('Service: Post', () => {
116116

117117
beforeEach(() => {
118118
expectedPost = posts[0];
119-
postService = TestBed.get(PostService);
119+
postService = TestBed.inject(PostService);
120120
});
121121

122122
it('should get post...', () => {
@@ -152,7 +152,7 @@ describe('Service: Post', () => {
152152

153153
beforeEach(() => {
154154
expectedPost = posts[0];
155-
postService = TestBed.get(PostService);
155+
postService = TestBed.inject(PostService);
156156
});
157157

158158
it('should save post...', () => {
@@ -174,7 +174,7 @@ describe('Service: Post', () => {
174174

175175
beforeEach(() => {
176176
expectedPost = posts[0];
177-
postService = TestBed.get(PostService);
177+
postService = TestBed.inject(PostService);
178178
});
179179

180180
it('should update post...', () => {
@@ -209,7 +209,7 @@ describe('Service: Post', () => {
209209

210210
beforeEach(() => {
211211
expectedPost = posts[0];
212-
postService = TestBed.get(PostService);
212+
postService = TestBed.inject(PostService);
213213
});
214214

215215
it('should delete post...', () => {

0 commit comments

Comments
 (0)