Write down a "withModal" high order component, which will accept two arguments [modalName: String] and [modalComponent: React.Component] and render modalComponent into portal. Also, this HOC should inject 'showModal' and 'hideModal' to a new collection of props that are passed to the base component. eq:
import { compose, withHandlers } from 'recompose';
const PricingModal = ({ title, onHide }) => <button onClick={onHide}>Hide {title} modal</button>;
const enhance = compose(
withModal('pricing', PricingModal),
withHandlers({
showPricing: ({ openModal, hideModal }) => () =>
openModal('pricing', {
title: 'Pricing',
onHide: (data) => hideModal('pricing')
})
})
)
export default enhance(({
openModal
}) => (
<button onClick={openModal}>Open modal</button>
))