# extendify/0.10.1/src/Library/hooks/useModal.js

Extendify, version 0.10.1. 49 lines.

- Page: https://pluginprobe.com/plugins/extendify/0.10.1/code/src/Library/hooks/useModal.js
- Raw: https://pluginprobe.com/plugins/extendify/0.10.1/raw/src/Library/hooks/useModal.js
- Modified: 2022-05-27T00:51:26+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/extendify/0.10.1/code/src/Library/hooks/useModal.js#L10-L20`.

```javascript
import { useEffect, useState } from '@wordpress/element'
import { InstallStandaloneModal } from '@library/components/modals/InstallStandaloneModal'
import { useGlobalStore } from '@library/state/GlobalState'
import { useUserStore } from '@library/state/User'

/** Return any pending modals and check if any need to show  */
export const useModal = () => {
    const [modal, setModal] = useState(null)
    const open = useGlobalStore((state) => state.open)
    const pushModal = useGlobalStore((state) => state.pushModal)
    const removeAllModals = useGlobalStore((state) => state.removeAllModals)

    // Watches modals added anywhere
    useEffect(
        () =>
            useGlobalStore.subscribe(
                (state) => state.modals,
                (value) => setModal(value?.length > 0 ? value[0] : null),
            ),
        [],
    )

    // Checks for modals that need to be shown on load
    useEffect(() => {
        if (!open) {
            removeAllModals()
            return
        }
        const ModalNoticesByPriority = {
            standalone: InstallStandaloneModal,
        }
        const componentKey =
            Object.keys(ModalNoticesByPriority).find((key) => {
                if (key === 'standalone') {
                    return (
                        !window.extendifyData.standalone &&
                        !useUserStore.getState().modalNoticesDismissedAt[key]
                    )
                }
                return !useUserStore.getState().modalNoticesDismissedAt[key]
            }) ?? null

        const Modal = ModalNoticesByPriority[componentKey]
        if (Modal) pushModal(<Modal />)
    }, [open, pushModal, removeAllModals])

    return modal
}

```