import * as React from 'react' ; import MessageDialog from '../components/dialogs/MessageDialog' ; interface State { open : boolean ; title : string ; body : React . ReactNode ; backBtn : boolean ; } const defaultValue = { open : false , title : '' , body : < React . Fragment > < /React.Fragment>, backBtn : true , } ; export const MessageDialogProviderContext = React . createContext < { state : State ; dispatch : ( state : State ) => void ; } > ( { state : defaultValue , dispatch : ( ) => { } } ) ; const MessageDialogProvider = props => { const [ state , updateState ] = React . useState ( defaultValue ) ; return ( < MessageDialogProviderContext . Provider value = { { state , dispatch : updateState } } > < MessageDialog open = { state . open } title = { state . title } backBtn = { state . backBtn } onClose = { ( ) => { updateState ( { ... state , open : false } ) ; } } > { state . body } < /MessageDialog> { props . children } < /MessageDialogProviderContext.Provider>); } ; export default MessageDialogProvider ;