github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 17:59:23 -04:00
Code Issues Projects Releases Packages Wiki Activity

Add exact match filtering to in memory tables (#81539) (#81570)

Browse source
This commit is contained in:
Jen Huang 2020-10-23 15:51:27 -07:00 • committed by GitHub
parent 252dd625f1
commit 485b4c4791
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 41 additions and 48 deletions
Download patch file Download diff file Expand all files Collapse all files

26
x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/agent_policy/details_page/components/package_policies/package_policies_table.tsx
View file

@ -22,7 +22,6 @@ import { useCapabilities, useLink } from '../../../../../hooks';
import { useAgentPolicyRefresh } from '../../hooks';
interface InMemoryPackagePolicy extends PackagePolicy {
inputTypes: string[];
packageName?: string;
packageTitle?: string;
packageVersion?: string;
@ -56,11 +55,7 @@ export const PackagePoliciesTable: React.FunctionComponent<Props> = ({
// With the package policies provided on input, generate the list of package policies
// used in the InMemoryTable (flattens some values for search) as well as
// the list of options that will be used in the filters dropdowns
const [packagePolicies, namespaces, inputTypes] = useMemo((): [
InMemoryPackagePolicy[],
FilterOption[],
FilterOption[]
] => {
const [packagePolicies, namespaces] = useMemo((): [InMemoryPackagePolicy[], FilterOption[]] => {
const namespacesValues: string[] = [];
const inputTypesValues: string[] = [];
const mappedPackagePolicies = originalPackagePolicies.map<InMemoryPackagePolicy>(
@ -69,13 +64,8 @@ export const PackagePoliciesTable: React.FunctionComponent<Props> = ({
namespacesValues.push(packagePolicy.namespace);
}
const dsInputTypes: string[] = [];
dsInputTypes.sort(stringSortAscending);
return {
...packagePolicy,
inputTypes: dsInputTypes,
packageName: packagePolicy.package?.name ?? '',
packageTitle: packagePolicy.package?.title ?? '',
packageVersion: packagePolicy.package?.version ?? '',
@ -86,11 +76,7 @@ export const PackagePoliciesTable: React.FunctionComponent<Props> = ({
namespacesValues.sort(stringSortAscending);
inputTypesValues.sort(stringSortAscending);
return [
mappedPackagePolicies,
namespacesValues.map(toFilterOption),
inputTypesValues.map(toFilterOption),
];
return [mappedPackagePolicies, namespacesValues.map(toFilterOption)];
}, [originalPackagePolicies]);
const columns = useMemo(
@ -273,13 +259,7 @@ export const PackagePoliciesTable: React.FunctionComponent<Props> = ({
name: 'Namespace',
options: namespaces,
multiSelect: 'or',
},
{
type: 'field_value_selection',
field: 'inputTypes',
name: 'Input types',
options: inputTypes,
multiSelect: 'or',
operator: 'exact',
},
],
}}

63
x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/data_stream/list_page/index.tsx
View file

@ -182,7 +182,12 @@ export const DataStreamListPage: React.FunctionComponent<{}> = () => {
[]
);
const filterOptions: { [key: string]: string[] } = {
const filterOptions: {
[key: string]: Array<{
value: string;
name: string;
}>;
} = {
dataset: [],
type: [],
namespace: [],
@ -190,21 +195,37 @@ export const DataStreamListPage: React.FunctionComponent<{}> = () => {
};
if (dataStreamsData && dataStreamsData.data_streams.length) {
const dataValues: {
[key: string]: string[];
} = {
dataset: [],
type: [],
namespace: [],
package: [],
};
dataStreamsData.data_streams.forEach((stream) => {
const { dataset, type, namespace, package: pkg } = stream;
if (!filterOptions.dataset.includes(dataset)) {
filterOptions.dataset.push(dataset);
if (!dataValues.dataset.includes(dataset)) {
dataValues.dataset.push(dataset);
}
if (!filterOptions.type.includes(type)) {
filterOptions.type.push(type);
if (!dataValues.type.includes(type)) {
dataValues.type.push(type);
}
if (!filterOptions.namespace.includes(namespace)) {
filterOptions.namespace.push(namespace);
if (!dataValues.namespace.includes(namespace)) {
dataValues.namespace.push(namespace);
}
if (!filterOptions.package.includes(pkg)) {
filterOptions.package.push(pkg);
if (!dataValues.package.includes(pkg)) {
dataValues.package.push(pkg);
}
});
for (const field in dataValues) {
if (filterOptions[field]) {
filterOptions[field] = dataValues[field].sort().map((option) => ({
value: option,
name: option,
}));
}
}
}
return (
@ -266,10 +287,8 @@ export const DataStreamListPage: React.FunctionComponent<{}> = () => {
defaultMessage: 'Dataset',
}),
multiSelect: 'or',
options: filterOptions.dataset.map((option) => ({
value: option,
name: option,
})),
operator: 'exact',
options: filterOptions.dataset,
},
{
type: 'field_value_selection',
@ -278,10 +297,8 @@ export const DataStreamListPage: React.FunctionComponent<{}> = () => {
defaultMessage: 'Type',
}),
multiSelect: 'or',
options: filterOptions.type.map((option) => ({
value: option,
name: option,
})),
operator: 'exact',
options: filterOptions.type,
},
{
type: 'field_value_selection',
@ -290,10 +307,8 @@ export const DataStreamListPage: React.FunctionComponent<{}> = () => {
defaultMessage: 'Namespace',
}),
multiSelect: 'or',
options: filterOptions.namespace.map((option) => ({
value: option,
name: option,
})),
operator: 'exact',
options: filterOptions.namespace,
},
{
type: 'field_value_selection',
@ -302,10 +317,8 @@ export const DataStreamListPage: React.FunctionComponent<{}> = () => {
defaultMessage: 'Integration',
}),
multiSelect: 'or',
options: filterOptions.package.map((option) => ({
value: option,
name: option,
})),
operator: 'exact',
options: filterOptions.package,
},
],
}}