import * as React from "react" ; interface Props { initialUserName : string ; editingName : string ; onNameUpdated : ( ) => any ; onEditingNameUpdated : ( newEditingName : string ) => any ; disabled : boolean ; } export const NameEditComponent = ( props ) => { const onChange = ( e ) => { props . onEditingNameUpdated ( e . target . value ) ; } ; const onNameSubmit = ( event ) : any => { props . onNameUpdated ( ) ; } ; return ( < > < label > Update name : < /label> < input value = { props . editingName } onChange = { onChange } / > < button onClick = { onNameSubmit } disabled = { props . disabled } > Change < /button> < />); } ;