Почему activeClassName="ActivePageLink" не добавляется?

Question

[sergeyviktorovich]

если я правильно понял из-за этого export default connect(mapStateToProps)(MenuTask);

import React from 'react';
import { NavLink } from 'react-router-dom';
import { connect } from 'react-redux';
import { OPEN_FORM_NEW_TASK_CAPTION, OPEN_FORM_EDIT_TASK_CAPTION } from '../stores/const.js';
class MenuTask extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            TaskLists: this.props.stateTaskLists.TaskLists
        }
    }
    UNSAFE_componentWillReceiveProps = (newProps) => {
        this.setState({ TaskLists: newProps.stateTaskLists.TaskLists });
    }
    forTaskLists = () => {
        let menulist = [];
        for (let tasklistskey in this.state.TaskLists) {
            menulist.push(
                <li key={tasklistskey}>
                    <NavLink to={"/chapter/" + this.state.TaskLists[tasklistskey].url} exact className="PageLink" activeClassName="ActivePageLink" key={tasklistskey}>  {this.state.TaskLists[tasklistskey].name}</NavLink>
                </li>
            )
        }
        return menulist;
    }
    render() {
        return (
            <React.Fragment>
                {<li><NavLink to="/" exact className="PageLink" activeClassName="ActivePageLink" > Все </NavLink></li>}
                {Object.keys(this.state.TaskLists).length > 0 && this.forTaskLists()}
            </React.Fragment >
        );
    }
}
const mapStateToProps = function (state) {
    return {
        stateTaskLists: state.stateTaskLists,
    };
};
export default connect(mapStateToProps)(MenuTask);