import React , { Fragment } from 'react' ; import { EuiPanel , EuiSpacer } from '@elastic/eui' ; import { PivotGroupByConfigDict } from '../../../../common' ; import { GroupByLabelSummary } from './group_by_label_summary' ; interface ListProps { list : PivotGroupByConfigDict ; } export const GroupByListSummary = ( { list } ) => { const listKeys = Object . keys ( list ) ; return ( < Fragment > { listKeys . map ( ( optionsDataId ) => { return ( < Fragment key = { optionsDataId } > < EuiPanel paddingSize = "s" > < GroupByLabelSummary item = { list [ optionsDataId ] } optionsDataId = { optionsDataId } / > < /EuiPanel> { listKeys . length > 0 && < EuiSpacer size = "s" / > } < /Fragment>); } ) } < /Fragment>); } ;