withRender HoC

AContainer.jsx

import React, { Component } from 'react';
import { compose } from 'redux';
import { connect } from 'react-redux';

// supposed to receive a class and return a new function (curryed) that
// if called add a render function to the received class,
// rendering the received component passing down all the props
import { withRender } from './utils';

// container class with event handler and action creator dispatch
class AContainer extends Component {
  onBtnClick() {}
  componentDidMount(){}
}

// factory of AContainer, composed by redux connect and withRender
export const AContainerWithRender = compose(
  connect(() => {}, {}),
  withRender(AContainer)
)

// default version using A as dumb component
export default AContainerWithRender(A);



// usage in another file with default render
import React from 'react';
import AContainer from './AContainer';

React.render(<AContainer />, ...);



// usage in another file with custom render
import React from 'react';
import { AContainerWithRender } from './AContainer';

const AContainer = AContainerWithRender((props) => (
  <div>My custom renderer</div>
));

React.render(<AContainer />, ...);