Using compose() and connect() together in React JS redux

Question

I am starting to develop a web application using React JS. I bought a theme from theme forest. In the theme, they are using compose like this in the component.

...Other code here
 Login.propTypes = {
      classes: PropTypes.shape({}).isRequired,
      width: PropTypes.string.isRequired
    };

    export default compose(withWidth(), withStyles(themeStyles, { withTheme: true }))(Login);

As you can see their code is using the compose at the end when exporting the Component. I cannot modify their built-structure. What I like to do now is I like to use connect feature of the react as well.

Normally connect is used in the place of compose. Now, if I want to use connect to work with the state of the application, how can I use it together with compose ?

Answer 1

const enhance = compose(
    withRouter,
    withStyles(styles, 'some style'),
    connect(mapStateToProps, mapDispatchToProps),
    ....

export default enhance(MyComponent);