Get Redux Store In Presentational Component - reactjs

Question

This is a tagalong of this question here. In contrast to that question, I don't need my presentational component to be a class. Is there a way to retrieve Redux's store without using a class and the corresponding super() method?
container.js
function mapStateToProps(state) {
return {
a: state.a
};
}
function mapDispatchToProps(dispatch) {
return {
setA: a => dispatch(setA(a)),
};
}
export default connect(
mapStateToProps,
mapDispatchToProps
)(container);
presentational.js
function b({ a }) {
return {
console.log(a) // returns undefined
}
}
Does the dispatch work the same way?

Answer 1

Yes you can access the store from anywhere you like. You just need to export it from the file where you create it.
import { configureStore } from '...';
export const store = configureStore(...);
Import the store in your presentational.js file
import {store} from '...'
// And now you can access the current state or perform a dispatch:
store.getState() // current state
store.dispatch()

Answer 2

EDIT
My previous answer was wrong apologies for that, actually functional components (the one without class) can also access redux state and they can do that using connect from react-redux the very same way class components do
Reason for previous wrong answer
I once long ago tried to use connect with functional components and it didn't work for some weird reasons but when I converted the functional component to class component it worked without making changes to any other logic so I concluded that only class components can access redux state.
But I was wrong as I tested my case in this sandbox link https://codesandbox.io/s/38yw3l6nom (please look out for sample component in containers folder)
Previous wrong answer (please don't read if you are looking only for the correct solution)
No, connect from 'react-redux' modules only works on class components. Also, super is a method called in a constructor and hence they can only be called in class. You can refer this link here https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes.
If you want any data stored in redux in your presentational component you'll have to pass it through a container component which will have access to the redux store. Please read more about here https://redux.js.org/recipes/writing-tests#components.

Answer 3

If you want to use connect on a presentational component then you'll have to use composition. recompose to achieve that.
import {compose} from 'recompose';
const presentationalComponent = props => {
return (
<div>{//Your content here}</div>
);
}
function mapStateToProps(state) {
return {
a: state.a
};
}
function mapDispatchToProps(dispatch) {
return {
setA: a => dispatch(setA(a)),
};
}
export default compose(
connect(
mapStateToProps,
mapDispatchToProps
)
)(presentationalComponent);
You'll not have to make container component this way.