diff --git a/docs/auth/router-guards.md b/docs/auth/router-guards.md index 841eb306b..5aa901ca6 100644 --- a/docs/auth/router-guards.md +++ b/docs/auth/router-guards.md @@ -80,7 +80,7 @@ import { customClaims } from '@angular/fire/auth-guard'; // This pipe will only allow users with the editor role to access the route // { path: 'articles/:id/edit', component: ArticleEditComponent, ...canActivate(editorOnly) } -const editorOnly = () => pipe(customClaims, map(claims => claims.role === "editor")); +const editorOnly = () => pipe(customClaims, map(claims => claims.role === 'editor')); ``` ### Using router state @@ -98,5 +98,5 @@ const onlyAllowSelf = (next) => map(user => !!user && next.params.userId === use // Only allow navigation to the route if the user has a custom claim matching :accountId // { path: 'accounts/:accountId/billing', component: BillingDetailsComponent, ...canActivate(accountAdmin) } -const accountAdmin = (next) => pipe(customClaims, map(claims => claims[`account-${next.params.accountId}-role`] === "admin")); +const accountAdmin = (next) => pipe(customClaims, map(claims => claims[`account-${next.params.accountId}-role`] === 'admin')); ``` diff --git a/src/auth-guard/auth-guard.ts b/src/auth-guard/auth-guard.ts index 2389fc08f..b2156b7f6 100644 --- a/src/auth-guard/auth-guard.ts +++ b/src/auth-guard/auth-guard.ts @@ -14,7 +14,7 @@ import { } from '@angular/fire'; export type AuthPipeGenerator = (next: ActivatedRouteSnapshot, state: RouterStateSnapshot) => AuthPipe; -export type AuthPipe = UnaryFunction, Observable>; +export type AuthPipe = UnaryFunction, Observable>; export const loggedIn: AuthPipe = map(user => !!user); @@ -54,14 +54,23 @@ export class AngularFireAuthGuard implements CanActivate { return this.authState.pipe( take(1), authPipeFactory(next, state), - map(can => typeof can === 'boolean' ? can : this.router.createUrlTree(can as any[])) + map(can => { + if (typeof can === 'boolean') { + return can; + } else if (Array.isArray(can)) { + return this.router.createUrlTree(can); + } else { + // TODO(EdricChan03): Add tests + return this.router.parseUrl(can); + } + }) ); } } export const canActivate = (pipe: AuthPipeGenerator) => ({ - canActivate: [ AngularFireAuthGuard ], data: { authGuardPipe: pipe } + canActivate: [ AngularFireAuthGuard ], data: { authGuardPipe: pipe } }); @@ -71,7 +80,7 @@ export const emailVerified: AuthPipe = map(user => !!user && user.emailVerified) export const customClaims = pipe(idTokenResult, map(idTokenResult => idTokenResult ? idTokenResult.claims : [])); export const hasCustomClaim: (claim: string) => AuthPipe = (claim) => pipe(customClaims, map(claims => claims.hasOwnProperty(claim))); -export const redirectUnauthorizedTo: (redirect: any[]) => AuthPipe = +export const redirectUnauthorizedTo: (redirect: string|any[]) => AuthPipe = (redirect) => pipe(loggedIn, map(loggedIn => loggedIn || redirect)); -export const redirectLoggedInTo: (redirect: any[]) => AuthPipe = +export const redirectLoggedInTo: (redirect: string|any[]) => AuthPipe = (redirect) => pipe(loggedIn, map(loggedIn => loggedIn && redirect || true));