Skip to content

Commit

Permalink
[RAC] [TGrid] Implements sorting in the TGrid
Browse files Browse the repository at this point in the history
## Summary

This PR implements sorting in the `TGrid`, per the animated gifs below:

![observability-sorting](https://user-images.githubusercontent.com/4459398/127960825-5be21a92-81c1-487d-9c62-1335495f4561.gif)

_Above: Sorting in Observability, via `EuiDataGrid`'s sort popover_

![security-solution-sorting](https://user-images.githubusercontent.com/4459398/127961574-00639d4d-762c-4529-bc43-6851d98728da.gif)

_Above: Sorting and hiding columns in the Security Solution via `EuiDataGrid`'s column header actions_

## Details

* Sorting is disabled for non-aggregatble fields
* This PR resolves the `Sort [Object Object]` TODO described [here](elastic#106199 (comment))
* This PR restores the column header tooltips where the TGrid is used in the Security Solution

### Hide column

* The `Hide column` action now hides the selected column. Users may re-add hidden columns via the `Fields` browser

@mdefazio, please note this behavior differs slightly from the following request in elastic#106585 :

> Include toggles on column modifier popover to allow for show/hide option (And the field menu would only be for what is available in the column list) See [EUI Docs examples](https://elastic.github.io/eui/#/tabular-content/data-grid) for expected behavior

The behavior is different because, if the `Hide column` action only interacted with the toggles in the column modifier popover, users would have to (re) locate the field in the `Fields` browser, and then uncheck it, to _actually_ remove the column.

To allow users to remove columns in a single step, and to avoid confusion, toggles are **not** included in the column modifier popover.

## Desk testing

To desk test this PR, you must enable feature flags in the Observability and Security Solution:

- To desk test the `Observability > Alerts` page, add the following settings to `config/kibana.dev.yml`:

```
xpack.observability.unsafe.cases.enabled: true
xpack.observability.unsafe.alertingExperience.enabled: true
xpack.ruleRegistry.write.enabled: true
```

- To desk test the TGrid in the following Security Solution, edit `x-pack/plugins/security_solution/common/experimental_features.ts` and in the `allowedExperimentalValues` section set:

```typescript
tGridEnabled: true,
``

cc @mdefazio
  • Loading branch information
andrew-goldstein committed Aug 3, 2021
1 parent acb9002 commit 124cdfa
Show file tree
Hide file tree
Showing 15 changed files with 1,024 additions and 372 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,13 @@ export type ColumnId = string;
/** The specification of a column header */
export type ColumnHeaderOptions = Pick<
EuiDataGridColumn,
'display' | 'displayAsText' | 'id' | 'initialWidth'
| 'actions'
| 'defaultSortDirection'
| 'display'
| 'displayAsText'
| 'id'
| 'initialWidth'
| 'isSortable'
> & {
aggregatable?: boolean;
category?: string;
Expand Down

This file was deleted.

Loading

0 comments on commit 124cdfa

Please sign in to comment.