redux reducer not called - redux

Question

Can someone help me figure out why this simple redux implementation is not calling the reducer on the anchor tag click?
The action gets initiated on each click, while the reducer only once when the program starts.
Any pointer appreaciated.
// action
const changeText = (text) => {
console.log('action changeDate')
return {
type: 'CHANGE_TEXT',
text
};
};
// reducer
const changeTextReducer = (state = [], action) => {
console.log('reducer changeTextReducer')
return [
...state,
{
text: 'Some Text'
}
]
}
class Sales extends React.Component {
constructor(props) {
super(props);
this.handleClick = this.handleClick.bind(this)
}
handleClick(e) {
e.preventDefault();
this.props.onClick('test')
}
render() {
return (
<div className="content">
<a href="" onClick={(e) => this.handleClick(e)} > click me </a>
</div>
);
}
}
const mapStateToProps = (state) => {
console.log('mapStateToProps', state)
return {changeTextReducer: state.text}
};
const mapDispatchToProps = (dispatch) => {
return {
onClick: (dates) => {
dispatch(changeText(dates))
}
}
};
const SalesApp = connect(
mapStateToProps,
mapDispatchToProps
)(Sales);
export default SalesApp
// store
const store = createStore(
allReducers, composeWithDevTools(
applyMiddleware(
thunkMiddleware, // lets us dispatch() functions
createLogger // neat middleware that logs actions
),
)
);