diff --git a/src/app/app.routing.ts b/src/app/app.routing.ts index 53889dbd..3ba68017 100644 --- a/src/app/app.routing.ts +++ b/src/app/app.routing.ts @@ -12,9 +12,9 @@ export const appRoutes: Route[] = [ // Redirect empty path to '/dashboards/project' {path: '', pathMatch : 'full', redirectTo: 'dashboards/project'}, - // Redirect signed in user to the '/dashboards/project' + // Redirect signed-in user to the '/dashboards/project' // - // After the user signs in, the sign in page will redirect the user to the 'signed-in-redirect' + // After the user signs in, the sign-in page will redirect the user to the 'signed-in-redirect' // path. Below is another redirection for that path to redirect the user to the desired // location. This is a small convenience to keep all main routes together here on this file. {path: 'signed-in-redirect', pathMatch : 'full', redirectTo: 'dashboards/project'}, @@ -22,8 +22,7 @@ export const appRoutes: Route[] = [ // Auth routes for guests { path: '', - canActivate: [NoAuthGuard], - canActivateChild: [NoAuthGuard], + canMatch: [NoAuthGuard], component: LayoutComponent, data: { layout: 'empty' @@ -40,8 +39,7 @@ export const appRoutes: Route[] = [ // Auth routes for authenticated users { path: '', - canActivate: [AuthGuard], - canActivateChild: [AuthGuard], + canMatch: [AuthGuard], component: LayoutComponent, data: { layout: 'empty' @@ -55,25 +53,24 @@ export const appRoutes: Route[] = [ // Landing routes { path: '', - component : LayoutComponent, + component: LayoutComponent, data: { layout: 'empty' }, - children : [ + children: [ {path: 'home', loadChildren: () => import('app/modules/landing/home/home.module').then(m => m.LandingHomeModule)}, ] }, // Admin routes { - path : '', - canActivate: [AuthGuard], - canActivateChild: [AuthGuard], - component : LayoutComponent, - resolve : { + path: '', + canMatch: [AuthGuard], + component: LayoutComponent, + resolve: { initialData: InitialDataResolver, }, - children : [ + children: [ // Dashboards {path: 'dashboards', children: [ diff --git a/src/app/core/auth/guards/auth.guard.ts b/src/app/core/auth/guards/auth.guard.ts index cefaf1a2..24d7e89d 100644 --- a/src/app/core/auth/guards/auth.guard.ts +++ b/src/app/core/auth/guards/auth.guard.ts @@ -1,12 +1,12 @@ import { Injectable } from '@angular/core'; -import { ActivatedRouteSnapshot, CanActivate, CanActivateChild, CanLoad, Route, Router, RouterStateSnapshot, UrlSegment, UrlTree } from '@angular/router'; +import { CanMatch, Route, Router, UrlSegment, UrlTree } from '@angular/router'; import { Observable, of, switchMap } from 'rxjs'; import { AuthService } from 'app/core/auth/auth.service'; @Injectable({ providedIn: 'root' }) -export class AuthGuard implements CanActivate, CanActivateChild, CanLoad +export class AuthGuard implements CanMatch { /** * Constructor @@ -23,38 +23,14 @@ export class AuthGuard implements CanActivate, CanActivateChild, CanLoad // ----------------------------------------------------------------------------------------------------- /** - * Can activate - * - * @param route - * @param state - */ - canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable | Promise | boolean - { - const redirectUrl = state.url === '/sign-out' ? '/' : state.url; - return this._check(redirectUrl); - } - - /** - * Can activate child - * - * @param childRoute - * @param state - */ - canActivateChild(childRoute: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable | Promise | boolean | UrlTree - { - const redirectUrl = state.url === '/sign-out' ? '/' : state.url; - return this._check(redirectUrl); - } - - /** - * Can load + * Can match * * @param route * @param segments */ - canLoad(route: Route, segments: UrlSegment[]): Observable | Promise | boolean + canMatch(route: Route, segments: UrlSegment[]): Observable | Promise | boolean | UrlTree { - return this._check('/'); + return this._check(segments); } // ----------------------------------------------------------------------------------------------------- @@ -64,29 +40,28 @@ export class AuthGuard implements CanActivate, CanActivateChild, CanLoad /** * Check the authenticated status * - * @param redirectURL + * @param segments * @private */ - private _check(redirectURL: string): Observable + private _check(segments: UrlSegment[]): Observable { // Check the authentication status - return this._authService.check() - .pipe( - switchMap((authenticated) => { + return this._authService.check().pipe( + switchMap((authenticated) => { - // If the user is not authenticated... - if ( !authenticated ) - { - // Redirect to the sign-in page - this._router.navigate(['sign-in'], {queryParams: {redirectURL}}); + // If the user is not authenticated... + if ( !authenticated ) + { + // Redirect to the sign-in page with a redirectUrl param + const redirectURL = `/${segments.join('/')}`; + const urlTree = this._router.parseUrl(`sign-in?redirectURL=${redirectURL}`); - // Prevent the access - return of(false); - } + return of(urlTree); + } - // Allow the access - return of(true); - }) - ); + // Allow the access + return of(true); + }) + ); } } diff --git a/src/app/core/auth/guards/noAuth.guard.ts b/src/app/core/auth/guards/noAuth.guard.ts index d54b68d6..a996d74e 100644 --- a/src/app/core/auth/guards/noAuth.guard.ts +++ b/src/app/core/auth/guards/noAuth.guard.ts @@ -1,12 +1,12 @@ import { Injectable } from '@angular/core'; -import { ActivatedRouteSnapshot, CanActivate, CanActivateChild, CanLoad, Route, Router, RouterStateSnapshot, UrlSegment, UrlTree } from '@angular/router'; +import { CanMatch, Route, Router, UrlSegment, UrlTree } from '@angular/router'; import { Observable, of, switchMap } from 'rxjs'; import { AuthService } from 'app/core/auth/auth.service'; @Injectable({ providedIn: 'root' }) -export class NoAuthGuard implements CanActivate, CanActivateChild, CanLoad +export class NoAuthGuard implements CanMatch { /** * Constructor @@ -23,34 +23,12 @@ export class NoAuthGuard implements CanActivate, CanActivateChild, CanLoad // ----------------------------------------------------------------------------------------------------- /** - * Can activate - * - * @param route - * @param state - */ - canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable | Promise | boolean - { - return this._check(); - } - - /** - * Can activate child - * - * @param childRoute - * @param state - */ - canActivateChild(childRoute: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable | Promise | boolean | UrlTree - { - return this._check(); - } - - /** - * Can load + * Can match * * @param route * @param segments */ - canLoad(route: Route, segments: UrlSegment[]): Observable | Promise | boolean + canMatch(route: Route, segments: UrlSegment[]): Observable | Promise | boolean | UrlTree { return this._check(); } @@ -66,24 +44,10 @@ export class NoAuthGuard implements CanActivate, CanActivateChild, CanLoad */ private _check(): Observable { - // Check the authentication status - return this._authService.check() - .pipe( - switchMap((authenticated) => { - - // If the user is authenticated... - if ( authenticated ) - { - // Redirect to the root - this._router.navigate(['']); - - // Prevent the access - return of(false); - } - - // Allow the access - return of(true); - }) - ); + // Check the authentication status and return an observable of + // "true" or "false" to allow or prevent the access + return this._authService.check().pipe( + switchMap((authenticated) => of(!authenticated)) + ); } }