diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 55d8b72..cd2ab10 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -9,7 +9,7 @@ import { SharedModule } from './shared/shared.module'; import { ShoppingListModule } from './shopping-list/shopping-list.module'; import { AuthModule } from './auth/auth.module'; import { CoreModule } from './core/core.module'; -import { shoppingListReducer } from './shopping-list/ngrx/shopping-list.reducers'; +import { appReducers } from './ngrx/app.reducers'; @NgModule({ declarations: [ @@ -23,7 +23,7 @@ import { shoppingListReducer } from './shopping-list/ngrx/shopping-list.reducers ShoppingListModule, AuthModule, CoreModule, - StoreModule.forRoot({shoppingList: shoppingListReducer}) + StoreModule.forRoot(appReducers) ], bootstrap: [AppComponent] }) diff --git a/src/app/auth/auth-guard.service.ts b/src/app/auth/auth-guard.service.ts index 82a26ed..29a9958 100644 --- a/src/app/auth/auth-guard.service.ts +++ b/src/app/auth/auth-guard.service.ts @@ -1,14 +1,20 @@ import { CanActivate } from "@angular/router"; import { ActivatedRouteSnapshot, RouterStateSnapshot } from "@angular/router/src/router_state"; import { Injectable } from "@angular/core"; -import { AuthService } from "./auth.service"; +import { Store } from "@ngrx/store"; +import "rxjs/add/operator/map"; + +import * as fromApp from '../ngrx/app.reducers'; +import * as fromAuth from './ngrx/auth.reducers'; @Injectable() export class AuthGuard implements CanActivate { - constructor(private authService: AuthService) {} + constructor(private store: Store) {} canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) { - return this.authService.isAuthenticated(); + return this.store.select('auth').map((authState: fromAuth.State) => { + return authState.authenticated; + }); } } \ No newline at end of file diff --git a/src/app/auth/auth.service.ts b/src/app/auth/auth.service.ts index f264911..c5df36b 100644 --- a/src/app/auth/auth.service.ts +++ b/src/app/auth/auth.service.ts @@ -1,15 +1,30 @@ 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 { - token: string; - - constructor(private router: Router) {} + constructor(private router: Router, private store: Store) {} signupUser(email: string, password: string) { - firebase.auth().createUserWithEmailAndPassword(email, password).catch( + firebase.auth().createUserWithEmailAndPassword(email, password) + .then( + user => { + this.store.dispatch(new AuthActions.Signup()); + firebase.auth().currentUser.getIdToken() + .then( + (token: string) => { + this.store.dispatch(new AuthActions.SetToken(token)); + } + ); + + } + ) + .catch( error => console.log(error) ); } @@ -18,10 +33,13 @@ export class AuthService { firebase.auth().signInWithEmailAndPassword(email, password) .then( response => { + this.store.dispatch(new AuthActions.Signin()); this.router.navigate(['/']); firebase.auth().currentUser.getIdToken() .then( - (token: string) => this.token = token + (token: string) => { + this.store.dispatch(new AuthActions.SetToken(token)); + } ); } ) @@ -32,19 +50,7 @@ export class AuthService { logout() { firebase.auth().signOut(); - this.token = null; + this.store.dispatch(new AuthActions.Logout()); this.router.navigate(['/']); } - - getToken() { - firebase.auth().currentUser.getIdToken() - .then( - (token: string) => this.token = token - ); - return this.token; - } - - isAuthenticated() { - return this.token != null; - } } \ No newline at end of file diff --git a/src/app/auth/ngrx/auth.actions.ts b/src/app/auth/ngrx/auth.actions.ts new file mode 100644 index 0000000..019a88b --- /dev/null +++ b/src/app/auth/ngrx/auth.actions.ts @@ -0,0 +1,26 @@ +import { Action } from '@ngrx/store'; + +export const SIGNUP = 'SIGNUP'; +export const SIGNIN = 'SIGNIN'; +export const LOGOUT = 'LOGOUT'; +export const SET_TOKEN = 'SET_TOKEN'; + +export class Signup implements Action { + readonly type = SIGNUP; +} + +export class Signin implements Action { + readonly type = SIGNIN; +} + +export class Logout implements Action { + readonly type = LOGOUT; +} + +export class SetToken implements Action { + readonly type = SET_TOKEN; + + constructor(public payload: string) {} +} + +export type AuthActions = Signup | Signin | Logout | SetToken; \ No newline at end of file diff --git a/src/app/auth/ngrx/auth.reducers.ts b/src/app/auth/ngrx/auth.reducers.ts new file mode 100644 index 0000000..67ad145 --- /dev/null +++ b/src/app/auth/ngrx/auth.reducers.ts @@ -0,0 +1,35 @@ +import * as AuthActions from './auth.actions'; + +export interface State { + token: string; + authenticated: boolean; +} + +const initialState: State = { + token: null, + authenticated: false +}; + +export function authReducers(state = initialState, action: AuthActions.AuthActions) { + switch (action.type) { + case AuthActions.SIGNUP: + case AuthActions.SIGNIN: + return { + ...state, + authenticated: true + }; + case AuthActions.LOGOUT: + return { + ...state, + token: null, + authenticated: false + }; + case AuthActions.SET_TOKEN: + return { + ...state, + token: action.payload + }; + default: + return state; + } +} \ No newline at end of file diff --git a/src/app/core/header/header.component.html b/src/app/core/header/header.component.html index a83d6b9..cd84455 100644 --- a/src/app/core/header/header.component.html +++ b/src/app/core/header/header.component.html @@ -10,12 +10,12 @@
  • Shopping List