A small bit of open source: withModals.js

Higher ordered React components are great for reducing boilerplate and generalizing patterns. We’ve written a few here at Greenhouse, and I think you might find them as useful jumping off points to write your own.

To start out with, I’m sharing our smallest, simplest, and most used higher ordered component: withModals.js. It helps out by managing the state of modals (open or closed).

Here’s the documentation at the top of withModals.js:

I whipped up an example for you that uses a <Modal> component to display some content on demand:

And here’s the source:

I’ve also created a code pen for you to try out and experiment with. It hides and displays text instead of popping open a modal, but I think it gets the point across.

Enjoy!