Skip to content

[8.19] [Lens] [Data Table] Add settings for data grid density (#220252)#222153

Merged
mariairiartef merged 1 commit intoelastic:8.19from
mariairiartef:backport/8.19/pr-220252
Jun 2, 2025
Merged

[8.19] [Lens] [Data Table] Add settings for data grid density (#220252)#222153
mariairiartef merged 1 commit intoelastic:8.19from
mariairiartef:backport/8.19/pr-220252

Conversation

@mariairiartef
Copy link
Copy Markdown
Contributor

Backport

This will backport the following commits from main to 8.19:

Questions ?

Please refer to the Backport tool documentation

## Summary

Closes elastic#216095

Introduces a new `Density` setting for the Lens Data Table, ensuring
consistency with the density options available in Discover. This
enhancement allows users to customize the table's appearance by
selecting from `Compact`, `Normal`, and `Expanded` density modes.

<img width="444" alt="Screenshot 2025-05-08 at 11 13 26"
src="https://github.com/user-attachments/assets/c5a3bfb6-d2c7-4e14-ae58-c197165ddddc"
/>

### Details

There is an existing DensityControl component in EUI that cannot be
accessed directly, only by the use of the
[toolbarVisibility](https://eui.elastic.co/docs/components/tabular-content/data-grid/toolbar/#toolbar-visibility)
prop in the `EuiDataGrid` component. Since we aren't using this prop for
the settings display because we are using a separate `Toolbar`
component, we have copied and adapted the component found
[here](https://github.com/elastic/eui/blob/1e78b3f8b435c59379582612aa9b9cfed39ad864/packages/eui/src/components/datagrid/controls/display_selector.tsx#L77).

## Screen recording

https://github.com/user-attachments/assets/4e281b58-7bd4-4cd3-bf8f-d4c2fd553ae8

## Checklist

- [ ]
[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
- [ ] This was checked for breaking HTTP API changes, and any breaking
changes have been approved by the breaking-change committee. The
`release_note:breaking` label should be applied in these situations.
- [ ] [Flaky Test
Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was
used on any tests changed
- [ ] The PR description includes the appropriate Release Notes section,
and the correct `release_note:*` label is applied per the
[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)

<!--
- [ ] 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/src/platform/packages/shared/kbn-i18n/README.md)
- [ ] 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)
-->

<!--
### Identify risks

Does this PR introduce any risks? For example, consider risks like hard
to test bugs, performance regression, potential of data loss.

Describe the risk, its severity, and mitigation for each identified
risk. Invite stakeholders and evaluate how to proceed before merging.

- [ ] [See some risk
examples](https://github.com/elastic/kibana/blob/main/RISK_MATRIX.mdx)
- [ ] ...
-->

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
(cherry picked from commit 75681df)

# Conflicts:
#	x-pack/platform/plugins/shared/lens/common/expressions/datatable/datatable.ts
#	x-pack/platform/plugins/shared/lens/public/visualizations/datatable/components/table_basic.tsx
#	x-pack/platform/plugins/shared/lens/public/visualizations/datatable/visualization.tsx
@mariairiartef mariairiartef added the backport This PR is a backport of another PR label Jun 2, 2025
@mariairiartef mariairiartef enabled auto-merge (squash) June 2, 2025 08:39
@mariairiartef mariairiartef self-assigned this Jun 2, 2025
@elasticmachine
Copy link
Copy Markdown
Contributor

💛 Build succeeded, but was flaky

Failed CI Steps

Test Failures

  • [job] [logs] FTR Configs #56 / discover/group4 adhoc data views should support query and filtering
  • [job] [logs] Jest Tests #19 / TemplatesList calls onDeleteTemplate correctly

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id before after diff
lens 1413 1414 +1

Public APIs missing comments

Total count of every public API that lacks a comment. Target amount is 0. Run node scripts/build_api_docs --plugin [yourplugin] --stats comments for more detailed information.

id before after diff
lens 555 556 +1

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id before after diff
lens 1.5MB 1.5MB +1.3KB

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id before after diff
lens 59.5KB 59.6KB +35.0B
Unknown metric groups

API count

id before after diff
lens 654 655 +1

cc @mariairiartef

@mariairiartef mariairiartef merged commit ad43bbc into elastic:8.19 Jun 2, 2025
11 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

backport This PR is a backport of another PR

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants