React Link doesn't trigger the router changement - reactjs

Question

In my react app I've tried lot of different router, route, and solution find on internet.
The fact is i'm using <HashRouter> from react-router-dom and redux in my app.
When I change the url in my browser the right route is triggered and the right component is loaded.
The issue :
When i click on <Link> component the url change, the history props on the router change but nothing happenned in the app...
Here are my app architecture and code :
MainApp.jsx
render(){
<Provider store={store}>
<HashRouter>
<div className="main-app">
<StickyContainer>
<Header toggleHelp={() => this.toggleOverlay()} />
<Sticky>
<Toolbar /> //Here are my <Link/>
</Sticky>
<App/>
<Footer />
</StickyContainer>
</div>
</HashRouter>
</Provider>
}
App.js
import React from 'react'
import { bindActionCreators } from 'redux'
import { connect } from 'react-redux'
import * as Actions from 'Actions';
import Main from 'Components/Main/Main';
import {withRouter} from 'react-router-dom';
const App = ({elements, actions,documents,filters}) => (
<div>
<Main elements={elements} actions={actions} documents={documents} filters={filters} />
</div>
)
const mapStateToProps = state => ({
elements: state.elements,
documents: state.documents,
filters:state.filters
});
const mapDispatchToProps = dispatch => ({
actions: bindActionCreators(Actions, dispatch)
});
export default withRouter(connect(
mapStateToProps,
mapDispatchToProps
)(App));
And finally my Main.jsx
render(){
<div className="main-authenticated">
<Switch>
<Route path="/home" component={Home} />
<Route path="/reporting" component={Reporting} />
<Route path="/about" component={About} />
<Route path="/disconnect" component={ErrorPage} />
</Switch>
</div>
}
I already tried with a BrowserRouter, a basic Router with history but always this issue. Don't know if it's due to my project architecture or something else.
UPDATE
Moved withRouter on Main.jsx and got the same issue.
Main.jsx
render(){
<div className="main-authenticated">
<Switch>
<Route path="/home" component={Home} />
<Route path="/reporting" component={Reporting} />
<Route path="/about" component={About} />
<Route path="/disconnect" component={ErrorPage} />
</Switch>
</div>
}
export default withRouter(Main)

Answer 1

As #ShubhamKhatri said, I needed to export my Main component with withRouter function from react-router.
But there was an other issue, the Link included in the Toolbar component was not triggered the router due to the Sticky Component from react-sticky.
Remove the Sticky component wrapper on the MainApp correct the problem.
Final solution :
exporting Main.jsx
class Main
[...]
export default withRouter(Main);
MainApp.jsx
<Provider store={store}>
<HashRouter>
<div className="main-app">
<Header />
<Toolbar/>
<App>
<Footer />
</div>
</HashRouter>
</Provider>