import React , { FC , useMemo } from 'react' ; import { EuiCodeBlock , EuiFlexGroup , EuiFlexItem } from '@elastic/eui' ; import type { FormattedStatus } from '../lib' ; interface StatusExpandedRowProps { status : FormattedStatus ; } export const StatusExpandedRow = ( { status } ) => { const { original } = status ; const statusAsString = useMemo ( ( ) => JSON . stringify ( original , null , 2 ) , [ original ] ) ; return ( < EuiFlexGroup > < EuiFlexItem grow = { true } > < EuiCodeBlock language = "json" overflowHeight = { 300 } isCopyable paddingSize = "none" transparentBackground = { true } > { statusAsString } < /EuiCodeBlock> < /EuiFlexItem> < /EuiFlexGroup>); } ;