Using MDBSideNavLink is updating url but not rendering new v

Hello! I want to make the sidebar works inside a React-redux app and Im having some problems. Maybe is because of how my app is setup.

Expected behavior MDBSideNav is working inside a Redux App using connected-react-router.

Actual behavior MDBSideNavLink inside MDBSideNav, updates the url with the new one but is not rendering the new view. I need to refresh the page in order to get the new view that corresponds to the new url.

Package.json

     "connected-react-router": "^6.5.2",
     "react-redux": "^6.0.0",
      "react-router": "^5.1.2",
      "react-router-dom": "^4.2.2",
      "redux": "^4.0.0",

Resources (screenshots, code snippets etc.)

index.js

ReactDOM.render(
    <Provider store={store}>
        <ConnectedRouter history={history}>
            <App />
        </ConnectedRouter>
    </Provider>,
rootElement

);

App.js

render(){
  return (
        <Fragment>
            <Routes />
            <MainSidebar />
            <TopNavBar  />
        </Fragment>
    );

}

MainSidebar.js

render(){ 
<BrowserRouter>
           <MDBSideNav  ...>
                 <MDBSideNavNav>
                      <MDBSideNavCat  ... >
                            <MDBSideNavLink to='/url1'>
                                url 1
                            </MDBSideNavLink>
                            <MDBSideNavLink to='/url2'>
                                url2
                         </MDBSideNavLink>
                        </MDBSideNavCat>
                    </MDBSideNavNav>
                </MDBSideNav>
            </BrowserRouter>