MyPage.js

import withModal from 'withModal';

function MyPage({ openModal, closeModal }) {
  const onClick = () => openModal(<div>Modal content. <button onClick={this.closeModal}>close</button></div>);

  return (
    <p>
      <h1>Title</h1>
      <button onClick={onClick}>open modal</button>
    </p>
  );
}

export default withModal(MyPage);

withModal.js

export default function withModal(component) => {
  return class withModal extends React.Component {
    static displayName = `withModal(${component.displayName || component.name || 'Component'})`;

    state = { modal: null };

    render() {
      if (this.state.modal) {
        return (
          <div>
            {this.renderComponent()}
            <Modal isOpen={true}>{this.state.modal}</Modal>
          </div>
        );
      }

      return this.renderComponent();
    }

    renderComponent() {
      return React.createElement(component, { ...this.props, openModal: this.openModal, closeModal: this.closeModal });
    }

    closeModal = () => {
      this.setState({ modal: null });

    };

    openModal = (modal) => {
      this.setState({ modal });
    };
  }
}