import React from 'react' ; import { EuiButton } from '@elastic/eui' ; import { JsonEditor } from '../../../../src/plugins/opensearch_ui_shared/public' ; export const InputEditor = < T > ( props ) => { const input = JSON . stringify ( props . input , null , 4 ) ; const [ value , setValue ] = React . useState ( input ) ; const isValid = ( ( ) => { try { JSON . parse ( value ) ; return true ; } catch ( e ) { return false ; } } ) ( ) ; React . useEffect ( ( ) => { setValue ( input ) ; } , [ input ] ) ; return ( < > < JsonEditor value = { value } onUpdate = { ( v ) => setValue ( v . data . raw ) } euiCodeEditorProps = { { 'data-test-subj' : 'dashboardEmbeddableByValueInputEditor' , } } /> < EuiButton onClick = { ( ) => props . onSubmit ( JSON . parse ( value ) ) } disabled = { ! isValid } data - test - subj = { 'dashboardEmbeddableByValueInputSubmit' } > Update Input < /EuiButton> < />); } ;