feat(Auth Guard)

src/auth/effects/auth.effects.ts

@@ -3,22 +3,23 @@ import 'rxjs/add/operator/do';
 import 'rxjs/add/operator/exhaustMap';
 import 'rxjs/add/operator/map';
 import 'rxjs/add/operator/take';
+import { of } from 'rxjs/observable/of';
 import { Injectable } from '@angular/core';
-import { App } from 'ionic-angular';
+import { AlertController, App } from 'ionic-angular';
+import { SecureStorage, SecureStorageObject } from '@ionic-native/secure-storage';
 import { Effect, Actions } from '@ngrx/effects';
-import { of } from 'rxjs/observable/of';
 
 import { AuthService } from '../services/auth.service';
 import * as Auth from '../actions/auth';
 
 import { TabsPage } from '../../pages/tabs/tabs';
 import { Authenticate, RegisterForm, User } from '../models/user';
-import { AuthPage } from '../containers/auth';
-import { SecureStorage, SecureStorageObject } from "@ionic-native/secure-storage";
 
 @Injectable()
 export class AuthEffects {
 
+  /** Login */
+
   @Effect()
   login$ = this.actions$
     .ofType(Auth.LOGIN)
@@ -29,6 +30,8 @@ export class AuthEffects {
         .catch(error => of(new Auth.LoginFailure(error)))
     );
 
+  /** Login success */
+
   @Effect({dispatch: false})
   loginSuccess$ = this.actions$
     .ofType(Auth.LOGIN_SUCCESS)
@@ -40,10 +43,17 @@ export class AuthEffects {
       this.appCtrl.getRootNav().setRoot(TabsPage);
     });
 
+  /** Redirect to login page */
+
   @Effect({dispatch: false})
   loginRedirect$ = this.actions$
     .ofType(Auth.LOGIN_REDIRECT, Auth.LOGOUT)
-    .do(authed => this.appCtrl.getRootNav().setRoot(AuthPage));
+    .do(() => {
+      console.log('REDIRECTING...');
+      this.appCtrl.getRootNavs()[0].push('AuthPage');
+    });
+
+  /** Register new user */
 
   @Effect()
   register$ = this.actions$
@@ -56,23 +66,40 @@ export class AuthEffects {
         .catch(error => of(new Auth.RegisterFailure(error)))
     );
 
+  /** Register success */
+
+  /** TODO: Autologin after register, replace form.email with form.username
+   * (waiting for a decision https://github.com/EyeSeeTea/FIRE-WiFiCalling/issues/37) */
+
   @Effect({dispatch: false})
   registerSuccess$ = this.actions$
     .ofType(Auth.REGISTER_SUCCESS)
     .map((action: Auth.Register) => action.payload)
-    .map((form: RegisterForm) => <Authenticate>{username: form.username, password: form.password})
+    .map((form: RegisterForm) => <Authenticate>{username: form.email, password: form.password})
     .map((cred: Authenticate) => new Auth.Login(cred));
 
+
+  /** Login/Register Fail */
+
   @Effect({dispatch: false})
   failure$ = this.actions$
     .ofType(Auth.REGISTER_FAILURE, Auth.LOGIN_FAILURE)
-    .do(() => {
+    .map((action: Auth.LoginFailure) => action.payload)
+    .map((err) => {
       // handle errors here
+
+      const alert = this.alerts.create({
+        title: 'Error',
+        message: JSON.stringify(err),
+        buttons: ['OK']
+      });
+      alert.present();
     });
 
   constructor(private actions$: Actions,
               private authService: AuthService,
               private appCtrl: App,
-              private secureStorage: SecureStorage) {
+              private secureStorage: SecureStorage,
+              private alerts: AlertController) {
   }
 }

src/auth/guard/auth-guard.ts

@@ -0,0 +1,33 @@
+import 'rxjs/add/operator/take';
+import 'rxjs/add/operator/map';
+import { Store } from '@ngrx/store';
+import * as Auth from '../actions/auth';
+
+export class AuthGuard {
+
+  authenticated = false;
+
+  constructor(public store: Store<any>) {
+
+    this.store.take(1).subscribe(state => {
+      this.authenticated = !!(state && state.auth && state.auth.status && state.auth.status.loggedIn);
+    });
+
+    /** TODO: check how to initialize auth in the root state */
+    /** Desired way
+     *
+     * this.store.select(fromAuth.getLoggedIn).take(1).map(authed => this.authenticated = authed);
+     */
+  }
+
+  /** Check if page can enter */
+  ionViewCanEnter() {
+
+    /** Auth Guard is disabled for dev. uncomment the following to activate */
+    if (!this.authenticated) {
+      this.store.dispatch(new Auth.LoginRedirect());
+    }
+
+    return this.authenticated;
+  }
+}

src/pages/admin/admin.ts

@@ -1,18 +1,21 @@
 import { Component } from '@angular/core';
+import { Store } from '@ngrx/store';
 
 import { NotificationsPage } from '../notifications/notifications';
+import { AuthGuard } from '../../auth/guard/auth-guard';
 
 @Component({
   templateUrl: 'admin.html'
 })
-export class AdminPage {
+export class AdminPage extends AuthGuard {
 
   tabNotifications = NotificationsPage;
   tabUsers = NotificationsPage;
   tabBilling = NotificationsPage;
   tabTest = NotificationsPage;
 
-  constructor() {
+  constructor(public store: Store<any>) {
+    super(store);
   }
 
 }

src/pages/call/call.ts

@@ -3,17 +3,19 @@ import { NavController } from 'ionic-angular';
 import { Store } from '@ngrx/store';
 
 import { CallingPage } from './calling';
+import { AuthGuard } from "../../auth/guard/auth-guard";
 
 @Component({
   selector: 'page-call',
   templateUrl: 'call.html',
 })
-export class CallPage {
+export class CallPage extends AuthGuard {
+
   phoneNumber: string = '';
   callButtonHidden: boolean = true;
 
-  constructor(public navCtrl: NavController,
-              public store: Store<any>) {
+  constructor(public navCtrl: NavController, public store: Store<any>) {
+    super(store);
   }
 
   add(n: string) {