[ML] EuiDataGrid ml/transform components.

[walterra]

Summary

Part of #51288.

Cleanup and consolidation of code related to EuiDataGrid. The transform wizard source and pivot preview table as well as the data frame analytics results pages now share a common code base related to data grid tables.

To avoid tight coupling of components and hooks, the hooks are not within the common data grid component. Instead the hooks need to be used on the outer wrapping component and the results will be passed as props to the data grid component. This allows us to pass data from different data sources (transform index source, pivot previews, analytics results) into a shared component.

The structure for usage is like this (pseudo code):

useMyResults = (...) => {
  const sharedDataGridFunctionality = useDataGrid(...);
  const myCustomColumns = ...;
  const myCustomRenderCellValueFunction = (...) => {...};

  return {
    ...sharedDataGridFunctionality,
    columns: myCustomColumns,
    renderCellValue: myCustomRenderCellValueFunction,
};

<MyWrapperComponent>
  const dataGrid = useMyResults(...);
  <DataGrid {...dataGrid} />
<MyWrapperComponent>

The above is how each results page implements the data grid rendering.

Todos

• Fix Outlier Detection Color Coding 748cc88

Checklist

• Any text added follows EUI's writing guidelines, uses sentence case text and includes i18n support
• Unit or functional tests were updated or added to match the most common scenarios
• This was checked for cross-browser compatibility, including a check against IE11

For maintainers

• This was checked for breaking API changes and was labeled appropriately

[peteharverson]

I wonder if this is a good time to change the 'Create index pattern' default on the analytics creation flyout to 'enabled'? Ensures functionality like the KQL query bar auto-suggest works against the destination index.

[walterra]

@pheyos added you as a reviewer since this touches some functional tests. The tests themselves didn't changed, I just adapted some method and data-subject-id names because after the refactoring some React components are now more generic.

[walterra]

@peteharverson suggest to change the default index pattern toggle in a follow up that then will also update the code how we fetch data and fields for results pages, including a modal that allows a user to create an index pattern.

I updated the PR with some more fixes:

• Outlier detection color coding is back!
• Column sorting code for all results pages consolidated
• Removed additional helper functions from the EuiInMemoryTable-times.
• Fixes display of the feature importance column

[peteharverson]

The issue where hiding all the fields in the grid leads to the toolbar disappearing can still occur:

Is this tracked in another issue? The only place I can reproduce this is the classification page confusion matrix grid.

[peteharverson]

When opening the results for an outlier job on cloudwatch CPU data (pivot on instance) the page crashes with this error in the console:

[walterra]

@peteharverson Fixed the cloudwatch related table crash in 897ba46.

[peteharverson]

Tested latest edits and LGTM

[alvarezmelissa87]

This useEffect is duplicated - it's also above on line 66.

[alvarezmelissa87]

Once the duplicate useEffect is removed - code LGTM and tested and LGTM. 👍

[pheyos]

Functional test changes LGTM

[kibanamachine]

💚 Build Succeeded

• continuous-integration/kibana-ci/pull-request
• Commit: ae9eb8f

History

• 💚 Build #43019 succeeded ae9eb8f
• 💚 Build #42758 succeeded 897ba46
• 💚 Build #42672 succeeded 773147a
• 💔 Build #42386 failed afb797a
• 💔 Build #42361 failed 4924128

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