kibana/x-pack/plugins/observability
Andrew Goldstein 4d92dafa9e
[Observability RAC] Alerts table post-EuiDataGrid style updates (#106349)
## [Observability RAC] Alerts table post-`EuiDataGrid` style updates

This PR updates styles in the Observability `Alerts` table, as a follow-up to the [TGrid migrating to use `EuiDataGrid` for rendering](https://github.com/elastic/kibana/pull/106199), and [this PR](https://github.com/elastic/kibana/pull/105446), which improved the alerts table columns.

- The `Reason` column uses up the remaining width, a follow-up task from https://github.com/elastic/kibana/pull/105446
  - This task was originally tracked by https://github.com/elastic/kibana/issues/105227
- Increased the font weight and vertically aligned the `Actions` header with the other columns
- ~Removed the `Status` column~ (EDIT: we won't remove this, per a discussion w/ UX)
- Increased the width of the `Triggered` column
- ~Renamed the `Duration` column to `Alert duration`~ (EDIT: we won't rename this, per a discussion w/ UX)
- Eliminated the gap between actions
- Added truncation to the `Reason` column

### Before

![before](https://user-images.githubusercontent.com/4459398/126430458-89440150-c10b-43b1-b0b4-2044ddfc22a8.png)

### After

<img width="1280" alt="after" src="https://user-images.githubusercontent.com/4459398/126716690-be310fdf-3760-4014-998b-3c89099c2564.png">

### Desk testing

- 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
```

cc @mdefazio
2021-07-27 14:41:19 -06:00
..
.storybook Storybook EUI theme decorator (#103582) 2021-07-09 08:54:48 -05:00
common Observability side navigation for cases and alerts (#102556) 2021-06-28 11:48:32 -05:00
public [Observability RAC] Alerts table post-EuiDataGrid style updates (#106349) 2021-07-27 14:41:19 -06:00
scripts Elastic License 2.0 (#90099) 2021-02-03 18:12:39 -08:00
server Exclude registering the cases feature if not enabled (#105292) 2021-07-13 09:06:59 -04:00
typings [Uptime] Add Custom Fleet Integration UI (#91584) 2021-04-20 13:33:46 -04:00
jest.config.js Storybook EUI theme decorator (#103582) 2021-07-09 08:54:48 -05:00
kibana.json [Exploratory View] Multi Series View (#103855) 2021-07-22 10:14:43 +02:00
README.md [Observability] Fix README.md link to component (#100801) 2021-05-27 21:27:16 +02:00
tsconfig.json [RAC] ALerts table in observability (#103270) 2021-07-06 10:28:21 -06:00

Observability plugin

This plugin provides shared components and services for use across observability solutions, as well as the observability landing page UI.

Rules, Alerts, and Cases

The Observability plugin contains experimental support for improved alerting and case management.

If you have:

xpack.observability.unsafe.cases.enabled: true

In your Kibana configuration, the Cases page will be available.

If you have:

xpack.observability.unsafe.alertingExperience.enabled: true

In your Kibana configuration, the Alerts page will be available.

This will only enable the UI for this page when. In order to have alert data indexed you'll need to enable writing in the Rule Registry plugin:

xpack.ruleRegistry.write.enabled: true

When both of the these are set to true, your alerts should show on the alerts page.

Shared navigation

The Observability plugin maintains a navigation registry for Observability solutions, and exposes a shared page template component. Please refer to the docs in the component directory for more information on registering your solution's navigation structure, and rendering the navigation via the shared component.

Unit testing

Note: Run the following commands from kibana/x-pack/plugins/observability.

Run unit tests

npx jest --watch

Update snapshots

npx jest --updateSnapshot

Coverage

HTML coverage report can be found in target/coverage/jest after tests have run.

open target/coverage/jest/index.html

API integration testing

API tests are separated in two suites:

  • a basic license test suite
  • a trial license test suite (the equivalent of gold+)

This requires separate test servers and test runners.

Basic

# Start server
node scripts/functional_tests_server --config x-pack/test/observability_api_integration/basic/config.ts

# Run tests
node scripts/functional_test_runner --config x-pack/test/observability_api_integration/basic/config.ts

The API tests for "basic" are located in x-pack/test/observability_api_integration/basic/tests.

Trial

# Start server
node scripts/functional_tests_server --config x-pack/test/observability_api_integration/trial/config.ts

# Run tests
node scripts/functional_test_runner --config x-pack/test/observability_api_integration/trial/config.ts

The API tests for "trial" are located in x-pack/test/observability_api_integration/trial/tests.

API test tips

  • For debugging access Elasticsearch on http://localhost:9220` (elastic/changeme)
  • To update snapshots append --updateSnapshots to the functional_test_runner command