From 69cd03503fb470a0daa830f0afcad559b091c18d Mon Sep 17 00:00:00 2001 From: Quynh Nguyen Date: Mon, 25 Jul 2022 15:57:28 -0500 Subject: [PATCH] [ML] Add popup for field type help --- .../data_visualizer/common/constants.ts | 120 ++++++++++++++ .../common/types/field_request_config.ts | 4 +- .../common/types/field_vis_config.ts | 6 +- .../data_visualizer/common/types/index.ts | 2 +- .../common/types/job_field_type.ts | 2 +- .../field_type_icon/field_type_icon.tsx | 4 +- .../field_types_filter/field_types_filter.tsx | 2 + .../field_types_help_popover.tsx | 152 ++++++++++++++++++ .../fields_stats_grid/get_field_names.ts | 6 +- .../multi_select_picker.tsx | 4 +- .../data_visualizer_stats_table.tsx | 4 +- .../common/util/field_types_utils.ts | 57 +++++-- .../index_data_visualizer_view.tsx | 6 +- .../search_panel/field_type_filter.tsx | 23 +-- .../components/search_panel/search_panel.tsx | 4 +- .../hooks/use_data_visualizer_grid_data.ts | 4 +- 16 files changed, 359 insertions(+), 41 deletions(-) create mode 100644 x-pack/plugins/data_visualizer/public/application/common/components/field_types_filter/field_types_help_popover.tsx diff --git a/x-pack/plugins/data_visualizer/common/constants.ts b/x-pack/plugins/data_visualizer/common/constants.ts index 1923613d72c58..52e2740301e0a 100644 --- a/x-pack/plugins/data_visualizer/common/constants.ts +++ b/x-pack/plugins/data_visualizer/common/constants.ts @@ -7,6 +7,7 @@ import { i18n } from '@kbn/i18n'; import { KBN_FIELD_TYPES } from '@kbn/data-plugin/common'; +import { DocLinksStart } from '@kbn/core/public'; export const APP_ID = 'data_visualizer'; export const UI_SETTING_MAX_FILE_SIZE = 'fileUpload:maxFileSize'; @@ -31,13 +32,19 @@ export const FILE_FORMATS = { export const SUPPORTED_FIELD_TYPES = { BOOLEAN: 'boolean', + CONFLICT: 'conflict', DATE: 'date', + DATE_RANGE: 'date_range', GEO_POINT: 'geo_point', GEO_SHAPE: 'geo_shape', HISTOGRAM: 'histogram', IP: 'ip', + IP_RANGE: 'ip_range', KEYWORD: 'keyword', + MURMUR3: 'murmur3', NUMBER: 'number', + NESTED: 'nested', + STRING: 'string', TEXT: 'text', VERSION: 'version', UNKNOWN: 'unknown', @@ -56,3 +63,116 @@ export const featureTitle = i18n.translate('xpack.dataVisualizer.title', { defaultMessage: 'Upload a file', }); export const featureId = `file_data_visualizer`; + +const UNKNOWN_FIELD_TYPE_DESC = i18n.translate( + 'xpack.dataVisualizer.index.fieldNameDescription.unknownField', + { + defaultMessage: 'Unknown field', + } +); + +export function getFieldTypeDescription(type: string, docLinks: DocLinksStart) { + switch (type) { + case SUPPORTED_FIELD_TYPES.BOOLEAN: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.booleanField', { + defaultMessage: 'True and false values.', + }); + case SUPPORTED_FIELD_TYPES.CONFLICT: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.conflictField', { + defaultMessage: 'Field has values of different types. Resolve in Management > Data Views.', + }); + case SUPPORTED_FIELD_TYPES.DATE: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.dateField', { + defaultMessage: 'A date string or the number of seconds or milliseconds since 1/1/1970.', + }); + case SUPPORTED_FIELD_TYPES.DATE_RANGE: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.dateRangeField', { + defaultMessage: 'Range of {dateFieldTypeLink} values. {viewSupportedDateFormatsLink}', + values: { + dateFieldTypeLink: + `` + + i18n.translate( + 'xpack.dataVisualizer.index.fieldNameDescription.dateRangeFieldLinkText', + { + defaultMessage: 'date', + } + ) + + '', + viewSupportedDateFormatsLink: + `` + + i18n.translate( + 'xpack.dataVisualizer.index.fieldNameDescription.viewSupportedDateFormatsLinkText', + { + defaultMessage: 'View supported date formats.', + } + ) + + '', + }, + }); + case SUPPORTED_FIELD_TYPES.GEO_POINT: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.geoPointField', { + defaultMessage: 'Latitude and longitude points.', + }); + case SUPPORTED_FIELD_TYPES.GEO_SHAPE: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.geoShapeField', { + defaultMessage: 'Complex shapes, such as polygons.', + }); + case SUPPORTED_FIELD_TYPES.HISTOGRAM: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.histogramField', { + defaultMessage: 'Pre-aggregated numerical values in the form of a histogram.', + }); + case SUPPORTED_FIELD_TYPES.IP: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.ipAddressField', { + defaultMessage: 'IPv4 and IPv6 addresses.', + }); + case SUPPORTED_FIELD_TYPES.IP_RANGE: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.ipAddressRangeField', { + defaultMessage: 'Range of ip values supporting either IPv4 or IPv6 (or mixed) addresses.', + }); + case SUPPORTED_FIELD_TYPES.MURMUR3: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.murmur3Field', { + defaultMessage: 'Field that computes and stores hashes of values.', + }); + case SUPPORTED_FIELD_TYPES.NESTED: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.nestedField', { + defaultMessage: 'JSON object that preserves the relationship between its subfields.', + }); + case SUPPORTED_FIELD_TYPES.NUMBER: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.numberField', { + defaultMessage: 'Long, integer, short, byte, double, and float values.', + }); + case SUPPORTED_FIELD_TYPES.STRING: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.stringField', { + defaultMessage: 'Full text such as the body of an email or a product description.', + }); + case SUPPORTED_FIELD_TYPES.TEXT: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.textField', { + defaultMessage: 'Full text such as the body of an email or a product description.', + }); + case SUPPORTED_FIELD_TYPES.KEYWORD: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.keywordField', { + defaultMessage: + 'Structured content such as an ID, email address, hostname, status code, or tag.', + }); + case SUPPORTED_FIELD_TYPES.VERSION: + return i18n.translate('xpack.dataVisualizer.index.fieldNameDescription.versionField', { + defaultMessage: 'Software versions. Supports {SemanticVersioningLink} precedence rules.', + values: { + SemanticVersioningLink: + `` + + i18n.translate( + 'xpack.dataVisualizer.index.advancedSettings.discover.fieldNameDescription.versionFieldLinkText', + { + defaultMessage: 'Semantic Versioning', + } + ) + + '', + }, + }); + default: + return UNKNOWN_FIELD_TYPE_DESC; + } +} diff --git a/x-pack/plugins/data_visualizer/common/types/field_request_config.ts b/x-pack/plugins/data_visualizer/common/types/field_request_config.ts index 4db8cc8aa7996..4caae792f052d 100644 --- a/x-pack/plugins/data_visualizer/common/types/field_request_config.ts +++ b/x-pack/plugins/data_visualizer/common/types/field_request_config.ts @@ -5,7 +5,7 @@ * 2.0. */ -import type { JobFieldType } from '.'; +import type { SupportedFieldType } from '.'; export interface Percentile { percent: number; @@ -15,7 +15,7 @@ export interface Percentile { export interface FieldRequestConfig { fieldName: string; - type: JobFieldType; + type: SupportedFieldType; cardinality: number; existsInDocs: boolean; } diff --git a/x-pack/plugins/data_visualizer/common/types/field_vis_config.ts b/x-pack/plugins/data_visualizer/common/types/field_vis_config.ts index 7f2419cc009db..d7da635ad4b05 100644 --- a/x-pack/plugins/data_visualizer/common/types/field_vis_config.ts +++ b/x-pack/plugins/data_visualizer/common/types/field_vis_config.ts @@ -5,7 +5,7 @@ * 2.0. */ -import type { Percentile, JobFieldType, FieldVisStats } from '.'; +import type { Percentile, SupportedFieldType, FieldVisStats } from '.'; export interface MetricFieldVisStats { avg?: number; distribution?: { @@ -21,7 +21,7 @@ export interface MetricFieldVisStats { // The internal representation of the configuration used to build the visuals // which display the field information. export interface FieldVisConfig { - type: JobFieldType; + type: SupportedFieldType; fieldName: string; displayName?: string; existsInDocs: boolean; @@ -34,7 +34,7 @@ export interface FieldVisConfig { } export interface FileBasedFieldVisConfig { - type: JobFieldType; + type: SupportedFieldType; fieldName?: string; displayName?: string; stats?: FieldVisStats; diff --git a/x-pack/plugins/data_visualizer/common/types/index.ts b/x-pack/plugins/data_visualizer/common/types/index.ts index 395c9f2f595c2..a116a6c535757 100644 --- a/x-pack/plugins/data_visualizer/common/types/index.ts +++ b/x-pack/plugins/data_visualizer/common/types/index.ts @@ -7,7 +7,7 @@ import type { SimpleSavedObject } from '@kbn/core/public'; import { isPopulatedObject } from '@kbn/ml-is-populated-object'; -export type { JobFieldType } from './job_field_type'; +export type { SupportedFieldType } from './job_field_type'; export type { FieldRequestConfig, DocumentCountBuckets, diff --git a/x-pack/plugins/data_visualizer/common/types/job_field_type.ts b/x-pack/plugins/data_visualizer/common/types/job_field_type.ts index bc44361a416c7..0fa3b35a64a88 100644 --- a/x-pack/plugins/data_visualizer/common/types/job_field_type.ts +++ b/x-pack/plugins/data_visualizer/common/types/job_field_type.ts @@ -6,4 +6,4 @@ */ import { SUPPORTED_FIELD_TYPES } from '../constants'; -export type JobFieldType = typeof SUPPORTED_FIELD_TYPES[keyof typeof SUPPORTED_FIELD_TYPES]; +export type SupportedFieldType = typeof SUPPORTED_FIELD_TYPES[keyof typeof SUPPORTED_FIELD_TYPES]; diff --git a/x-pack/plugins/data_visualizer/public/application/common/components/field_type_icon/field_type_icon.tsx b/x-pack/plugins/data_visualizer/public/application/common/components/field_type_icon/field_type_icon.tsx index ea24ba91cf7f2..f7b7ed8142aac 100644 --- a/x-pack/plugins/data_visualizer/public/application/common/components/field_type_icon/field_type_icon.tsx +++ b/x-pack/plugins/data_visualizer/public/application/common/components/field_type_icon/field_type_icon.tsx @@ -10,12 +10,12 @@ import { EuiToolTip } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { FieldIcon } from '@kbn/react-field'; import { getJobTypeLabel } from '../../util/field_types_utils'; -import type { JobFieldType } from '../../../../../common/types'; +import type { SupportedFieldType } from '../../../../../common/types'; import './_index.scss'; interface FieldTypeIconProps { tooltipEnabled: boolean; - type: JobFieldType; + type: SupportedFieldType; } export const FieldTypeIcon: FC = ({ tooltipEnabled = false, type }) => { diff --git a/x-pack/plugins/data_visualizer/public/application/common/components/field_types_filter/field_types_filter.tsx b/x-pack/plugins/data_visualizer/public/application/common/components/field_types_filter/field_types_filter.tsx index 0fa860bc6f55e..290403796eb91 100644 --- a/x-pack/plugins/data_visualizer/public/application/common/components/field_types_filter/field_types_filter.tsx +++ b/x-pack/plugins/data_visualizer/public/application/common/components/field_types_filter/field_types_filter.tsx @@ -8,6 +8,7 @@ import React, { FC, useMemo } from 'react'; import { i18n } from '@kbn/i18n'; import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; +import { FieldTypesHelpPopover } from './field_types_help_popover'; import { MultiSelectPicker, Option } from '../multi_select_picker'; import type { FileBasedFieldVisConfig, @@ -67,6 +68,7 @@ export const DataVisualizerFieldTypesFilter: FC = ({ onChange={setVisibleFieldTypes} checkedOptions={visibleFieldTypes} dataTestSubj={'dataVisualizerFieldTypeSelect'} + postfix={ f.value)} />} /> ); }; diff --git a/x-pack/plugins/data_visualizer/public/application/common/components/field_types_filter/field_types_help_popover.tsx b/x-pack/plugins/data_visualizer/public/application/common/components/field_types_filter/field_types_help_popover.tsx new file mode 100644 index 0000000000000..93a6974a89b24 --- /dev/null +++ b/x-pack/plugins/data_visualizer/public/application/common/components/field_types_filter/field_types_help_popover.tsx @@ -0,0 +1,152 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0; you may not use this file except in compliance with the Elastic License + * 2.0. + */ + +import { + EuiBasicTable, + EuiFilterButton, + EuiFlexGroup, + EuiFlexItem, + EuiIcon, + EuiLink, + EuiPanel, + EuiPopover, + EuiPopoverTitle, + EuiText, + useEuiTheme, +} from '@elastic/eui'; +import React, { FC, useMemo, useState } from 'react'; +import { i18n } from '@kbn/i18n'; +import { FieldIcon } from '@kbn/react-field'; +import { FormattedMessage } from '@kbn/i18n-react'; +import { getFieldTypeDescription } from '../../../../../common/constants'; +import { useDataVisualizerKibana } from '../../../kibana_context'; + +interface FieldTypeTableItem { + id: number; + dataType: string; + description: string; +} + +export const FieldTypesHelpPopover: FC<{ + fieldTypes: string[]; +}> = ({ fieldTypes }) => { + { + const { services } = useDataVisualizerKibana(); + const { docLinks } = services; + const { euiTheme } = useEuiTheme(); + + const [isHelpOpen, setIsHelpOpen] = useState(false); + + const onHelpClick = () => setIsHelpOpen((prevIsHelpOpen) => !prevIsHelpOpen); + const closeHelp = () => setIsHelpOpen(false); + + const items: FieldTypeTableItem[] = useMemo(() => { + return fieldTypes.map((type, index) => ({ + id: index, + dataType: type, + description: getFieldTypeDescription(type, docLinks), + })); + }, [fieldTypes, docLinks]); + + const columnsSidebar = [ + { + field: 'dataType', + name: i18n.translate('xpack.dataVisualizer.fieldTypesPopover.dataTypeColumnTitle', { + defaultMessage: 'Data type', + }), + width: '110px', + render: (name: string) => ( + + + + + {name} + + ), + }, + { + field: 'description', + name: i18n.translate('xpack.dataVisualizer.fieldTypesPopover.descriptionColumnTitle', { + defaultMessage: 'Description', + }), + // eslint-disable-next-line react/no-danger + render: (description: string) =>
, + }, + ]; + + const helpButton = ( + + + + ); + return ( + + + {i18n.translate('xpack.dataVisualizer.fieldChooser.popoverTitle', { + defaultMessage: 'Field types', + })} + + + + id="dataVisualizerFieldTypesHelpBasicTableId" + tableCaption={i18n.translate('xpack.dataVisualizer.fieldTypesPopover.tableTitle', { + defaultMessage: 'Description of field types', + })} + items={items} + compressed={true} + rowHeader="firstName" + columns={columnsSidebar} + responsive={false} + /> + + + +

+ {i18n.translate('xpack.dataVisualizer.fieldTypesPopover.learnMoreText', { + defaultMessage: 'Learn more about', + })} +   + + + +

+ + + + ); + } +}; diff --git a/x-pack/plugins/data_visualizer/public/application/common/components/fields_stats_grid/get_field_names.ts b/x-pack/plugins/data_visualizer/public/application/common/components/fields_stats_grid/get_field_names.ts index b0750278ab9e3..c3026496cf5c8 100644 --- a/x-pack/plugins/data_visualizer/public/application/common/components/fields_stats_grid/get_field_names.ts +++ b/x-pack/plugins/data_visualizer/public/application/common/components/fields_stats_grid/get_field_names.ts @@ -8,7 +8,7 @@ import { difference } from 'lodash'; import { ES_FIELD_TYPES } from '@kbn/data-plugin/common'; import type { FindFileStructureResponse } from '@kbn/file-upload-plugin/common'; -import type { JobFieldType } from '../../../../../common/types'; +import type { SupportedFieldType } from '../../../../../common/types'; import { SUPPORTED_FIELD_TYPES } from '../../../../../common/constants'; export function getFieldNames(results: FindFileStructureResponse) { const { mappings, field_stats: fieldStats, column_names: columnNames } = results; @@ -34,7 +34,7 @@ export function getFieldNames(results: FindFileStructureResponse) { return tempFields; } -export function getSupportedFieldType(type: string): JobFieldType { +export function getSupportedFieldType(type: string): SupportedFieldType { switch (type) { case ES_FIELD_TYPES.FLOAT: case ES_FIELD_TYPES.HALF_FLOAT: @@ -51,6 +51,6 @@ export function getSupportedFieldType(type: string): JobFieldType { return SUPPORTED_FIELD_TYPES.DATE; default: - return type as JobFieldType; + return type as SupportedFieldType; } } diff --git a/x-pack/plugins/data_visualizer/public/application/common/components/multi_select_picker/multi_select_picker.tsx b/x-pack/plugins/data_visualizer/public/application/common/components/multi_select_picker/multi_select_picker.tsx index 24523450a0e7d..741706a9f45b9 100644 --- a/x-pack/plugins/data_visualizer/public/application/common/components/multi_select_picker/multi_select_picker.tsx +++ b/x-pack/plugins/data_visualizer/public/application/common/components/multi_select_picker/multi_select_picker.tsx @@ -59,7 +59,8 @@ export const MultiSelectPicker: FC<{ title?: string; checkedOptions: string[]; dataTestSubj: string; -}> = ({ options, onChange, title, checkedOptions, dataTestSubj }) => { + postfix?: React.ReactElement; +}> = ({ options, onChange, title, checkedOptions, dataTestSubj, postfix }) => { const euiTheme = useCurrentEuiTheme(); const [items, setItems] = useState(options); @@ -161,6 +162,7 @@ export const MultiSelectPicker: FC<{ )}
+ {postfix ? postfix : null} ); }; diff --git a/x-pack/plugins/data_visualizer/public/application/common/components/stats_table/data_visualizer_stats_table.tsx b/x-pack/plugins/data_visualizer/public/application/common/components/stats_table/data_visualizer_stats_table.tsx index 8b38563591e3d..63caec538ea5e 100644 --- a/x-pack/plugins/data_visualizer/public/application/common/components/stats_table/data_visualizer_stats_table.tsx +++ b/x-pack/plugins/data_visualizer/public/application/common/components/stats_table/data_visualizer_stats_table.tsx @@ -27,7 +27,7 @@ import { EuiTableComputedColumnType } from '@elastic/eui/src/components/basic_ta import { throttle } from 'lodash'; import { css } from '@emotion/react'; import { SUPPORTED_FIELD_TYPES } from '../../../../../common/constants'; -import type { JobFieldType, DataVisualizerTableState } from '../../../../../common/types'; +import type { SupportedFieldType, DataVisualizerTableState } from '../../../../../common/types'; import { DocumentStat } from './components/field_data_row/document_stats'; import { IndexBasedNumberContentPreview } from './components/field_data_row/number_content_preview'; @@ -188,7 +188,7 @@ export const DataVisualizerTable = ({ name: i18n.translate('xpack.dataVisualizer.dataGrid.typeColumnName', { defaultMessage: 'Type', }), - render: (fieldType: JobFieldType) => { + render: (fieldType: SupportedFieldType) => { return ; }, width: dimensions.type, diff --git a/x-pack/plugins/data_visualizer/public/application/common/util/field_types_utils.ts b/x-pack/plugins/data_visualizer/public/application/common/util/field_types_utils.ts index 5d1293f0a22b3..0c7d224fd1c13 100644 --- a/x-pack/plugins/data_visualizer/public/application/common/util/field_types_utils.ts +++ b/x-pack/plugins/data_visualizer/public/application/common/util/field_types_utils.ts @@ -8,22 +8,35 @@ import { i18n } from '@kbn/i18n'; import { DataViewField } from '@kbn/data-views-plugin/public'; import { KBN_FIELD_TYPES } from '@kbn/data-plugin/common'; +import { SupportedFieldType } from '../../../../common/types'; import { SUPPORTED_FIELD_TYPES } from '../../../../common/constants'; export const getJobTypeLabel = (type: string) => { return type in jobTypeLabels ? jobTypeLabels[type as keyof typeof jobTypeLabels] : null; }; -export const jobTypeLabels = { +export const jobTypeLabels: Record = { [SUPPORTED_FIELD_TYPES.BOOLEAN]: i18n.translate( 'xpack.dataVisualizer.fieldTypeIcon.booleanTypeLabel', { defaultMessage: 'Boolean', } ), + [SUPPORTED_FIELD_TYPES.CONFLICT]: i18n.translate( + 'xpack.dataVisualizer.fieldTypeIcon.conflictTypeLabel', + { + defaultMessage: 'Conflict', + } + ), [SUPPORTED_FIELD_TYPES.DATE]: i18n.translate('xpack.dataVisualizer.fieldTypeIcon.dateTypeLabel', { defaultMessage: 'Date', }), + [SUPPORTED_FIELD_TYPES.DATE_RANGE]: i18n.translate( + 'xpack.dataVisualizer.fieldTypeIcon.dateRangeTypeLabel', + { + defaultMessage: 'Date range', + } + ), [SUPPORTED_FIELD_TYPES.GEO_POINT]: i18n.translate( 'xpack.dataVisualizer.fieldTypeIcon.geoPointTypeLabel', { @@ -36,13 +49,31 @@ export const jobTypeLabels = { defaultMessage: 'Geo shape', } ), + [SUPPORTED_FIELD_TYPES.HISTOGRAM]: i18n.translate( + 'xpack.dataVisualizer.fieldTypeIcon.histogramTypeLabel', + { + defaultMessage: 'Histogram', + } + ), [SUPPORTED_FIELD_TYPES.IP]: i18n.translate('xpack.dataVisualizer.fieldTypeIcon.ipTypeLabel', { defaultMessage: 'IP', }), - [SUPPORTED_FIELD_TYPES.KEYWORD]: i18n.translate( - 'xpack.dataVisualizer.fieldTypeIcon.keywordTypeLabel', + [SUPPORTED_FIELD_TYPES.IP_RANGE]: i18n.translate( + 'xpack.dataVisualizer.fieldTypeIcon.ipRangeTypeLabel', { - defaultMessage: 'Keyword', + defaultMessage: 'IP range', + } + ), + [SUPPORTED_FIELD_TYPES.MURMUR3]: i18n.translate( + 'xpack.dataVisualizer.fieldTypeIcon.murmur3TypeLabel', + { + defaultMessage: 'Murmur3', + } + ), + [SUPPORTED_FIELD_TYPES.NESTED]: i18n.translate( + 'xpack.dataVisualizer.fieldTypeIcon.numberTypeLabel', + { + defaultMessage: 'Number', } ), [SUPPORTED_FIELD_TYPES.NUMBER]: i18n.translate( @@ -51,19 +82,19 @@ export const jobTypeLabels = { defaultMessage: 'Number', } ), - [SUPPORTED_FIELD_TYPES.HISTOGRAM]: i18n.translate( - 'xpack.dataVisualizer.fieldTypeIcon.histogramTypeLabel', + [SUPPORTED_FIELD_TYPES.STRING]: i18n.translate( + 'xpack.dataVisualizer.fieldTypeIcon.stringTypeLabel', { - defaultMessage: 'Histogram', + defaultMessage: 'String', } ), [SUPPORTED_FIELD_TYPES.TEXT]: i18n.translate('xpack.dataVisualizer.fieldTypeIcon.textTypeLabel', { defaultMessage: 'Text', }), - [SUPPORTED_FIELD_TYPES.UNKNOWN]: i18n.translate( - 'xpack.dataVisualizer.fieldTypeIcon.unknownTypeLabel', + [SUPPORTED_FIELD_TYPES.KEYWORD]: i18n.translate( + 'xpack.dataVisualizer.fieldTypeIcon.keywordTypeLabel', { - defaultMessage: 'Unknown', + defaultMessage: 'Keyword', } ), [SUPPORTED_FIELD_TYPES.VERSION]: i18n.translate( @@ -72,6 +103,12 @@ export const jobTypeLabels = { defaultMessage: 'Version', } ), + [SUPPORTED_FIELD_TYPES.UNKNOWN]: i18n.translate( + 'xpack.dataVisualizer.fieldTypeIcon.unknownTypeLabel', + { + defaultMessage: 'Unknown', + } + ), }; // convert kibana types to ML Job types diff --git a/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/components/index_data_visualizer_view/index_data_visualizer_view.tsx b/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/components/index_data_visualizer_view/index_data_visualizer_view.tsx index e0f4c24e2d96c..93099f0201235 100644 --- a/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/components/index_data_visualizer_view/index_data_visualizer_view.tsx +++ b/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/components/index_data_visualizer_view/index_data_visualizer_view.tsx @@ -37,7 +37,7 @@ import { IndexBasedDataVisualizerExpandedRow } from '../../../common/components/ import { DATA_VISUALIZER_INDEX_VIEWER } from '../../constants/index_data_visualizer_viewer'; import { DataVisualizerIndexBasedAppState } from '../../types/index_data_visualizer_state'; import { SEARCH_QUERY_LANGUAGE, SearchQueryLanguage } from '../../types/combined_query'; -import { JobFieldType, SavedSearchSavedObject } from '../../../../../common/types'; +import { SupportedFieldType, SavedSearchSavedObject } from '../../../../../common/types'; import { useDataVisualizerKibana } from '../../../kibana_context'; import { FieldCountPanel } from '../../../common/components/field_count_panel'; import { DocumentCountContent } from '../../../common/components/document_count_content'; @@ -180,10 +180,10 @@ export const IndexDataVisualizerView: FC = (dataVi const fieldTypes = useMemo(() => { // Obtain the list of non metric field types which appear in the index pattern. - const indexedFieldTypes: JobFieldType[] = []; + const indexedFieldTypes: SupportedFieldType[] = []; dataViewFields.forEach((field) => { if (!OMIT_FIELDS.includes(field.name) && field.scripted !== true) { - const dataVisualizerType: JobFieldType | undefined = kbnTypeToJobType(field); + const dataVisualizerType: SupportedFieldType | undefined = kbnTypeToJobType(field); if (dataVisualizerType !== undefined && !indexedFieldTypes.includes(dataVisualizerType)) { indexedFieldTypes.push(dataVisualizerType); } diff --git a/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/components/search_panel/field_type_filter.tsx b/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/components/search_panel/field_type_filter.tsx index 0bf61865f30c6..f438780e8dbe4 100644 --- a/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/components/search_panel/field_type_filter.tsx +++ b/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/components/search_panel/field_type_filter.tsx @@ -8,13 +8,14 @@ import React, { FC, useMemo } from 'react'; import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; -import type { JobFieldType } from '../../../../../common/types'; +import { FieldTypesHelpPopover } from '../../../common/components/field_types_filter/field_types_help_popover'; +import type { SupportedFieldType } from '../../../../../common/types'; import { FieldTypeIcon } from '../../../common/components/field_type_icon'; import { MultiSelectPicker, Option } from '../../../common/components/multi_select_picker'; import { jobTypeLabels } from '../../../common/util/field_types_utils'; export const DataVisualizerFieldTypeFilter: FC<{ - indexedFieldTypes: JobFieldType[]; + indexedFieldTypes: SupportedFieldType[]; setVisibleFieldTypes(q: string[]): void; visibleFieldTypes: string[]; }> = ({ indexedFieldTypes, setVisibleFieldTypes, visibleFieldTypes }) => { @@ -37,6 +38,7 @@ export const DataVisualizerFieldTypeFilter: FC<{ }; }); }, [indexedFieldTypes]); + const fieldTypeTitle = useMemo( () => i18n.translate('xpack.dataVisualizer.index.fieldTypeSelect', { @@ -45,12 +47,15 @@ export const DataVisualizerFieldTypeFilter: FC<{ [] ); return ( - + <> + } + /> + ); }; diff --git a/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/components/search_panel/search_panel.tsx b/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/components/search_panel/search_panel.tsx index 5dc3eee801abd..faf0d5476695e 100644 --- a/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/components/search_panel/search_panel.tsx +++ b/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/components/search_panel/search_panel.tsx @@ -14,7 +14,7 @@ import { DataView, DataViewField } from '@kbn/data-views-plugin/public'; import { ShardSizeFilter } from './shard_size_select'; import { DataVisualizerFieldNamesFilter } from './field_name_filter'; import { DataVisualizerFieldTypeFilter } from './field_type_filter'; -import { JobFieldType } from '../../../../../common/types'; +import { SupportedFieldType } from '../../../../../common/types'; import { SearchQueryLanguage } from '../../types/combined_query'; import { useDataVisualizerKibana } from '../../../kibana_context'; import './_index.scss'; @@ -28,7 +28,7 @@ interface Props { samplerShardSize: number; setSamplerShardSize(s: number): void; overallStats: OverallStats; - indexedFieldTypes: JobFieldType[]; + indexedFieldTypes: SupportedFieldType[]; setVisibleFieldTypes(q: string[]): void; visibleFieldTypes: string[]; setVisibleFieldNames(q: string[]): void; diff --git a/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/hooks/use_data_visualizer_grid_data.ts b/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/hooks/use_data_visualizer_grid_data.ts index 2b9c83c925376..e8e3713fc19fd 100644 --- a/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/hooks/use_data_visualizer_grid_data.ts +++ b/x-pack/plugins/data_visualizer/public/application/index_data_visualizer/hooks/use_data_visualizer_grid_data.ts @@ -26,7 +26,7 @@ import { NON_AGGREGATABLE_FIELD_TYPES, OMIT_FIELDS, } from '../../../../common/constants'; -import type { FieldRequestConfig, JobFieldType } from '../../../../common/types'; +import type { FieldRequestConfig, SupportedFieldType } from '../../../../common/types'; import { kbnTypeToJobType } from '../../common/util/field_types_utils'; import { getActions } from '../../common/components/field_data_row/action_menu'; import { DataVisualizerGridInput } from '../embeddables/grid_embeddable/grid_embeddable'; @@ -428,7 +428,7 @@ export const useDataVisualizerGridData = ( } else { // Add a flag to indicate that this is one of the 'other' Kibana // field types that do not yet have a specific card type. - nonMetricConfig.type = field.type as JobFieldType; + nonMetricConfig.type = field.type as SupportedFieldType; nonMetricConfig.isUnsupportedType = true; }