Skip to content

Commit

Permalink
[Logs Explorer] Fix Namespace Custom Filter (#192677)
Browse files Browse the repository at this point in the history
closes #191332

## 📝  Summary

This PR adds a new prop to the [Unified Field
List](https://github.com/elastic/kibana/blob/93acc6f7070786879b9e4821d21bcd1a9dbaa403/packages/kbn-unified-field-list/README.md#L5)
making it accept `additionalFilters` that applies to the `Available
Field List` as well as to the `Field Stats`

## 🎥 Demo


https://github.com/user-attachments/assets/f029fd2d-7bec-4a01-985e-2a94ce431f84
  • Loading branch information
mohamedhamed-ahmed authored Sep 18, 2024
1 parent 406f073 commit a2235c8
Show file tree
Hide file tree
Showing 6 changed files with 36 additions and 3 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import { UiCounterMetricType } from '@kbn/analytics';
import type { FieldsMetadataPublicStart } from '@kbn/fields-metadata-plugin/public';
import { Draggable } from '@kbn/dom-drag-drop';
import type { DataView, DataViewField } from '@kbn/data-views-plugin/public';
import { Filter } from '@kbn/es-query';
import type { SearchMode } from '../../types';
import { FieldItemButton, type FieldItemButtonProps } from '../../components/field_item_button';
import {
Expand Down Expand Up @@ -200,6 +201,10 @@ export interface UnifiedFieldListItemProps {
* Item size
*/
size: FieldItemButtonProps<DataViewField>['size'];
/**
* Custom filters to apply for the field list, ex: namespace custom filter
*/
additionalFilters?: Filter[];
}

function UnifiedFieldListItemComponent({
Expand All @@ -223,6 +228,7 @@ function UnifiedFieldListItemComponent({
groupIndex,
itemIndex,
size,
additionalFilters,
}: UnifiedFieldListItemProps) {
const [infoIsOpen, setOpen] = useState(false);

Expand Down Expand Up @@ -288,6 +294,7 @@ function UnifiedFieldListItemComponent({
multiFields={multiFields}
dataView={dataView}
onAddFilter={addFilterAndClosePopover}
additionalFilters={additionalFilters}
/>

{searchMode === 'documents' && multiFields && (
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -27,10 +27,11 @@ export interface UnifiedFieldListItemStatsProps {
dataView: DataView;
multiFields?: Array<{ field: DataViewField; isSelected: boolean }>;
onAddFilter: FieldStatsProps['onAddFilter'];
additionalFilters?: FieldStatsProps['filters'];
}

export const UnifiedFieldListItemStats: React.FC<UnifiedFieldListItemStatsProps> = React.memo(
({ stateService, services, field, dataView, multiFields, onAddFilter }) => {
({ stateService, services, field, dataView, multiFields, onAddFilter, additionalFilters }) => {
const querySubscriberResult = useQuerySubscriber({
data: services.data,
timeRangeUpdatesType: stateService.creationOptions.timeRangeUpdatesType,
Expand All @@ -55,6 +56,11 @@ export const UnifiedFieldListItemStats: React.FC<UnifiedFieldListItemStatsProps>
[services]
);

const filters = useMemo(
() => [...(querySubscriberResult.filters ?? []), ...(additionalFilters ?? [])],
[querySubscriberResult.filters, additionalFilters]
);

if (!hasQuerySubscriberData(querySubscriberResult)) {
return null;
}
Expand All @@ -63,7 +69,7 @@ export const UnifiedFieldListItemStats: React.FC<UnifiedFieldListItemStatsProps>
<FieldStats
services={statsServices}
query={querySubscriberResult.query}
filters={querySubscriberResult.filters}
filters={filters}
fromDate={querySubscriberResult.fromDate}
toDate={querySubscriberResult.toDate}
dataViewOrDataViewId={dataView}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,7 @@ export type UnifiedFieldListSidebarCustomizableProps = Pick<
| 'onAddFilter'
| 'onAddFieldToWorkspace'
| 'onRemoveFieldFromWorkspace'
| 'additionalFilters'
> & {
/**
* All fields: fields from data view and unmapped fields or columns from text-based search
Expand Down Expand Up @@ -168,6 +169,7 @@ export const UnifiedFieldListSidebarComponent: React.FC<UnifiedFieldListSidebarP
onDeleteField,
onToggleSidebar,
additionalFieldGroups,
additionalFilters,
}) => {
const { dataViews, core } = services;
const useNewFieldsApi = useMemo(
Expand Down Expand Up @@ -285,6 +287,7 @@ export const UnifiedFieldListSidebarComponent: React.FC<UnifiedFieldListSidebarP
groupName === FieldsGroupNames.SelectedFields ||
Boolean(selectedFieldsState.selectedFieldsMap[field.name])
}
additionalFilters={additionalFilters}
/>
</li>
),
Expand All @@ -304,6 +307,7 @@ export const UnifiedFieldListSidebarComponent: React.FC<UnifiedFieldListSidebarP
onDeleteField,
workspaceSelectedFieldNames,
selectedFieldsState.selectedFieldsMap,
additionalFilters,
]
);

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -117,6 +117,7 @@ const UnifiedFieldListSidebarContainer = memo(
prependInFlyout,
variant = 'responsive',
onFieldEdited,
additionalFilters,
} = props;
const [stateService] = useState<UnifiedFieldListSidebarContainerStateService>(
createStateService({ options: getCreationOptions() })
Expand Down Expand Up @@ -151,11 +152,16 @@ const UnifiedFieldListSidebarContainer = memo(
const searchMode: SearchMode | undefined = querySubscriberResult.searchMode;
const isAffectedByGlobalFilter = Boolean(querySubscriberResult.filters?.length);

const filters = useMemo(
() => [...(querySubscriberResult.filters ?? []), ...(additionalFilters ?? [])],
[querySubscriberResult.filters, additionalFilters]
);

const { isProcessing, refetchFieldsExistenceInfo } = useExistingFieldsFetcher({
disableAutoFetching: stateService.creationOptions.disableFieldsExistenceAutoFetching,
dataViews: searchMode === 'documents' && dataView ? [dataView] : [],
query: querySubscriberResult.query,
filters: querySubscriberResult.filters,
filters,
fromDate: querySubscriberResult.fromDate,
toDate: querySubscriberResult.toDate,
services,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,8 @@ export function DiscoverLayout({ stateContainer }: DiscoverLayoutProps) {
state.dataView!,
state.isDataViewLoading,
]);
const customFilters = useInternalStateSelector((state) => state.customFilters);

const dataState: DataMainMsg = useDataState(main$);
const savedSearch = useSavedSearchInitial();

Expand Down Expand Up @@ -401,6 +403,7 @@ export function DiscoverLayout({ stateContainer }: DiscoverLayoutProps) {
onFieldEdited={onFieldEdited}
onDataViewCreated={stateContainer.actions.onDataViewCreated}
sidebarToggleState$={sidebarToggleState$}
additionalFilters={customFilters}
/>
}
mainPanel={
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ import {
FieldsGroupNames,
} from '@kbn/unified-field-list';
import { calcFieldCounts } from '@kbn/discover-utils/src/utils/calc_field_counts';
import { Filter } from '@kbn/es-query';
import { PLUGIN_ID } from '../../../../../common';
import { useDiscoverServices } from '../../../../hooks/use_discover_services';
import { DataDocuments$ } from '../../state_management/discover_data_state_container';
Expand Down Expand Up @@ -127,6 +128,10 @@ export interface DiscoverSidebarResponsiveProps {
fieldListVariant?: UnifiedFieldListSidebarContainerProps['variant'];

sidebarToggleState$: BehaviorSubject<SidebarToggleState>;
/**
* Custom filters to apply for the field list, ex: namespace custom filter
*/
additionalFilters?: Filter[];
}

/**
Expand All @@ -153,6 +158,7 @@ export function DiscoverSidebarResponsive(props: DiscoverSidebarResponsiveProps)
onAddField,
onRemoveField,
sidebarToggleState$,
additionalFilters,
} = props;
const [sidebarState, dispatchSidebarStateAction] = useReducer(
discoverSidebarReducer,
Expand Down Expand Up @@ -383,6 +389,7 @@ export function DiscoverSidebarResponsive(props: DiscoverSidebarResponsiveProps)
onFieldEdited={onFieldEdited}
prependInFlyout={prependDataViewPickerForMobile}
additionalFieldGroups={additionalFieldGroups}
additionalFilters={additionalFilters}
/>
) : null}
</EuiFlexItem>
Expand Down

0 comments on commit a2235c8

Please sign in to comment.