import React , { FC , useContext , useState , useMemo } from 'react' ; import PropTypes from 'prop-types' ; import { BLEEPS_CATEGORIES , BleepsAudioSettings , BleepsPlayersSettings , BleepsSettings , BleepCategoryName , BleepsGenerics , BleepsSetup } from '../constants' ; import { BleepsContext } from '../BleepsContext' ; import { createOrUpdateBleeps } from '../utils/createOrUpdateBleeps' ; interface BleepsProviderProps { audioSettings ? : BleepsAudioSettings ; playersSettings ? : BleepsPlayersSettings ; bleepsSettings ? : BleepsSettings ; } const BleepsProvider = props => { const parentSetup = useContext ( BleepsContext ) ; const [ bleepsGenerics ] = useState < BleepsGenerics > ( { } ) ; const bleepsSetup = useMemo ( ( ) => { const parentAudioCategories = parentSetup ?. audioSettings . categories ; const localAudioCategories = props . audioSettings ?. categories ; const audioCategories = { ... parentAudioCategories } ; if ( localAudioCategories ) { Object . keys ( localAudioCategories ) . forEach ( key => { const categoryName = key as BleepCategoryName ; if ( process . env . NODE_ENV !== 'production' && ! BLEEPS_CATEGORIES . includes ( categoryName ) ) { throw new Error ( `Bleep category "${ categoryName }" is not valid.` ) ; } audioCategories [ categoryName ] = { ... audioCategories [ categoryName ] , ... localAudioCategories ?. [ categoryName ] } ; } ) ; } const audioSettings = { common : { ... parentSetup ?. audioSettings . common , ... props . audioSettings ?. common } , categories : audioCategories } ; const parentPlayersSettings = parentSetup ?. playersSettings ; const playersSettings = { ... parentPlayersSettings } ; if ( props . playersSettings ) { Object . keys ( props . playersSettings ) . forEach ( playerName => { playersSettings [ playerName ] = { ... playersSettings [ playerName ] , ... props . playersSettings ?. [ playerName ] } ; } ) ; } const parentBleepsSettings = parentSetup ?. bleepsSettings ; const bleepsSettings = { ... parentBleepsSettings , ... props . bleepsSettings } ; createOrUpdateBleeps ( bleepsGenerics , audioSettings , playersSettings , bleepsSettings ) ; return { audioSettings , playersSettings , bleepsSettings , bleepsGenerics } ; } , [ props . audioSettings , props . playersSettings , parentSetup ] ) ; return ( < BleepsContext . Provider value = { bleepsSetup } > { props . children } < /BleepsContext.Provider>); } ; const bleepsAudioGroupSettingsProps = PropTypes . shape ( { volume : PropTypes . number , rate : PropTypes . number , preload : PropTypes . bool , disabled : PropTypes . bool } ) ; BleepsProvider . propTypes = { audioSettings : PropTypes . shape ( { common : bleepsAudioGroupSettingsProps , categories : PropTypes . shape ( { background : bleepsAudioGroupSettingsProps , transition : bleepsAudioGroupSettingsProps , interaction : bleepsAudioGroupSettingsProps , notification : bleepsAudioGroupSettingsProps } ) } ) , playersSettings : PropTypes . object , bleepsSettings : PropTypes . object } ; export { BleepsProviderProps , BleepsProvider } ;