import React from 'react' ; import { useValues } from 'kea' ; import { EuiTable , EuiTableBody } from '@elastic/eui' ; import { ResultSettingsLogic } from '..' ; import { ColumnHeaders } from './column_headers' ; import { DisabledFieldsBody } from './disabled_fields_body' ; import { DisabledFieldsHeader } from './disabled_fields_header' ; import { NonTextFieldsBody } from './non_text_fields_body' ; import { NonTextFieldsHeader } from './non_text_fields_header' ; import { TextFieldsBody } from './text_fields_body' ; import { TextFieldsHeader } from './text_fields_header' ; import './result_settings_table.scss' ; export const ResultSettingsTable = ( ) => { const { schemaConflicts , textResultFields , nonTextResultFields } = useValues ( ResultSettingsLogic ) ; return ( < EuiTable className = "resultSettingsTable" responsive = { false } > < ColumnHeaders /> { ! ! Object . keys ( textResultFields ) . length && ( < EuiTableBody > < TextFieldsHeader /> < TextFieldsBody / > < /EuiTableBody>)} { ! ! Object . keys ( nonTextResultFields ) . length && ( < EuiTableBody className = "resultSettingsTable__subHeader" > < NonTextFieldsHeader /> < NonTextFieldsBody / > < /EuiTableBody>)} { ! ! Object . keys ( schemaConflicts ) . length && ( < EuiTableBody className = "resultSettingsTable__subHeader" > < DisabledFieldsHeader /> < DisabledFieldsBody / > < /EuiTableBody>)} < /EuiTable>); } ;