javascript - Redux Promise Middleware でアクションを連鎖するにはどうすればよいですか?

Question

私はReactとReduxを初めて使用します。redux-promise-middlewareを使用して複数の API 呼び出しをチェーン化し、次のようにアクションを実装したいと考えています。

locationActions.js:

import { visitLocation } from '../services/actionService';

export const VISIT_LOCATION = 'VISIT_LOCATION';
export const VISIT_LOCATION_PENDING = 'VISIT_LOCATION_PENDING';
export const VISIT_LOCATION_FULFILLED = 'VISIT_LOCATION_FULFILLED';
export const VISIT_LOCATION_REJECTED = 'VISIT_LOCATION_REJECTED';

const visitLocationAction = (characterId, location) => ({
    type: VISIT_LOCATION,
    // visitLocation returns a new promise
    payload: visitLocation(characterId, location)
});

export { visitLocationAction as visitLocation };

以下を使用して、React コンポーネントからこのアクションをディスパッチしますmapDispatchToProps。

const mapDispatchToProps = dispatch => (
    bindActionCreators({ visitLocation }, dispatch)
);

これはうまくいきます！visitLocationしかし、決済が完了してから別のアクションをディスパッチしたいです。Promise.then()メソッドが提供されていないため呼び出すことができませんdispatch。したがって、アクションをレデューサーに「バインド」しません。

チュートリアルでは、呼び出す必要dispatch(secondAction())があると記載されていますが、アクション クリエーターでディスパッチを利用できません。

誰かが私に欠けているものを指摘できますか?

編集：

最初の回答で示唆されているように、次のアプローチを試しました。

import { visitLocation } from '../services/locationService';
import { fetchSomething } from '../services/otherService';

const visitLocationAction = (characterId, location) => {
    return (dispatch) => {
        return dispatch(visitLocation(characterId, location))
            .then(() => dispatch(fetchSomething()));
    };
};

export { visitLocationAction as visitLocation };

しかし、私は action:undefined と次のエラーを受け取りました:

Error: Actions must be plain objects. Use custom middleware for async actions.
    at dispatch (redux.js:200)
    at redux-logger.js:1