Ref or state duplication or HOC?

I have a modal component, with these props:

interface ModalComponentProps {
    isOpened?: boolean;
    closeCallback?: any;
}

I watch the prop changes with:

componentDidUpdate(prevProps: Readonly<ModalComponentProps>, prevState: Readonly<ModalComponentStates>, snapshot?: any) {
    if (prevProps.isOpened !== this.props.isOpened) {
        this.toggleDrawer();
    }
}

closeCallback prop is used to reset content inside the modal or to set state in the parent component when I click on close modal button.

I would like to use this component to create an addUserModalComponent component from it. I insist on the fact that I want to be able to act on the state internally (via the close modal button) AND also from the outside to open via a button elsewhere on the page so, with props. But that the problem when going up the state isClosed is that I have to do it wherever I use this component

I can use a reference to open and close by exposing public methods but it's not really React-friendly.

I also see that I could use a HOC, but it's more of an abstraction than a composition.

How would you do?