Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[UnifiedDataTable] Align header row configuration to Lens #171708

Closed
kertal opened this issue Nov 22, 2023 · 6 comments · Fixed by #175501
Closed

[UnifiedDataTable] Align header row configuration to Lens #171708

kertal opened this issue Nov 22, 2023 · 6 comments · Fixed by #175501
Assignees
Labels
enhancement New value added to drive a business result Feature:Discover Discover Application Feature:UnifiedDataTable impact:high Addressing this issue will have a high level of impact on the quality/strength of our product. loe:small Small Level of Effort Team:DataDiscovery Discover, search (e.g. data plugin and KQL), data views, saved searches. For ES|QL, use Team:ES|QL.

Comments

@kertal
Copy link
Member

kertal commented Nov 22, 2023

In Lens users can configure the header row to show multiple lines. This is beneficial for long fieldnames which are very common in the works of o11y and beyond. When users have multiple columns configured with eg. lots of fieldnames starting with the same prefix (Like kubernetes....), this hides the most relevant information to distinguish between those fields.

Here's an example for this:
Bildschirmfoto 2023-11-22 um 17 51 43

For consistency with Lens we should align configuration options, so users can change the header row to their need, allowing to see more of the field name at one sight when needed

Bildschirmfoto 2023-11-22 um 07 52 59

When Discover consumes this change, its setting should be saved in the Save Search Saved Object.

Out of scope but worth to consider

  • The default of showing 1 line should stay the same, we might consider changing the default in Discover but we should consider to align with Lens. If we change the default setting we need to consider other consumers of the package, to omit breaking changes.
  • Given the need for multiline headers, it could make sense to integrate this into "EuiDataGrid", this has been requested before: [EuiDataGrid] Allow multi line headers eui#5536
@kertal kertal added Feature:Discover Discover Application enhancement New value added to drive a business result Team:DataDiscovery Discover, search (e.g. data plugin and KQL), data views, saved searches. For ES|QL, use Team:ES|QL. Feature:UnifiedDataTable labels Nov 22, 2023
@elasticmachine
Copy link
Contributor

Pinging @elastic/kibana-data-discovery (Team:DataDiscovery)

@kertal kertal added impact:high Addressing this issue will have a high level of impact on the quality/strength of our product. loe:small Small Level of Effort labels Nov 22, 2023
@teresaalvarezsoler
Copy link

@kertal being able to configure is great but I think it's hard to discover it. It's not the same in Lens because users are in this "creator mode" in which they know they can change how things look like. I strongly think we should have a better default such as the 3 lines + truncation. Regardless of making this issue, can we merge that other PR too?

@kertal
Copy link
Member Author

kertal commented Nov 29, 2023

Thx @teresaalvarezsoler for your feedback, how about discussing this in our next team sync?

@mbondyra
Copy link
Contributor

mbondyra commented Dec 7, 2023

As we decided that we want to have default 3 lines instead of 1, we have to think about how to redesign this tooltip option. Something to have in mind @andreadelrio @MichaelMarcialis

284815001-fddc3655-1002-47fe-9ffe-656c7ce50df4

We could have 2 options: 'auto fit' or 'custom' and have custom set to 3 lines by default. Another option would be to rename single to default but this is a little vague.

@davismcphee
Copy link
Contributor

@mbondyra Just a note that the approach we use in Discover for our default cell row height (3 rows) is to have "Custom" selected by default and set to 3.

@MichaelMarcialis
Copy link
Contributor

+1 to what @davismcphee suggests here. That was exactly my expectation (Custom with 3 line selected by default).

davismcphee added a commit that referenced this issue Feb 13, 2024
## Summary

This PR adds header row height configuration to Discover, and aligns the
row height configuration UI in Discover and Lens. The header row height
configuration should behave the same way as the cell row height
configuration, including persisting to saved searches and displaying in
the saved search embeddable.

Expanded:
<img width="464" alt="expanded"
src="https://github.com/elastic/kibana/assets/25592674/c1715c1c-a794-4c1e-a6c4-63fba0ecb465">

Collapsed:
<img width="466" alt="collapsed"
src="https://github.com/elastic/kibana/assets/25592674/310a7b32-f7f8-461a-a5ac-12030e86042d">

Resolves #171708.

### Checklist

- [x] Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)
- [ ]
~[Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html)
was added for features that require explanation or tutorials~
- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [ ] ~[Flaky Test
Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was
used on any tests changed~
- [x] Any UI touched in this PR is usable by keyboard only (learn more
about [keyboard accessibility](https://webaim.org/techniques/keyboard/))
- [ ] ~Any UI touched in this PR does not create any new axe failures
(run axe in browser:
[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),
[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))~
- [ ] ~If a plugin configuration key changed, check if it needs to be
allowlisted in the cloud and added to the [docker
list](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker)~
- [x] This renders correctly on smaller devices using a responsive
layout. (You can test this [in your
browser](https://www.browserstack.com/guide/responsive-testing-on-local-server))
- [x] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)

### For maintainers

- [ ] This was checked for breaking API changes and was [labeled
appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)

---------

Co-authored-by: kibanamachine <[email protected]>
Co-authored-by: Stratoula Kalafateli <[email protected]>
CoenWarmer pushed a commit to CoenWarmer/kibana that referenced this issue Feb 15, 2024
)

## Summary

This PR adds header row height configuration to Discover, and aligns the
row height configuration UI in Discover and Lens. The header row height
configuration should behave the same way as the cell row height
configuration, including persisting to saved searches and displaying in
the saved search embeddable.

Expanded:
<img width="464" alt="expanded"
src="https://github.com/elastic/kibana/assets/25592674/c1715c1c-a794-4c1e-a6c4-63fba0ecb465">

Collapsed:
<img width="466" alt="collapsed"
src="https://github.com/elastic/kibana/assets/25592674/310a7b32-f7f8-461a-a5ac-12030e86042d">

Resolves elastic#171708.

### Checklist

- [x] Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)
- [ ]
~[Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html)
was added for features that require explanation or tutorials~
- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [ ] ~[Flaky Test
Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was
used on any tests changed~
- [x] Any UI touched in this PR is usable by keyboard only (learn more
about [keyboard accessibility](https://webaim.org/techniques/keyboard/))
- [ ] ~Any UI touched in this PR does not create any new axe failures
(run axe in browser:
[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),
[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))~
- [ ] ~If a plugin configuration key changed, check if it needs to be
allowlisted in the cloud and added to the [docker
list](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker)~
- [x] This renders correctly on smaller devices using a responsive
layout. (You can test this [in your
browser](https://www.browserstack.com/guide/responsive-testing-on-local-server))
- [x] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)

### For maintainers

- [ ] This was checked for breaking API changes and was [labeled
appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)

---------

Co-authored-by: kibanamachine <[email protected]>
Co-authored-by: Stratoula Kalafateli <[email protected]>
fkanout pushed a commit to fkanout/kibana that referenced this issue Mar 4, 2024
)

## Summary

This PR adds header row height configuration to Discover, and aligns the
row height configuration UI in Discover and Lens. The header row height
configuration should behave the same way as the cell row height
configuration, including persisting to saved searches and displaying in
the saved search embeddable.

Expanded:
<img width="464" alt="expanded"
src="https://github.com/elastic/kibana/assets/25592674/c1715c1c-a794-4c1e-a6c4-63fba0ecb465">

Collapsed:
<img width="466" alt="collapsed"
src="https://github.com/elastic/kibana/assets/25592674/310a7b32-f7f8-461a-a5ac-12030e86042d">

Resolves elastic#171708.

### Checklist

- [x] Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)
- [ ]
~[Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html)
was added for features that require explanation or tutorials~
- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [ ] ~[Flaky Test
Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was
used on any tests changed~
- [x] Any UI touched in this PR is usable by keyboard only (learn more
about [keyboard accessibility](https://webaim.org/techniques/keyboard/))
- [ ] ~Any UI touched in this PR does not create any new axe failures
(run axe in browser:
[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),
[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))~
- [ ] ~If a plugin configuration key changed, check if it needs to be
allowlisted in the cloud and added to the [docker
list](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker)~
- [x] This renders correctly on smaller devices using a responsive
layout. (You can test this [in your
browser](https://www.browserstack.com/guide/responsive-testing-on-local-server))
- [x] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)

### For maintainers

- [ ] This was checked for breaking API changes and was [labeled
appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)

---------

Co-authored-by: kibanamachine <[email protected]>
Co-authored-by: Stratoula Kalafateli <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New value added to drive a business result Feature:Discover Discover Application Feature:UnifiedDataTable impact:high Addressing this issue will have a high level of impact on the quality/strength of our product. loe:small Small Level of Effort Team:DataDiscovery Discover, search (e.g. data plugin and KQL), data views, saved searches. For ES|QL, use Team:ES|QL.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

6 participants