| @@ -13,8 +13,10 @@ export class AuthGuard implements CanActivate { | |||||
| constructor(private store: Store<fromApp.AppState>) {} | constructor(private store: Store<fromApp.AppState>) {} | ||||
| canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) { | canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) { | ||||
| return this.store.select('auth').map((authState: fromAuth.State) => { | |||||
| return authState.authenticated; | |||||
| }); | |||||
| return this.store.select('auth') | |||||
| .take(1) | |||||
| .map((authState: fromAuth.State) => { | |||||
| return authState.authenticated; | |||||
| }); | |||||
| } | } | ||||
| } | } | ||||
| @@ -1,56 +0,0 @@ | |||||
| import * as firebase from 'firebase'; | |||||
| import { Router } from '@angular/router'; | |||||
| import { Injectable } from '@angular/core'; | |||||
| import { Store } from '@ngrx/store'; | |||||
| import * as fromApp from '../ngrx/app.reducers'; | |||||
| import * as AuthActions from './ngrx/auth.actions'; | |||||
| @Injectable() | |||||
| export class AuthService { | |||||
| constructor(private router: Router, private store: Store<fromApp.AppState>) {} | |||||
| signupUser(email: string, password: string) { | |||||
| firebase.auth().createUserWithEmailAndPassword(email, password) | |||||
| .then( | |||||
| user => { | |||||
| firebase.auth().currentUser.getIdToken() | |||||
| .then( | |||||
| (token: string) => { | |||||
| this.store.dispatch(new AuthActions.SetToken(token)); | |||||
| } | |||||
| ); | |||||
| this.store.dispatch(new AuthActions.Signup()); | |||||
| this.router.navigate(['/']); | |||||
| } | |||||
| ) | |||||
| .catch( | |||||
| error => console.log(error) | |||||
| ); | |||||
| } | |||||
| signinUser(email: string, password: string) { | |||||
| firebase.auth().signInWithEmailAndPassword(email, password) | |||||
| .then( | |||||
| response => { | |||||
| firebase.auth().currentUser.getIdToken() | |||||
| .then( | |||||
| (token: string) => { | |||||
| this.store.dispatch(new AuthActions.SetToken(token)); | |||||
| } | |||||
| ); | |||||
| this.store.dispatch(new AuthActions.Signin()); | |||||
| this.router.navigate(['/']); | |||||
| } | |||||
| ) | |||||
| .catch( | |||||
| error => console.log(error) | |||||
| ); | |||||
| } | |||||
| logout() { | |||||
| firebase.auth().signOut(); | |||||
| this.store.dispatch(new AuthActions.Logout()); | |||||
| this.router.navigate(['/']); | |||||
| } | |||||
| } | |||||
| @@ -2,6 +2,7 @@ import { Injectable } from '@angular/core'; | |||||
| import { Router } from '@angular/router'; | import { Router } from '@angular/router'; | ||||
| import { Actions, Effect } from '@ngrx/effects'; | import { Actions, Effect } from '@ngrx/effects'; | ||||
| import 'rxjs/add/operator/map'; | import 'rxjs/add/operator/map'; | ||||
| import 'rxjs/add/operator/do'; | |||||
| import 'rxjs/add/operator/switchMap'; | import 'rxjs/add/operator/switchMap'; | ||||
| import 'rxjs/add/operator/mergeMap'; | import 'rxjs/add/operator/mergeMap'; | ||||
| import { fromPromise } from 'rxjs/observable/fromPromise'; | import { fromPromise } from 'rxjs/observable/fromPromise'; | ||||
| @@ -50,6 +51,12 @@ export class AuthEffects { | |||||
| ] | ] | ||||
| }); | }); | ||||
| @Effect({dispatch: false}) | |||||
| authLogout = this.actions$.ofType(AuthActions.LOGOUT) | |||||
| .do(() => { | |||||
| this.router.navigate(['/']); | |||||
| }); | |||||
| // variable with dollar sign at the end marks an observable | // variable with dollar sign at the end marks an observable | ||||
| constructor(private router: Router, private actions$: Actions) {} | constructor(private router: Router, private actions$: Actions) {} | ||||
| } | } | ||||
| @@ -7,7 +7,6 @@ import { SharedModule } from "../shared/shared.module"; | |||||
| import { AppRoutingModule } from "../app-routing.module"; | import { AppRoutingModule } from "../app-routing.module"; | ||||
| import { RecipeService } from "../recipes/recipe.service"; | import { RecipeService } from "../recipes/recipe.service"; | ||||
| import { DataStorageService } from "../shared/data-storage.service"; | import { DataStorageService } from "../shared/data-storage.service"; | ||||
| import { AuthService } from "../auth/auth.service"; | |||||
| import { AuthInterceptor } from "../shared/auth.interceptor"; | import { AuthInterceptor } from "../shared/auth.interceptor"; | ||||
| import { LoggingInterceptor } from "../shared/logging.interceptor"; | import { LoggingInterceptor } from "../shared/logging.interceptor"; | ||||
| @@ -27,7 +26,6 @@ import { LoggingInterceptor } from "../shared/logging.interceptor"; | |||||
| providers: [ | providers: [ | ||||
| RecipeService, | RecipeService, | ||||
| DataStorageService, | DataStorageService, | ||||
| AuthService, | |||||
| {provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true}, | {provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true}, | ||||
| {provide: HTTP_INTERCEPTORS, useClass: LoggingInterceptor, multi: true} | {provide: HTTP_INTERCEPTORS, useClass: LoggingInterceptor, multi: true} | ||||
| ], | ], | ||||
| @@ -3,9 +3,9 @@ import { Store } from "@ngrx/store"; | |||||
| import { Observable } from "rxjs/Observable"; | import { Observable } from "rxjs/Observable"; | ||||
| import { DataStorageService } from "../../shared/data-storage.service"; | import { DataStorageService } from "../../shared/data-storage.service"; | ||||
| import { AuthService } from "../../auth/auth.service"; | |||||
| import * as fromApp from '../../ngrx/app.reducers'; | import * as fromApp from '../../ngrx/app.reducers'; | ||||
| import * as fromAuth from '../../auth/ngrx/auth.reducers'; | import * as fromAuth from '../../auth/ngrx/auth.reducers'; | ||||
| import * as AuthActions from '../../auth/ngrx/auth.actions'; | |||||
| @Component({ | @Component({ | ||||
| selector: 'app-header', | selector: 'app-header', | ||||
| @@ -14,9 +14,7 @@ import * as fromAuth from '../../auth/ngrx/auth.reducers'; | |||||
| export class HeaderComponent implements OnInit { | export class HeaderComponent implements OnInit { | ||||
| authState: Observable<fromAuth.State>; | authState: Observable<fromAuth.State>; | ||||
| constructor(private dataStorageService: DataStorageService, | |||||
| private authService: AuthService, | |||||
| private store: Store<fromApp.AppState>) {} | |||||
| constructor(private dataStorageService: DataStorageService, private store: Store<fromApp.AppState>) {} | |||||
| ngOnInit() { | ngOnInit() { | ||||
| this.authState = this.store.select('auth') | this.authState = this.store.select('auth') | ||||
| @@ -35,6 +33,6 @@ export class HeaderComponent implements OnInit { | |||||
| } | } | ||||
| onLogout() { | onLogout() { | ||||
| this.authService.logout(); | |||||
| this.store.dispatch(new AuthActions.Logout()); | |||||
| } | } | ||||
| } | } | ||||