Reactjs: Модальные окна на хуках без контекста

Мне нравится подход к модальным окнам, когда я могу из разных мест приложения управлять одним и тем же модальным окном:

Из данного кода очевидно, что paymentModal регистрируется где-то выше.

Идея использовать контекст для модальных окон в корне приложения мне не нравится, поскольку это влечет за собой муки выбора в таком случае:

Поэтому, я решил попробовать реализовать модальные окна иначе, делая вид, будто бы это HOC:

Я не нахожу существенных недостатков в том, что модальные окна рисуются в стороне от основного приложения.

Такое решение влечет за собой необходимость регистрации #modals как точку монтирования модальных окон, параллельно с ReactDOM.render:

В итоге, получается возможность обращаться к модальному окну из нескольких независимых компонентов без использования общего контекста:

Внутри это работает предельно просто: modal(() => ...) создает контекст модального окна, а useModal подхватывает его и делает ему render():

На этом, собственно, и все.

Благодаря такой нехитрой конструкции одним и тем же модальным окном удается управлять из разных мест:

С полной реализацией и примером можно ознакомиться в CodeSandbox-е.

Мнение по поводу решения можно выразить в группе @react_ru в Telegram.