composeWithDisplayName - a new utility function

[arty-name]

I propose this change because I am unhappy with the current way we use setDisplayName(wrapDisplayName(...)) when we want to wrap the name of the base component.

Here’s one way to do that with an extra function wrapper:

const myHOC1 = BaseComponent => compose(
  setDisplayName(wrapDisplayName(BaseComponent, 'myName')),
  renameProp('old', 'new'),
  flattenProp('data'),
)(BaseComponent)

One could try to extract this functionality to avoid the wrapper:

const displayName = (Component) => 
  setDisplayName(wrapDisplayName(Component, 'myName'))(Component),

const myHOC2 = compose(
  displayName,
  renameProp('old', 'new'),
  flattenProp('data'),
)

However with this approach the Component already has display name renameProp(flattenProp(...)) and we will just add yet another wrapper around it.

I propose a new utility function composeWithDisplayName to make the code more concise:

const myHOC3 = composeWithDisplayName(
  'myName',
  renameProp('old', 'new'),
  flattenProp('data'),
)

Have a look at the diff of this PR: many HOCs of recompose itself can benefit from this feature.

[arty-name]

Here’s the proposed documentation