From 4c1c0c08cc943a15463705d5f2e316e250665ad1 Mon Sep 17 00:00:00 2001 From: Akshay Date: Fri, 1 Apr 2022 18:38:06 +0530 Subject: [PATCH 1/5] common structure --- src/app/app-routing.module.ts | 3 +++ src/app/app.module.ts | 8 +++++++- 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 1e0d9ec..44b8c1b 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -1,11 +1,14 @@ import { NgModule } from '@angular/core'; import { RouterModule, Routes } from '@angular/router'; +import { AuthGuard } from './auth/auth.guard'; import { HomeComponent } from './home/home.component'; import { NonAuthenticatedComponent } from './non-authenticated/non-authenticated.component'; +import { UsersComponent } from './users/users.component'; const routes: Routes = [ { path: '', pathMatch: 'full', redirectTo: 'home' }, { path: 'home', component: HomeComponent }, + { path: 'users', canActivate: [AuthGuard], component: UsersComponent }, { path: 'non-auth', component: NonAuthenticatedComponent }, ]; diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 3e3d8b6..4b2580b 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -5,11 +5,17 @@ import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { AngularMaterialModule } from './angular-material/angular-material.module'; +import { UsersComponent } from './users/users.component'; import { NonAuthenticatedComponent } from './non-authenticated/non-authenticated.component'; import { HomeComponent } from './home/home.component'; @NgModule({ - declarations: [AppComponent, NonAuthenticatedComponent, HomeComponent], + declarations: [ + AppComponent, + UsersComponent, + NonAuthenticatedComponent, + HomeComponent, + ], imports: [ AngularMaterialModule, AppRoutingModule, From ab62b1fc21fc94e4e57202bbc289a19853ed64c2 Mon Sep 17 00:00:00 2001 From: Akshay Date: Fri, 1 Apr 2022 18:38:22 +0530 Subject: [PATCH 2/5] fixes Implement CanActivate guard #3 --- src/app/auth/auth.guard.spec.ts | 16 ++++++++++++++++ src/app/auth/auth.guard.ts | 27 +++++++++++++++++++++++++++ src/app/users/users.component.spec.ts | 25 +++++++++++++++++++++++++ src/app/users/users.component.ts | 17 +++++++++++++++++ 4 files changed, 85 insertions(+) create mode 100644 src/app/auth/auth.guard.spec.ts create mode 100644 src/app/auth/auth.guard.ts create mode 100644 src/app/users/users.component.spec.ts create mode 100644 src/app/users/users.component.ts diff --git a/src/app/auth/auth.guard.spec.ts b/src/app/auth/auth.guard.spec.ts new file mode 100644 index 0000000..68889d2 --- /dev/null +++ b/src/app/auth/auth.guard.spec.ts @@ -0,0 +1,16 @@ +import { TestBed } from '@angular/core/testing'; + +import { AuthGuard } from './auth.guard'; + +describe('AuthGuard', () => { + let guard: AuthGuard; + + beforeEach(() => { + TestBed.configureTestingModule({}); + guard = TestBed.inject(AuthGuard); + }); + + it('should be created', () => { + expect(guard).toBeTruthy(); + }); +}); diff --git a/src/app/auth/auth.guard.ts b/src/app/auth/auth.guard.ts new file mode 100644 index 0000000..146f552 --- /dev/null +++ b/src/app/auth/auth.guard.ts @@ -0,0 +1,27 @@ +import { Injectable } from '@angular/core'; +import { CanActivate, Router, UrlTree } from '@angular/router'; +import { Observable } from 'rxjs'; +import { tap } from 'rxjs/operators'; +import { AuthService } from './auth.service'; + +@Injectable({ + providedIn: 'root', +}) +export class AuthGuard implements CanActivate { + constructor( + private readonly authService: AuthService, + private readonly router: Router + ) {} + + canActivate(): + | Observable + | Promise + | boolean + | UrlTree { + return this.authService.isLoggedIn$.pipe( + tap((isLoggedIn) => + isLoggedIn ? true : this.router.navigate(['non-auth']) + ) + ); + } +} diff --git a/src/app/users/users.component.spec.ts b/src/app/users/users.component.spec.ts new file mode 100644 index 0000000..2d6432f --- /dev/null +++ b/src/app/users/users.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { UsersComponent } from './users.component'; + +describe('UsersComponent', () => { + let component: UsersComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ UsersComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(UsersComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/users/users.component.ts b/src/app/users/users.component.ts new file mode 100644 index 0000000..fbcfa02 --- /dev/null +++ b/src/app/users/users.component.ts @@ -0,0 +1,17 @@ +import { ChangeDetectionStrategy, Component } from '@angular/core'; + +@Component({ + selector: 'app-users', + template: ` + +

Users

+

+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Adipisci hic + libero ratione soluta consequuntur quam illum exercitationem aut maiores + voluptatem minus quisquam in, eos, et aperiam error ducimus cum officia? +

+ + `, + changeDetection: ChangeDetectionStrategy.OnPush, +}) +export class UsersComponent {} From 95ad3ac5f7905d5ffc6991f2a5e374935528bea8 Mon Sep 17 00:00:00 2001 From: Akshay Date: Sat, 2 Apr 2022 13:42:23 +0530 Subject: [PATCH 3/5] typo fixed --- src/app/non-authenticated/non-authenticated.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/non-authenticated/non-authenticated.component.ts b/src/app/non-authenticated/non-authenticated.component.ts index 6507dbc..40593d3 100644 --- a/src/app/non-authenticated/non-authenticated.component.ts +++ b/src/app/non-authenticated/non-authenticated.component.ts @@ -3,7 +3,7 @@ import { Component, ChangeDetectionStrategy } from '@angular/core'; @Component({ selector: 'app-non-authenticated', template: ` - You are not Authenticated to view that Route + You are not Authenticated to view this Route `, changeDetection: ChangeDetectionStrategy.OnPush, }) From 7734003967b01929358fa12d9c5183bb0832057b Mon Sep 17 00:00:00 2001 From: Akshay Date: Sat, 2 Apr 2022 14:12:39 +0530 Subject: [PATCH 4/5] Navigation tab name updated --- src/app/app.component.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/app.component.html b/src/app/app.component.html index bf4278e..c3bdf10 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -2,7 +2,7 @@ {{ title }} - +