-
Notifications
You must be signed in to change notification settings - Fork 73
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* fix logout issue by redirecting user to login page * add todo create component * finish todo components * add task create and task list * don't allow deleting a todo if it has existing tasks * refresh todo after a delete * add error interceptor
- Loading branch information
Showing
36 changed files
with
851 additions
and
18 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
export interface DoAction { | ||
type: string; | ||
payload: any; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -3,3 +3,4 @@ | |
*/ | ||
|
||
export * from './lib/app-common.module'; | ||
export * from './lib/action'; |
4 changes: 2 additions & 2 deletions
4
todo-client/projects/auth/src/lib/components/login/login.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
44 changes: 44 additions & 0 deletions
44
todo-client/projects/auth/src/lib/services/error.interceptor.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,44 @@ | ||
import { Injectable } from '@angular/core'; | ||
import { | ||
HttpInterceptor, | ||
HttpRequest, | ||
HttpHandler, | ||
HttpEvent, | ||
HttpErrorResponse, | ||
HTTP_INTERCEPTORS | ||
} from '@angular/common/http'; | ||
import { Observable, throwError } from 'rxjs'; | ||
import { catchError } from 'rxjs/operators'; | ||
import { AuthService } from './auth.service'; | ||
|
||
@Injectable() | ||
export class ErrorInterceptor implements HttpInterceptor { | ||
constructor(private authService: AuthService) {} | ||
|
||
intercept( | ||
request: HttpRequest<any>, | ||
next: HttpHandler | ||
): Observable<HttpEvent<any>> { | ||
return next.handle(request).pipe( | ||
catchError((err: HttpErrorResponse) => { | ||
if (err.status === 401 && !window.location.href.includes('/login')) { | ||
// auto logout if 401 response returned from api | ||
this.authService.logout(); | ||
location.reload(); | ||
} | ||
|
||
const error = err.error.error || err.error.message || err.statusText; | ||
|
||
alert(error); | ||
|
||
return throwError(error); | ||
}) | ||
); | ||
} | ||
} | ||
|
||
export const errorInterceptorProvider = { | ||
provide: HTTP_INTERCEPTORS, | ||
useClass: ErrorInterceptor, | ||
multi: true | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,24 @@ | ||
# Todo | ||
|
||
This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 8.1.3. | ||
|
||
## Code scaffolding | ||
|
||
Run `ng generate component component-name --project todo` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project todo`. | ||
> Note: Don't forget to add `--project todo` or else it will be added to the default project in your `angular.json` file. | ||
## Build | ||
|
||
Run `ng build todo` to build the project. The build artifacts will be stored in the `dist/` directory. | ||
|
||
## Publishing | ||
|
||
After building your library with `ng build todo`, go to the dist folder `cd dist/todo` and run `npm publish`. | ||
|
||
## Running unit tests | ||
|
||
Run `ng test todo` to execute the unit tests via [Karma](https://karma-runner.github.io). | ||
|
||
## Further help | ||
|
||
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md). |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,32 @@ | ||
// Karma configuration file, see link for more information | ||
// https://karma-runner.github.io/1.0/config/configuration-file.html | ||
|
||
module.exports = function (config) { | ||
config.set({ | ||
basePath: '', | ||
frameworks: ['jasmine', '@angular-devkit/build-angular'], | ||
plugins: [ | ||
require('karma-jasmine'), | ||
require('karma-chrome-launcher'), | ||
require('karma-jasmine-html-reporter'), | ||
require('karma-coverage-istanbul-reporter'), | ||
require('@angular-devkit/build-angular/plugins/karma') | ||
], | ||
client: { | ||
clearContext: false // leave Jasmine Spec Runner output visible in browser | ||
}, | ||
coverageIstanbulReporter: { | ||
dir: require('path').join(__dirname, '../../coverage/todo'), | ||
reports: ['html', 'lcovonly', 'text-summary'], | ||
fixWebpackSourcePaths: true | ||
}, | ||
reporters: ['progress', 'kjhtml'], | ||
port: 9876, | ||
colors: true, | ||
logLevel: config.LOG_INFO, | ||
autoWatch: true, | ||
browsers: ['Chrome'], | ||
singleRun: false, | ||
restartOnFileChange: true | ||
}); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
{ | ||
"$schema": "../../node_modules/ng-packagr/ng-package.schema.json", | ||
"dest": "../../dist/todo", | ||
"lib": { | ||
"entryFile": "src/public-api.ts" | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
{ | ||
"name": "todo", | ||
"version": "0.0.1", | ||
"peerDependencies": { | ||
"@angular/common": "^8.1.3", | ||
"@angular/core": "^8.1.3" | ||
} | ||
} |
33 changes: 33 additions & 0 deletions
33
todo-client/projects/todo/src/lib/components/task-create/task-create.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,33 @@ | ||
import { Component, OnInit, EventEmitter, Output } from '@angular/core'; | ||
import { DoAction } from 'projects/app-common/src/public-api'; | ||
|
||
@Component({ | ||
selector: 'lib-task-create', | ||
template: ` | ||
<div class="row my-2 mb-4"> | ||
<div class="col-md-8 offset-md-2"> | ||
<input | ||
[(ngModel)]="task" | ||
(keyup.enter)="OnEnter()" | ||
class="form-control" | ||
placeholder="Type a Task and hit (Enter)" | ||
/> | ||
</div> | ||
</div> | ||
` | ||
}) | ||
export class TaskCreateComponent implements OnInit { | ||
public task = ''; | ||
|
||
@Output() | ||
public action: EventEmitter<DoAction> = new EventEmitter(); | ||
|
||
constructor() {} | ||
|
||
ngOnInit() {} | ||
|
||
public OnEnter() { | ||
this.action.emit({ type: 'add-task', payload: this.task }); | ||
this.task = ''; | ||
} | ||
} |
67 changes: 67 additions & 0 deletions
67
todo-client/projects/todo/src/lib/components/task-list/task-list.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,67 @@ | ||
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; | ||
import { DoAction } from 'projects/app-common/src/public-api'; | ||
import { Task } from '../../models/task.model'; | ||
|
||
@Component({ | ||
selector: 'lib-task-list', | ||
template: ` | ||
<div *ngIf="!tasks?.length; else show"><p>No tasks yet!</p></div> | ||
<ng-template #show> | ||
<div class="list-group"> | ||
<div | ||
*ngFor="let task of tasks; let i = index; trackBy: trackByFn" | ||
class="tasks" | ||
> | ||
<div class="action"> | ||
<button | ||
(click)="doAction(task)" | ||
class="btn btn-danger btn-lg" | ||
title="Delete {{ task?.name }}" | ||
> | ||
<i class="fa fa-trash"></i> | ||
</button> | ||
</div> | ||
<div class="task"> | ||
<div class="list-group-item">({{ i + 1 }}) {{ task?.name }}</div> | ||
</div> | ||
</div> | ||
</div> | ||
</ng-template> | ||
`, | ||
styles: [ | ||
` | ||
.tasks { | ||
display: flex; | ||
justify-content: center; | ||
} | ||
.tasks .task { | ||
flex-grow: 1; | ||
flex-shrink: 0; | ||
} | ||
.tasks .action { | ||
margin-right: 5px; | ||
} | ||
` | ||
] | ||
}) | ||
export class TaskListComponent implements OnInit { | ||
@Input() | ||
public tasks: Task[]; | ||
|
||
@Output() | ||
public action: EventEmitter<DoAction> = new EventEmitter(); | ||
|
||
constructor() {} | ||
|
||
ngOnInit() {} | ||
|
||
public trackByFn(index: number, item: Task) { | ||
return index; | ||
} | ||
|
||
public doAction(task: Task): void { | ||
this.action.emit({ type: 'delete-task', payload: task }); | ||
} | ||
} |
Oops, something went wrong.