import { Injectable } from '@angular/core';
import { Observable , of} from 'rxjs';
import { Action } from '@ngrx/store';
import { Router} from '@angular/router';
import { Actions, Effect, ofType} from '@ngrx/effects';
import {map, switchMap, catchError, tap} from 'rxjs/operators';

import { AuthService } from '@services';
import * as actions from 'app/actions/auth.action';
import * as RouterActions from 'app/actions/router.action';



@Injectable()
export class AuthEffects {

    @Effect() Login$: Observable<Action> = this.actions$
        .pipe(
            ofType<actions.Login>(actions.AuthActionTypes.Login),
            map(action => action.payload),
            switchMap((access) => this.authSrv.Login(access)
                .pipe(
                    map(auth => {
                        // console.log('auth.effect25' + Login);
                        return new actions.LoginSuccess(auth);
                    }),
                    catchError(err => of(new actions.LoginFail({
                        status: 501,
                        message: err.message,
                        exception: err.stack,
                        path: '/',
                        timestamp: new Date()
                    }))),
                )
            )
        );

    // @Effect() Register$: Observable<Action> = this.actions$
    //     .pipe(
    //         ofType<actions.Register>(actions.AuthActionTypes.Register),
    //         map(action => action.payload),
    //         switchMap((val) => this.authSrv.Register(val)
    //             .pipe(
    //                 map(Register => new actions.RegisterSuccess(Register)),
    //                 catchError(err => of(new actions.RegisterFail)(err)),
    //             )
    //         )
    //     );

    @Effect() Logout$: Observable<Action> = this.actions$
        .pipe(
            ofType<actions.Logout>(actions.AuthActionTypes.Logout),
            map(() => new RouterActions.Go({path: ['/']} ))
        );

    @Effect() LoginSuccess$: Observable<Action> = this.actions$
        .pipe(
            ofType<actions.LoginSuccess>(actions.AuthActionTypes.LoginSuccess),
            map( () => new RouterActions.Go({path: ['/']} ))
        );

    @Effect() RegisterSuccess$: Observable<Action> = this.actions$
        .pipe(
            ofType<actions.RegisterSuccess>(actions.AuthActionTypes.RegisterSuccess),
            map(() => new RouterActions.Go({path: ['/projects']}))
        );
// no return Observable<Action>
    @Effect({dispatch: false }) navigate$ = this.actions$
        .pipe(
            ofType<RouterActions.Go>(RouterActions.RouterActionTypes.Go),
            map(action => action.payload),
            tap(({ path, query: queryParams, extras}) =>
                this.router.navigate(path, { queryParams, ...extras }))
        );




    constructor(
        private actions$: Actions,
        private authSrv: AuthService,
        private router: Router,
    ) {}
}