File size: 1,752 Bytes
4114d85 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 |
import React from 'react'
import { useDispatch, useSelector } from 'react-redux'
import { useSnackbar } from 'notistack'
import { removeSnackbar } from 'store/actions'
let displayed = []
const useNotifier = () => {
const dispatch = useDispatch()
const notifier = useSelector((state) => state.notifier)
const { notifications } = notifier
const { enqueueSnackbar, closeSnackbar } = useSnackbar()
const storeDisplayed = (id) => {
displayed = [...displayed, id]
}
const removeDisplayed = (id) => {
displayed = [...displayed.filter((key) => id !== key)]
}
React.useEffect(() => {
notifications.forEach(({ key, message, options = {}, dismissed = false }) => {
if (dismissed) {
// dismiss snackbar using notistack
closeSnackbar(key)
return
}
// do nothing if snackbar is already displayed
if (displayed.includes(key)) return
// display snackbar using notistack
enqueueSnackbar(message, {
key,
...options,
onClose: (event, reason, myKey) => {
if (options.onClose) {
options.onClose(event, reason, myKey)
}
},
onExited: (event, myKey) => {
// remove this snackbar from redux store
dispatch(removeSnackbar(myKey))
removeDisplayed(myKey)
}
})
// keep track of snackbars that we've displayed
storeDisplayed(key)
})
}, [notifications, closeSnackbar, enqueueSnackbar, dispatch])
}
export default useNotifier
|