MakePayment_member_id_als_props.js

import React from "react";
import {connect} from "react-redux";
import {routeActions} from "react-router-redux";
import {makePayment} from "./memberActions";
import MakePaymentForm from "./MakePaymentForm";

const MakePayment = ({onMakePayment, params: {id}}) => {
    return (
        <div className="container">
            <div className="row">
                <div className="col-xs-12 col-sm-12 col-md-6 col-lg-6 col-md-offset-3 col-lg-offset-3">
                    <MakePaymentForm onMakePayment={onMakePayment} member_id={id}/>
                </div>
            </div>
        </div>
    );
};

function mapDispatchToProps(dispatch) {
    return {
        onMakePayment: (member_id, amount, date) => {
            dispatch(makePayment(member_id, amount, date));
            dispatch(routeActions.push('/members'));
        },
    }
}

export default connect(({members}) => ({members}), mapDispatchToProps)(MakePayment);

MakePayment_member_id_in_OwnProps.js

import React from "react";
import {connect} from "react-redux";
import {routeActions} from "react-router-redux";
import {makePayment} from "./memberActions";
import MakePaymentForm from "./MakePaymentForm";

const MakePayment = ({onMakePayment}) => {
    return (
        <div className="container">
            <div className="row">
                <div className="col-xs-12 col-sm-12 col-md-6 col-lg-6 col-md-offset-3 col-lg-offset-3">
                    <MakePaymentForm onMakePayment={onMakePayment}/>
                </div>
            </div>
        </div>
    );
};

function mapDispatchToProps(dispatch, ownProps) {
    return {
        onMakePayment: (amount, date) => {
            dispatch(makePayment(ownProps.params.id, amount, date));
            dispatch(routeActions.push('/members'));
        },
    }
}

export default connect(({members}) => ({members}), mapDispatchToProps)(MakePayment);