import React , { useCallback , useEffect } from 'react' ; import { AggParamEditorProps , AggParamCommonProps } from './agg_param_props' ; import { DefaultEditorAggCommonProps } from './agg_common_props' ; import { AGG_PARAMS_ACTION_KEYS , AggParamsAction } from './agg_params_state' ; interface DefaultEditorAggParamProps < T > extends AggParamCommonProps < T > { paramEditor : React . ComponentType < AggParamEditorProps < T > > ; setAggParamValue : DefaultEditorAggCommonProps [ 'setAggParamValue' ] ; onChangeParamsState : React . Dispatch < AggParamsAction > ; } function DefaultEditorAggParam < T > ( props ) { const { agg , aggParam , paramEditor : ParamEditor , setAggParamValue , onChangeParamsState , ... rest } = props ; const setValidity = useCallback ( ( valid ) => { onChangeParamsState ( { type : AGG_PARAMS_ACTION_KEYS . VALID , paramName : aggParam . name , payload : valid , } ) ; } , [ onChangeParamsState , aggParam . name ] ) ; const setTouched = useCallback ( ( isTouched = true ) => { onChangeParamsState ( { type : AGG_PARAMS_ACTION_KEYS . TOUCHED , paramName : aggParam . name , payload : isTouched , } ) ; } , [ onChangeParamsState , aggParam . name ] ) ; const setValue = useCallback ( ( value ) => { if ( props . value !== value ) { setAggParamValue ( agg . id , aggParam . name , value ) ; } } , [ setAggParamValue , agg . id , aggParam . name , props . value ] ) ; useEffect ( ( ) => { if ( aggParam . shouldShow && ! aggParam . shouldShow ( agg ) ) { setValidity ( true ) ; } } , [ agg , agg . params . field , aggParam , setValidity ] ) ; if ( aggParam . shouldShow && ! aggParam . shouldShow ( agg ) ) { return null ; } return ( < ParamEditor agg = { agg } aggParam = { aggParam } setValidity = { setValidity } setTouched = { setTouched } setValue = { setValue } { ... rest } />); } export { DefaultEditorAggParam } ;