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

[8.x] [Presentation] Fix use the same field icons as Discover (#194095) (#194726)

Browse source 
# Backport

This will backport the following commits from `main` to `8.x`:
- [[Presentation] Fix use the same field icons as Discover
(#194095)](https://github.com/elastic/kibana/pull/194095)

<!--- Backport version: 9.4.3 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Jusheng
Huang","email":"117657272+viajes7@users.noreply.github.com"},"sourceCommit":{"committedDate":"2024-10-02T15:27:26Z","message":"[Presentation]
Fix use the same field icons as Discover (#194095)\n\n##
Summary\r\n\r\nFix #189411 \r\n\r\n- use `getFieldIconType` method to
get the proper icon for field and\r\nfieldType\r\n- add
`getCustomFieldType` prop to custom field type (keep consistent\r\nwith
Discover).\r\n\r\n| field icon | filter type
|\r\n|------------|----------------|\r\n| <img width=\"609\"
alt=\"image\"\r\nsrc=\"https://github.com/user-attachments/assets/4a2c0c2d-c41e-47a0-b8dd-071c043893f6\">\r\n|
<img width=\"602\"
alt=\"image\"\r\nsrc=\"https://github.com/user-attachments/assets/ef6b8795-5ede-426e-a66c-626f9c608d59\">\r\n|\r\n\r\n---------\r\n\r\nCo-authored-by:
Elastic Machine
<elasticmachine@users.noreply.github.com>","sha":"e9cdc5ac40b476155063d975469c8caa5e550e04","branchLabelMapping":{"^v9.0.0$":"main","^v8.16.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:fix","Team:Presentation","💝community","v9.0.0","Project:Controls","backport:prev-minor"],"title":"[Presentation]
Fix use the same field icons as
Discover","number":194095,"url":"https://github.com/elastic/kibana/pull/194095","mergeCommit":{"message":"[Presentation]
Fix use the same field icons as Discover (#194095)\n\n##
Summary\r\n\r\nFix #189411 \r\n\r\n- use `getFieldIconType` method to
get the proper icon for field and\r\nfieldType\r\n- add
`getCustomFieldType` prop to custom field type (keep consistent\r\nwith
Discover).\r\n\r\n| field icon | filter type
|\r\n|------------|----------------|\r\n| <img width=\"609\"
alt=\"image\"\r\nsrc=\"https://github.com/user-attachments/assets/4a2c0c2d-c41e-47a0-b8dd-071c043893f6\">\r\n|
<img width=\"602\"
alt=\"image\"\r\nsrc=\"https://github.com/user-attachments/assets/ef6b8795-5ede-426e-a66c-626f9c608d59\">\r\n|\r\n\r\n---------\r\n\r\nCo-authored-by:
Elastic Machine
<elasticmachine@users.noreply.github.com>","sha":"e9cdc5ac40b476155063d975469c8caa5e550e04"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","branchLabelMappingKey":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/194095","number":194095,"mergeCommit":{"message":"[Presentation]
Fix use the same field icons as Discover (#194095)\n\n##
Summary\r\n\r\nFix #189411 \r\n\r\n- use `getFieldIconType` method to
get the proper icon for field and\r\nfieldType\r\n- add
`getCustomFieldType` prop to custom field type (keep consistent\r\nwith
Discover).\r\n\r\n| field icon | filter type
|\r\n|------------|----------------|\r\n| <img width=\"609\"
alt=\"image\"\r\nsrc=\"https://github.com/user-attachments/assets/4a2c0c2d-c41e-47a0-b8dd-071c043893f6\">\r\n|
<img width=\"602\"
alt=\"image\"\r\nsrc=\"https://github.com/user-attachments/assets/ef6b8795-5ede-426e-a66c-626f9c608d59\">\r\n|\r\n\r\n---------\r\n\r\nCo-authored-by:
Elastic Machine
<elasticmachine@users.noreply.github.com>","sha":"e9cdc5ac40b476155063d975469c8caa5e550e04"}}]}]
BACKPORT-->

Co-authored-by: Jusheng Huang <117657272+viajes7@users.noreply.github.com>
This commit is contained in:
Kibana Machine 2024-10-03 03:11:34 +10:00 • committed by GitHub
parent b8d23502a0
commit 93dd1bf9e8
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 7 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/plugins/presentation_util/public/components/field_picker/field_picker.tsx
View file

@ -9,7 +9,7 @@
import classNames from 'classnames';
import { sortBy, uniq } from 'lodash';
import { comboBoxFieldOptionMatcher } from '@kbn/field-utils';
import { comboBoxFieldOptionMatcher, getFieldIconType } from '@kbn/field-utils';
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { i18n } from '@kbn/i18n';
@ -53,7 +53,9 @@ export const FieldPicker = ({
() =>
sortBy(
(dataView?.fields ?? [])
.filter((f) => typesFilter.length === 0 || typesFilter.includes(f.type as string))
.filter(
(f) => typesFilter.length === 0 || typesFilter.includes(getFieldIconType(f) as string)
)
.filter((f) => (filterPredicate ? filterPredicate(f) : true)),
['name']
).sort((f) => (f.name === initialSelection.current ? -1 : 1)),
@ -72,7 +74,7 @@ export const FieldPicker = ({
'data-test-subj': `field-picker-select-${field.name}`,
prepend: (
<FieldIcon
type={field.type}
type={getFieldIconType(field)}
label={field.name}
scripted={field.scripted}
className="eui-alignMiddle"
@ -89,7 +91,7 @@ export const FieldPicker = ({
? uniq(
dataView.fields
.filter((f) => (filterPredicate ? filterPredicate(f) : true))
.map((f) => f.type as string)
.map((f) => getFieldIconType(f))
)
: [],
[dataView, filterPredicate]

2
x-pack/test/accessibility/apps/group1/dashboard_controls.ts
View file

@ -58,7 +58,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
it('Filter by type panel', async () => {
await testSubjects.click('toggleFieldFilterButton');
await a11y.testAppSnapshot();
await testSubjects.click('typeFilter-string');
await testSubjects.click('typeFilter-keyword');
});
it('Options control panel & dashboard with options control', async () => {