redux asynchronous actions dispatching one after the other

actions.js

// oneAction could be setCountry
export const oneAction = params => {
  return {
    type: "ONE_ACTION",
    payload: Promise.resolve(`(value from oneAction ${params})`)
  };
};

// otherAction could be fetchRegions
export const otherAction = params => {
  return {
    type: "OTHER_ACTION",
    payload: Promise.resolve(`(value from otherAction ${params})`)
  };
};

app.component.js

import React, { Component } from "react";
import { connect } from "react-redux";

import { oneAction, otherAction } from "../actions";

export class AppImpl extends Component {
  handleSomething(someValue) {
    this.props.oneAction(someValue).then(
      oneActionResult => {
        console.log("result from oneAction\n", oneActionResult);
        return this.props
          .otherAction(oneActionResult.payload)
          .then(otherActionResult => {
            console.log("result from otherAction\n", otherActionResult);
          });
      },
      error => {
        // handle error
      }
    );
  }

  render() {
    return (
      <div>
        <h3>Asynchronouse Actions dispatch</h3>

        <button
          onClick={() => this.handleSomething.bind(this)("some useless value")}
        >
          Click me
        </button>
      </div>
    );
  }
}

export const App = connect(
  state => ({
    state
  }),
  { oneAction, otherAction }
)(AppImpl);

output.md

result from oneAction
  {type: "ONE_ACTION", payload: "(value from oneAction some useless value)"}
result from otherAction
  {type: "OTHER_ACTION", payload: "(value from otherAction (value from oneAction some useless value))"}