Skip to main content

Modals

There is currently a hook called useModal that we use to open modals in many places. This hook has been deprecated. Please use the openModal function in LayerConext as described in this article.

Example Usage
const { openModal } = useLayerContext();
openModal((closeModalFn) => 
  <ConfirmClearLogsModal ctas={getConfirmationCtas(closeModalFn)} text={t(SystemLogsTKeys.ClearLogsConfirmMsg, { count: systemLogs.length })} />);   

The useLayerContext hook has a function called openModal that can be used to open a modal from anywhere. It is a function whose single parameter is a function called getModalComponent that should return the modal to be displayed as JSX. The modal should be styled in such a way that it will appear as a popup over all the other UI (such as by using EfcModal from the component library). The closeModalFn parameter passed to the getModalComponent function will close the modal when called.

When using EfcModal you will probably want to set the isOpen prop to true, and have the toggle prop call the closeModalFn.