[Discover] EuiDataGrid Implementation

[kertal]

Summary

Continuation of #51531 🔥 integrating EuiDataGrid implementation in Discover including the saved search embeddable.

You need to enable it in Stack Monitoring / Advanced Settings by setting Use legacy table to Off

When you navigate to Discover you should see the EuiDataGrid in Action

You can sort columns now with drag and drop

View the grid in full screen mode

Enjoy a much better way to change sorting

Expand documents in a flyout

You can resize one or multiple column, this is persisted in the saved search saved object and when you embed a saved search in a dashboard the width

Resolves #737
Resolves #38982
Resolves #8706
Resolved #4436

Known bugs and issues

• EuiDataGrid - Wrong columns assigned to leadColumns (PR), so cell actions are displayed e.g. in the expand section of grid
• EuiDataGrid Display sort arrow next in header column [EuiDataGrid] Add sorting icon if the column is sorted eui#4343 (comment)
• EuiDataGrid - Cell actions spacing the Safari (issue)
• EuiDataGrid - Resize handler overlapping header menu button at the rightmost column (issue)
• EuiDataGrid - Cell actions need 2 clicks in Firefox and Safari on MacOS (issue)
• EuiDataGrid - Cellpopover stays open even underlying data changes (issue)

Follow ups

• EuiDataGrid Virtualization [EuiDataGrid] Virtualization eui#4170
• EuiResizableContainer providing collapsible sidebars [EuiResizableContainer] Allow collapsible panels eui#3978 (Note that it's not mandatory, because you can collapse the sidebar in the current version, but it's a nice to have)

Checklist

• Any text added follows EUI's writing guidelines, uses sentence case text and includes i18n support
  - [ ] Documentation was added for features that require explanation or tutorials
• Unit or functional tests were updated or added to match the most common scenarios
• This was checked for keyboard-only and screenreader accessibility
• This renders correctly on smaller devices using a responsive layout. (You can test this in your browser
• This was checked for cross-browser compatibility, (https://github.com/elastic/kibana/blob/master/CONTRIBUTING.md#cross-browser-compatibility)

[kertal]

FYI: @myasonik & @snide

[kertal]

Some notes.

• We need to fix the spacing in the blob view. Right now there are no margins to the left of the blocks.
• Selected state of rows needs emphasis

you took care of that, right @cchaos

• We should add a toast or something to signify the actions in the flyouts happened. Since they are hidden behind.

Or we make them function like the legacy one, close the flyout, would also prevent a problem with toggling of columns

• Products field is rendering empty in the grid, but shows in the flyout.

Muchas gracias, fixed that

• In general, I think we need a schema to recognize JSON blobs, and apply that schema from EUI (for syntax highlighting in the popout)
• We can set the height for the chart header so that there's not a jump as you hide the chart. (this is because the select form has a larger height)

Dankeschön for taking care of it

• I would increase the default pagination to more than 25 results. It should be as high as we feel comfortable.

Will be done when virtualization, I'm comfortable with 5000000 then

about the geo field schema, so it should be handled like a JSON or differently? thx

[snide]

@kertal did some more styling. We have some Amsterdam specific changes that we'll need to make (that shouldn't hold up this PR) after the break.

I'd still like to highlight the row selected if possible. Think you can pass me a className on the cells for the selected row? That way I can give it some emphasis once it's been expanded.

Other small thing I noticed in here (and can wait) is that we really need to replace the doc viewer table that shows in the expanded flyout to use an EuiTable. Right now it's using Bootstrap, and we're looking to remove that next minor.

[snide]

This looks great. There are some small leftover issues from design, but they can all be handled by later PRs. All the big stuff is covered. When we get closer to a release, we should make a more prominent switch (maybe a one time toast?) to let people toggle the new view, that way they don't need to dig into adv. settings.

There's likely nearly ten people on this PR on the EUI or Kibana side. Really nice job by everyone. Good to merge!

[kibanamachine]

💔 Build Failed

• continuous-integration/kibana-ci/pull-request
• Commit: 71d943f
• Pipeline Steps (look for red circles / failed steps)
• Interpreting CI Failures

Failed CI Steps

• Setup Build Environment and Dependencies
• Setup Build Environment and Dependencies

Metrics [docs]

‼️ ERROR: no builds found for mergeBase sha [a98550b]

History

• 💚 Build #96116 succeeded 71d943f
• 💔 Build #96094 failed 46f60d7
• 💔 Build #96040 failed f482f11
• 💔 Build #96000 failed 5847ad9

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream