React Redux with abbreviation-observable, use a router to go to another page after an asynchronous action completes

Question

I use redux-observable and this is my login ID:

const login = ( action$ ) => {
    return action$.ofType(SessionActions.LOGIN_USER)
      .flatMap(( {payload} ) => {
        return sessionService.login(payload)
          .do(payload => {
            sessionService.setSession(payload));
          // Here I want to redirect the user back to his last location
          }).map(result => ({
            type: SessionActions.LOGIN_SUCCESS,
            payload: result
          }));
      });
  }

But how do I redirect the user to another page after the success of the login action.

What is a reduction method?

Answer 1

I am completely new to react / shorten, but I am facing the same problem as you, so I am creating a small APP with a login page.

// On your Login.JS you could implement the component lifecycle

componentWillReceiveProps(nextProps) {
    if (nextProps.isAuthenticated){
        this.context.router.push({pathname:'/'});
    }
}

, "" "" : LOGIN_SUCCESS, , . , .

Answer 2

redux-observable react-router-redux, :

import { ajax } from 'rxjs/observable/dom/ajax';
import { push } from 'react-router-redux';
import NProgress from 'nprogress';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/mergeMap';

export default function login(action$) {
  return action$.ofType('LOGIN_USER')
    .do(() => NProgress.start())
    .mergeMap(payload => (
       // Call your login service here, please note that it must be an observable to continue in your epic chain.
       Observable.fromPromise(sessionService.setSession(payload))
         // This is the redirect you're looking for, it now became an action thanks to react-router-redux :)
         .mapTo(push({ url: '/' }))
         .do(() => NProgress.done())
  ));
}

:) , x