import React , { createContext , useState , useMemo } from 'react' ; export const TimeRangeIdContext = createContext < { incrementTimeRangeId : ( ) => void ; timeRangeId : number ; } > ( { incrementTimeRangeId : ( ) => { } , timeRangeId : 0 , } ) ; export function TimeRangeIdContextProvider ( { children , } ) { const [ timeRangeId , setTimeRangeId ] = useState ( 0 ) ; const api = useMemo ( ( ) => { return { incrementTimeRangeId : ( ) => setTimeRangeId ( ( id ) => id + 1 ) , timeRangeId , } ; } , [ timeRangeId , setTimeRangeId ] ) ; return ( < TimeRangeIdContext . Provider value = { api } > { children } < /TimeRangeIdContext.Provider>); }