Is it ok to have a React Component composed by a bunch of higher order components.

[mjangir]

Hi Kent, I just needed an advice on how I'm building my container components. I'm using Andrew Clark's recompose library to compose and create multiple higher order functions like this.

const withLifecycle = lifecycle(...);`
const withState = withState(...);
const withAddProps = withProps(...);
const withConnect = connect(...) //react-redux
const withSaga = injectSaga(...);
const withReducer = injectReducer(...);
const withActions = withHandlers(...);

export default compose(
withConnect,
withReducer,
withSaga,
withState,
withAddProps,
withActions,
withLifecycle,
withInfiniteLoader,
withErrorMessage
)(BaseComponent)

`

As per you, is it a good practice to have the component architecture in such a way? If not then what are the disadvantage.

I really appreciate the way you are helping us.

[kentcdodds]

Hi @mjangir,

I've seen components like this and while it may feel elegant at first, it'll become SUPER confusing to you and anyone else very quickly. I definitely recommend against this approach and suggest you look into React Hooks.

Good luck!

[kentcdodds]

Oh, and also, check this out (from the readme of the project):

A Note from the Author (acdlite, Oct 25 2018):

Hi! I created Recompose about three years ago. About a year after that, I joined the React team. Today, we announced a proposal for Hooks. Hooks solves all the problems I attempted to address with Recompose three years ago, and more on top of that. I will be discontinuing active maintenance of this package (excluding perhaps bugfixes or patches for compatibility with future React releases), and recommending that people use Hooks instead. Your existing code with Recompose will still work, just don't expect any new features. Thank you so, so much to @wuct and @istarkov for their heroic work maintaining Recompose over the last few years.

Read more discussion about this decision here.

[mjangir]

Thank you Kent.

[mk0y]

Only problem hooks aren't solving is branching. Any pattern coming to mind about this?