import React , { useContext , createContext , useState } from 'react' ; import { Operation , Shard } from '../../types' ; const HighlightContext = createContext < { selectedRow : string ; setStore : ( args : OnHighlightChangeArgs & { id : string ; } ) => void ; } > ( null as any ) ; export interface OnHighlightChangeArgs { indexName : string ; shard : Shard ; operation : Operation ; } type OnHighlightChangeHandler = ( data : OnHighlightChangeArgs ) => void ; export const HighlightContextProvider = ( { children , onHighlight , } ) => { const [ selectedRow , setSelectedRow ] = useState < string > ( '' ) ; return ( < HighlightContext . Provider value = { { selectedRow , setStore : ( { id , ... onHighlightChangeArgs } ) => { onHighlight ( onHighlightChangeArgs ) ; setSelectedRow ( id ) ; } , } } > { children } < /HighlightContext.Provider>); } ; export const useHighlightContext = ( ) => { const ctx = useContext ( HighlightContext ) ; if ( ctx == null ) { throw new Error ( `useHighlightContext must be called inside HighlightContext` ) ; } return ctx ; } ;