import { AnyAction , SideEffect } from '@fluentui/state' ; import * as React from 'react' ; type Dispatch < Action extends AnyAction > = ( e : DispatchEvent , action : Action , ... args : Parameters < Action > ) => void ; type DispatchEffect < State > = ( e : DispatchEvent , prevState : State , nextState : State ) => void ; type DispatchEvent = React . SyntheticEvent | Event ; const useDispatchEffect = < State > ( dispatchEffect ) : [ Dispatch < AnyAction > , SideEffect < State > ] => { const latestEffect = React . useRef < DispatchEffect < State > > ( dispatchEffect ) ; const latestEvent = React . useRef < DispatchEvent | null > ( null ) ; latestEffect . current = dispatchEffect ; const dispatch = React . useCallback < Dispatch < AnyAction > > ( ( e , action , ... args ) => { latestEvent . current = e ; action ( ... args ) ; latestEvent . current = null ; } , [ ] ) ; const sideEffect = React . useCallback < SideEffect < State > > ( ( prevState , nextState ) => { return latestEffect . current ( latestEvent . current as DispatchEvent , prevState , nextState ) ; } , [ ] ) ; return [ dispatch , sideEffect ] ; } ; export default useDispatchEffect ;