handleValueChange(id, optionId.replace(`${id}-`, ''))}
- buttonSize="compressed"
- isFullWidth
- data-test-subj={`${id}ButtonGroup`}
- />
- );
- };
-
- const selectionPanel = (
-
-
-
- {buttonGroup('aggregatable', aggregatableLabel)}
-
-
- {buttonGroup('searchable', searchableLabel)}
-
-
- {select('type', typeOptions, values.type)}
-
-
-
- );
-
- const helpButton = (
-
-
-
- );
-
- return (
-
-
-
- onChange('name', event.target.value)}
- placeholder={searchPlaceholder}
- value={value}
- />
-
-
-
- {!isPlainRecord && (
-
-
- {
- setPopoverOpen(false);
- }}
- button={buttonContent}
- >
-
- {i18n.translate('discover.fieldChooser.filter.filterByTypeLabel', {
- defaultMessage: 'Filter by type',
- })}
-
- {selectionPanel}
-
-
-
- {i18n.translate('discover.fieldChooser.popoverTitle', {
- defaultMessage: 'Field types',
- })}
-
-
-
-
-
-
-
- {i18n.translate('discover.fieldTypesPopover.learnMoreText', {
- defaultMessage: 'Learn more about',
- })}
-
-
-
-
-
-
-
-
-
-
- )}
-
- );
-}
diff --git a/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.scss b/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.scss
index d7190b61e33f3..806893269da34 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.scss
+++ b/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.scss
@@ -2,7 +2,7 @@
overflow: hidden;
margin: 0 !important;
flex-grow: 1;
- padding: $euiSizeS 0 $euiSizeS $euiSizeS;
+ padding: 0;
width: $euiSize * 19;
height: 100%;
@@ -13,6 +13,14 @@
}
}
+.dscSidebar__list {
+ padding: $euiSizeS 0 $euiSizeS $euiSizeS;
+
+ @include euiBreakpoint('xs', 's') {
+ padding: $euiSizeS 0 0 0;
+ }
+}
+
.dscSidebar__group {
height: 100%;
}
diff --git a/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.test.tsx b/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.test.tsx
index 86fda1b9a196d..28cb0b9bfde27 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.test.tsx
+++ b/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.test.tsx
@@ -17,7 +17,6 @@ import {
DiscoverSidebarProps,
} from './discover_sidebar';
import type { AggregateQuery, Query } from '@kbn/es-query';
-import { getDefaultFieldFilter } from './lib/field_filter';
import { createDiscoverServicesMock } from '../../../../__mocks__/services';
import { stubLogstashDataView } from '@kbn/data-plugin/common/stubs';
import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public';
@@ -29,7 +28,7 @@ import { VIEW_MODE } from '../../../../../common/constants';
import { DiscoverMainProvider } from '../../services/discover_state_provider';
import * as ExistingFieldsHookApi from '@kbn/unified-field-list-plugin/public/hooks/use_existing_fields';
import { ExistenceFetchStatus } from '@kbn/unified-field-list-plugin/public';
-import { getDataViewFieldList } from './lib/get_data_view_field_list';
+import { getDataViewFieldList } from './lib/get_field_list';
const mockGetActions = jest.fn>>, [string, { fieldName: string }]>(
() => Promise.resolve([])
@@ -66,7 +65,7 @@ function getCompProps(): DiscoverSidebarProps {
}
}
- const allFields = getDataViewFieldList(dataView, fieldCounts, false);
+ const allFields = getDataViewFieldList(dataView, fieldCounts);
(ExistingFieldsHookApi.useExistingFieldsReader as jest.Mock).mockClear();
(ExistingFieldsHookApi.useExistingFieldsReader as jest.Mock).mockImplementation(() => ({
@@ -100,8 +99,6 @@ function getCompProps(): DiscoverSidebarProps {
onRemoveField: jest.fn(),
selectedDataView: dataView,
trackUiMetric: jest.fn(),
- fieldFilter: getDefaultFieldFilter(),
- setFieldFilter: jest.fn(),
onFieldEdited: jest.fn(),
editField: jest.fn(),
viewMode: VIEW_MODE.DOCUMENT_LEVEL,
@@ -112,6 +109,7 @@ function getCompProps(): DiscoverSidebarProps {
useNewFieldsApi: true,
showFieldList: true,
isAffectedByGlobalFilter: false,
+ isProcessing: false,
};
}
diff --git a/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.tsx b/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.tsx
index ae16233c1fa6b..fc41760cc731e 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.tsx
+++ b/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.tsx
@@ -20,6 +20,8 @@ import { isOfAggregateQueryType } from '@kbn/es-query';
import { DataViewPicker } from '@kbn/unified-search-plugin/public';
import { type DataViewField, getFieldSubtypeMulti } from '@kbn/data-views-plugin/public';
import {
+ FieldList,
+ FieldListFilters,
FieldListGrouped,
FieldListGroupedProps,
FieldsGroupNames,
@@ -31,7 +33,6 @@ import { VIEW_MODE } from '../../../../../common/constants';
import { useAppStateSelector } from '../../services/discover_app_state_container';
import { useDiscoverServices } from '../../../../hooks/use_discover_services';
import { DiscoverField } from './discover_field';
-import { DiscoverFieldSearch } from './discover_field_search';
import { FIELDS_LIMIT_SETTING, PLUGIN_ID } from '../../../../../common';
import {
getSelectedFields,
@@ -39,7 +40,6 @@ import {
type SelectedFieldsResult,
INITIAL_SELECTED_FIELDS_RESULT,
} from './lib/group_fields';
-import { doesFieldMatchFilters, FieldFilterState, setFieldFilterProp } from './lib/field_filter';
import { DiscoverSidebarResponsiveProps } from './discover_sidebar_responsive';
import { getUiActions } from '../../../../kibana_services';
import { getRawRecordType } from '../../utils/get_raw_record_type';
@@ -49,13 +49,9 @@ const fieldSearchDescriptionId = htmlIdGenerator()();
export interface DiscoverSidebarProps extends DiscoverSidebarResponsiveProps {
/**
- * Current state of the field filter, filtering fields by name, type, ...
+ * Show loading instead of the field list if processing
*/
- fieldFilter: FieldFilterState;
- /**
- * Change current state of fieldFilter
- */
- setFieldFilter: (next: FieldFilterState) => void;
+ isProcessing: boolean;
/**
* Callback to close the flyout if sidebar is rendered in a flyout
@@ -82,7 +78,7 @@ export interface DiscoverSidebarProps extends DiscoverSidebarResponsiveProps {
createNewDataView?: () => void;
/**
- * All fields: fields from data view and unmapped fields
+ * All fields: fields from data view and unmapped fields or columns from text-based search
*/
allFields: DataViewField[] | null;
@@ -108,16 +104,15 @@ export interface DiscoverSidebarProps extends DiscoverSidebarResponsiveProps {
}
export function DiscoverSidebarComponent({
+ isProcessing,
alwaysShowActionButtons = false,
columns,
- fieldFilter,
documents$,
allFields,
onAddField,
onAddFilter,
onRemoveField,
selectedDataView,
- setFieldFilter,
trackUiMetric,
useNewFieldsApi = false,
onFieldEdited,
@@ -137,41 +132,6 @@ export function DiscoverSidebarComponent({
);
const query = useAppStateSelector((state) => state.query);
- const onChangeFieldSearch = useCallback(
- (filterName: string, value: string | boolean | undefined) => {
- const newState = setFieldFilterProp(fieldFilter, filterName, value);
- setFieldFilter(newState);
- },
- [fieldFilter, setFieldFilter]
- );
-
- const { fieldTypes, presentFieldTypes } = useMemo(() => {
- const result = ['any'];
- const dataViewFieldTypes = new Set();
- if (Array.isArray(allFields)) {
- for (const field of allFields) {
- if (field.type !== '_source') {
- // If it's a string type, we want to distinguish between keyword and text
- // For this purpose we need the ES type
- const type =
- field.type === 'string' &&
- field.esTypes &&
- ['keyword', 'text'].includes(field.esTypes[0])
- ? field.esTypes?.[0]
- : field.type;
- // _id and _index would map to string, that's why we don't add the string type here
- if (type && type !== 'string') {
- dataViewFieldTypes.add(type);
- }
- if (result.indexOf(field.type) === -1) {
- result.push(field.type);
- }
- }
- }
- }
- return { fieldTypes: result, presentFieldTypes: Array.from(dataViewFieldTypes) };
- }, [allFields]);
-
const showFieldStats = useMemo(() => viewMode === VIEW_MODE.DOCUMENT_LEVEL, [viewMode]);
const [selectedFieldsState, setSelectedFieldsState] = useState(
INITIAL_SELECTED_FIELDS_RESULT
@@ -181,9 +141,14 @@ export function DiscoverSidebarComponent({
>(undefined);
useEffect(() => {
- const result = getSelectedFields(selectedDataView, columns);
+ const result = getSelectedFields({
+ dataView: selectedDataView,
+ columns,
+ allFields,
+ isPlainRecord,
+ });
setSelectedFieldsState(result);
- }, [selectedDataView, columns, setSelectedFieldsState]);
+ }, [selectedDataView, columns, setSelectedFieldsState, allFields, isPlainRecord]);
useEffect(() => {
if (isPlainRecord || !useNewFieldsApi) {
@@ -244,12 +209,6 @@ export function DiscoverSidebarComponent({
}, [columns, selectedDataView, query]);
const popularFieldsLimit = useMemo(() => uiSettings.get(FIELDS_LIMIT_SETTING), [uiSettings]);
- const onFilterField: GroupedFieldsParams['onFilterField'] = useCallback(
- (field) => {
- return doesFieldMatchFilters(field, fieldFilter);
- },
- [fieldFilter]
- );
const onSupportedFieldFilter: GroupedFieldsParams['onSupportedFieldFilter'] =
useCallback(
(field) => {
@@ -267,7 +226,7 @@ export function DiscoverSidebarComponent({
};
}
}, []);
- const { fieldListGroupedProps } = useGroupedFields({
+ const { fieldListFiltersProps, fieldListGroupedProps } = useGroupedFields({
dataViewId: (!isPlainRecord && selectedDataView?.id) || null, // passing `null` for text-based queries
allFields,
popularFieldsLimit: !isPlainRecord ? popularFieldsLimit : 0,
@@ -277,18 +236,17 @@ export function DiscoverSidebarComponent({
dataViews,
core,
},
- onFilterField,
onSupportedFieldFilter,
onOverrideFieldGroupDetails,
});
const renderFieldItem: FieldListGroupedProps['renderFieldItem'] = useCallback(
- ({ field, groupName }) => (
+ ({ field, groupName, fieldSearchHighlight }) => (
)}
-
-
-
- {showFieldList && (
-
- )}
+ }
+ className="dscSidebar__list"
+ >
+ {showFieldList ? (
+
+ ) : (
+
+ )}
+ {!!editField && (
+
+ editField()}
+ size="s"
+ >
+ {i18n.translate('discover.fieldChooser.addField.label', {
+ defaultMessage: 'Add a field',
+ })}
+
+
+ )}
+ {isPlainRecord && (
+
+
+ {i18n.translate('discover.textBasedLanguages.visualize.label', {
+ defaultMessage: 'Visualize in Lens',
+ })}
+
+
+ )}
+
- {!!editField && (
-
- editField()}
- size="s"
- >
- {i18n.translate('discover.fieldChooser.addField.label', {
- defaultMessage: 'Add a field',
- })}
-
-
- )}
- {isPlainRecord && (
-
-
- {i18n.translate('discover.textBasedLanguages.visualize.label', {
- defaultMessage: 'Visualize in Lens',
- })}
-
-
- )}