| 1 |
import { useEffect, useState } from '@wordpress/element' |
| 2 |
import { useGlobalStore } from '@library/state/GlobalState' |
| 3 |
|
| 4 |
/** Return any pending modals and check if any need to show */ |
| 5 |
export const useModal = () => { |
| 6 |
const [modal, setModal] = useState(null) |
| 7 |
const open = useGlobalStore((state) => state.open) |
| 8 |
const removeAllModals = useGlobalStore((state) => state.removeAllModals) |
| 9 |
|
| 10 |
// Watches modals added anywhere |
| 11 |
useEffect( |
| 12 |
() => |
| 13 |
useGlobalStore.subscribe( |
| 14 |
(state) => state.modals, |
| 15 |
(value) => setModal(value?.length > 0 ? value[0] : null), |
| 16 |
), |
| 17 |
[], |
| 18 |
) |
| 19 |
|
| 20 |
useEffect(() => { |
| 21 |
if (!open) removeAllModals() |
| 22 |
}, [open, removeAllModals]) |
| 23 |
|
| 24 |
return modal |
| 25 |
} |
| 26 |
|
