diff --git a/src/plugins/discover/public/application/main/components/sidebar/discover_field.tsx b/src/plugins/discover/public/application/main/components/sidebar/discover_field.tsx
index e629c85c6d24..e14d9f7a0e5a 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/discover_field.tsx
+++ b/src/plugins/discover/public/application/main/components/sidebar/discover_field.tsx
@@ -25,6 +25,7 @@ import { i18n } from '@kbn/i18n';
import { UiCounterMetricType } from '@kbn/analytics';
import classNames from 'classnames';
import { FieldButton, FieldIcon } from '@kbn/react-field';
+import { getTypeForFieldIcon } from '../../../../utils/get_type_for_field_icon';
import { DiscoverFieldDetails } from './discover_field_details';
import { FieldDetails } from './types';
import type { DataViewField, DataView } from '../../../../../../data_views/public';
@@ -59,9 +60,10 @@ const FieldInfoIcon: React.FC = memo(() => (
));
const DiscoverFieldTypeIcon: React.FC<{ field: DataViewField }> = memo(({ field }) => {
- // If it's a string type, we want to distinguish between keyword and text
- const tempType = field.type === 'string' && field.esTypes ? field.esTypes[0] : field.type;
- return ;
+ const typeForIcon = getTypeForFieldIcon(field);
+ return (
+
+ );
});
const FieldName: React.FC<{ field: DataViewField }> = memo(({ field }) => {
diff --git a/src/plugins/discover/public/services/doc_views/components/doc_viewer_table/legacy/table.tsx b/src/plugins/discover/public/services/doc_views/components/doc_viewer_table/legacy/table.tsx
index aab4856d6698..aa44f0d56889 100644
--- a/src/plugins/discover/public/services/doc_views/components/doc_viewer_table/legacy/table.tsx
+++ b/src/plugins/discover/public/services/doc_views/components/doc_viewer_table/legacy/table.tsx
@@ -9,6 +9,7 @@
import '../table.scss';
import React, { useCallback, useMemo } from 'react';
import { EuiInMemoryTable } from '@elastic/eui';
+import { getTypeForFieldIcon } from '../../../../../utils/get_type_for_field_icon';
import { useDiscoverServices } from '../../../../../utils/use_discover_services';
import { flattenHit } from '../../../../../../../data/public';
import { SHOW_MULTIFIELDS } from '../../../../../../common';
@@ -73,7 +74,11 @@ export const DocViewerLegacyTable = ({
.map((field) => {
const fieldMapping = mapping(field);
const displayName = fieldMapping?.displayName ?? field;
- const fieldType = isNestedFieldParent(field, dataView) ? 'nested' : fieldMapping?.type;
+ const fieldType = isNestedFieldParent(field, dataView)
+ ? 'nested'
+ : fieldMapping
+ ? getTypeForFieldIcon(fieldMapping)
+ : undefined;
const ignored = getIgnoredReason(fieldMapping ?? field, hit._ignored);
return {
action: {
diff --git a/src/plugins/discover/public/services/doc_views/components/doc_viewer_table/table.tsx b/src/plugins/discover/public/services/doc_views/components/doc_viewer_table/table.tsx
index 7aa372e36adf..4742dd3d8f58 100644
--- a/src/plugins/discover/public/services/doc_views/components/doc_viewer_table/table.tsx
+++ b/src/plugins/discover/public/services/doc_views/components/doc_viewer_table/table.tsx
@@ -27,6 +27,7 @@ import {
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n-react';
import { debounce } from 'lodash';
+import { getTypeForFieldIcon } from '../../../../utils/get_type_for_field_icon';
import { useDiscoverServices } from '../../../../utils/use_discover_services';
import { Storage } from '../../../../../../kibana_utils/public';
import { usePager } from '../../../../utils/use_pager';
@@ -157,7 +158,11 @@ export const DocViewerTable = ({
(field: string) => {
const fieldMapping = mapping(field);
const displayName = fieldMapping?.displayName ?? field;
- const fieldType = isNestedFieldParent(field, dataView) ? 'nested' : fieldMapping?.type;
+ const fieldType = isNestedFieldParent(field, dataView)
+ ? 'nested'
+ : fieldMapping
+ ? getTypeForFieldIcon(fieldMapping)
+ : undefined;
const ignored = getIgnoredReason(fieldMapping ?? field, hit._ignored);
diff --git a/src/plugins/discover/public/utils/get_type_for_field_icon.test.ts b/src/plugins/discover/public/utils/get_type_for_field_icon.test.ts
new file mode 100644
index 000000000000..bffa0fecaed7
--- /dev/null
+++ b/src/plugins/discover/public/utils/get_type_for_field_icon.test.ts
@@ -0,0 +1,39 @@
+/*
+ * 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 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { DataViewField } from 'src/plugins/data_views/common';
+import { getTypeForFieldIcon } from './get_type_for_field_icon';
+
+describe('getTypeForFieldIcon', () => {
+ it('extracts type for non-string types', () => {
+ expect(
+ getTypeForFieldIcon({
+ type: 'not-string',
+ esTypes: ['bar'],
+ } as DataViewField)
+ ).toBe('not-string');
+ });
+
+ it('extracts type when type is string but esTypes is unavailable', () => {
+ expect(
+ getTypeForFieldIcon({
+ type: 'string',
+ esTypes: undefined,
+ } as DataViewField)
+ ).toBe('string');
+ });
+
+ it('extracts esType when type is string and esTypes is available', () => {
+ expect(
+ getTypeForFieldIcon({
+ type: 'string',
+ esTypes: ['version'],
+ } as DataViewField)
+ ).toBe('version');
+ });
+});
diff --git a/src/plugins/discover/public/utils/get_type_for_field_icon.ts b/src/plugins/discover/public/utils/get_type_for_field_icon.ts
new file mode 100644
index 000000000000..bb3f65ed3e01
--- /dev/null
+++ b/src/plugins/discover/public/utils/get_type_for_field_icon.ts
@@ -0,0 +1,17 @@
+/*
+ * 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 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { DataViewField } from 'src/plugins/data_views/common';
+
+/**
+ * Extracts the type from a data view field that will match the right icon.
+ *
+ * We define custom logic for Discover in order to distinguish between various "string" types.
+ */
+export const getTypeForFieldIcon = (field: DataViewField) =>
+ field.type === 'string' && field.esTypes ? field.esTypes[0] : field.type;