Month.js

import React from "react";
import {connect} from "react-redux";
import {changingOfMonthFeeWasRequested} from "./monthDucks";
import ChangeMonthFeeForm from "./ChangeMonthFeeForm";

/**
 * component
 */
export const Month = ({showForm, month, onClick}) => {
    return (
        <tr>
            <td>
                {month.name}
            </td>
            <td>
                {month.year}
            </td>
            <td>
                {showForm
                    ? <ChangeMonthFeeForm month={month}/>
                    : <a onClick={onClick}>{month.amount}</a>
                }
            </td>
        </tr>
    );
};

// ownProps contains the props of the rendered component
function mapStateToProps(state, ownProps) {
    return {
        showForm: state.app.showChangeMonthFeeForm === ownProps.month.id,
    }
}

function mapDispatchToProps(dispatch, ownProps) {
    return {
        onClick: () => {
            dispatch(changingOfMonthFeeWasRequested(ownProps.month.id));
        }
    }
}

/**
 * container
 */
export default connect(mapStateToProps, mapDispatchToProps)(Month);