[APM] Add sparklines to the multi-signal view table #187782

jennypavlova · 2024-07-08T17:28:38Z

Summary

This PR adds sparklines to the multi-signal view table

Testing

Enable observability:apmEnableMultiSignal in advanced settings

2. Run the entities definition in the dev tools

POST kbn:/internal/api/entities/definition
{
  "id": "apm-services-with-metadata",
  "name": "Services from logs and metrics",
  "displayNameTemplate": "test",
  "history": {
    "timestampField": "@timestamp",
    "interval": "5m"
  },
  "type": "service",
  "indexPatterns": [
    "logs-*",
    "metrics-*"
  ],
  "timestampField": "@timestamp",
  "lookback": "5m",
  "identityFields": [
    {
      "field": "service.name",
      "optional": false
    },
    {
      "field": "service.environment",
      "optional": true
    }
  ],
  "identityTemplate": "{{service.name}}:{{service.environment}}",
  "metadata": [
    "tags",
    "host.name",
    "data_stream.type",
    "service.name", 
    "service.instance.id",
    "service.namespace",
    "service.environment",
    "service.version",
    "service.runtime.name",
    "service.runtime.version",
    "service.node.name",
    "service.language.name",
    "agent.name",
    "cloud.provider",
    "cloud.instance.id",
    "cloud.availability_zone",
    "cloud.instance.name",
    "cloud.machine.type",
    "container.id"
  ],
  "metrics": [
    {
      "name": "latency",
      "equation": "A",
      "metrics": [
        {
          "name": "A",
          "aggregation": "avg",
          "field": "transaction.duration.histogram"
           
          
        }
      ]
    },
    {
      "name": "throughput",
      "equation": "A / 5",
      "metrics": [
        {
          "name": "A",
          "aggregation": "doc_count",
          "filter": "transaction.duration.histogram:*"
        }
      ]
    },
    {
      "name": "failedTransactionRate",
      "equation": "A / B",
      "metrics": [
        {
          "name": "A",
          "aggregation": "doc_count",
          "filter": "event.outcome: \"failure\""
        },
        {
          "name": "B",
          "aggregation": "doc_count",
          "filter": "event.outcome: *"
        }
      ]
    },
    {
      "name": "logErrorRate",
      "equation": "A / B",
      "metrics": [
        {
          "name": "A",
          "aggregation": "doc_count",
          "filter": "log.level: \"error\""
        },
        {
          "name": "B",
          "aggregation": "doc_count",
          "filter": "log.level: *"
        }
      ]
    },
     {
      "name": "logRatePerMinute",
      "equation": "A / 5",
      "metrics": [
        {
          "name": "A",
          "aggregation": "doc_count",
          "filter": "log.level: \"error\""
        }
      ]
    }
  ]
}

Generate data with synthrace
1. logs only: node scripts/synthtrace simple_logs.ts
2. APM only: node scripts/synthtrace simple_trace.ts
Open services inventory
- the sparklines should be visible next to the values in the table (big screen only like in the services table)
- on small screens, the sparklines should not be visible

obltmachine · 2024-07-08T17:28:50Z

🤖 GitHub comments

Expand to view the GitHub comments

Just comment with:

/oblt-deploy : Deploy a Kibana instance using the Observability test environments.
run docs-build : Re-trigger the docs validation. (use unformatted text in the comment!)

…l-view-table

elasticmachine · 2024-07-09T12:05:33Z

Pinging @elastic/obs-ux-infra_services-team (Team:obs-ux-infra_services)

x-pack/plugins/observability_solution/apm/server/routes/entities/services/routes.ts

kpatticha · 2024-07-10T07:03:25Z

...data_access/server/services/get_logs_error_rate_timeseries/get_logs_error_rate_timeseries.ts

  terms: {
    field: LOG_LEVEL,
    include: ['error', 'ERROR'],
  },
 });

-type LogErrorsAggregation = ReturnType<typeof getLogErrorsAggegation>;


kpatticha

LGTM, I left a comment

…l-view-table

achyutjhunjhunwala · 2024-07-10T10:03:52Z

(nit): Looking at the Name Column, its Left Aligned, Will it look better to have the other columns too left aligned. At the moment looking at Mixed NA and data scenarios, this UI looks a bit wierd

jennypavlova · 2024-07-10T12:19:50Z

(nit): Looking at the Name Column, its Left Aligned, Will it look better to have the other columns too left aligned. At the moment looking at Mixed NA and data scenarios, this UI looks a bit wierd

@achyutjhunjhunwala All APM tables have the same alignment, it's not something introduced here - the sparklines will look bad if we change the alignment (will move to the left). I agree that we should improve the UI so we can add an issue for that, wdyt?

crespocarlos · 2024-07-10T14:11:35Z

x-pack/plugins/observability_solution/apm/server/routes/entities/services/routes.ts

+      getRandomSampler({ security, request, probability }),
+    ]);
+
+    if (!serviceNames.length) {


We could make this validation before the API calls to save time in case serviceNames is empty

Good point, I missed that when I got this part from the service overview request, moved 👍

crespocarlos · 2024-07-10T14:14:37Z

...bility_solution/apm/public/components/app/service_inventory/multi_signal_inventory/index.tsx

+    },
+    // only fetches detailed statistics when requestId is invalidated by main statistics api call or offset is changed
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [mainStatisticsData.requestId, services],


What is the dependency that causes the API to be unnecessarily called?

This is similar to the request we have in the services overview (POST /internal/apm/services/detailed_statistics) It's start, end, environment, kuery, and dataSourceOptions in this case

crespocarlos · 2024-07-10T14:17:43Z

...st/apm_api_integration/tests/entities/services/services_entities_detailed_statistics.spec.ts

+          '1m'
+        );
+
+        logSynthtrace.index([


Suggested change

logSynthtrace.index([

await logSynthtrace.index([

Fixed, thanks ✅

…l-view-table

elasticmachine · 2024-07-10T16:32:36Z

💛 Build succeeded, but was flaky

Buildkite Build
Commit: f49269f
Kibana Serverless Image: docker.elastic.co/kibana-ci/kibana-serverless:pr-187782-f49269fb2c47
Observability Deployment

Failed CI Steps

Metrics [docs]

Async chunks

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

id	before	after	diff
`apm`	3.5MB	3.5MB	+1.7KB

Public APIs missing exports

Total count of every type that is part of your API that should be exported but is not. This will cause broken links in the API documentation system. Target amount is 0. Run node scripts/build_api_docs --plugin [yourplugin] --stats exports for more detailed information.

id	before	after	diff
`apm`	123	124	+1

Unknown metric groups

ESLint disabled line counts

id	before	after	diff
`apm`	72	73	+1

Total ESLint disabled count

id	before	after	diff
`apm`	86	87	+1

History

💚 Build #220543 succeeded 20d1206
💚 Build #220409 succeeded c660e21
💔 Build #220345 failed d24d37f

cc @jennypavlova

jennypavlova · 2024-07-11T09:07:36Z

@achyutjhunjhunwala I added an issue to improve the table alignment: #188060
Can you please check the PR again (I need a co-owner review here)?

yngrdyn

LGTM

jennypavlova added 2 commits July 4, 2024 18:37

[WIP] Add APM metrics sparklines

d898a4c

Add timeseries data and display sparklines for logs and apm

6611a41

jennypavlova added release_note:skip Skip the PR/issue when compiling release notes backport:skip This commit does not require backporting Team:obs-ux-infra_services Observability Infrastructure & Services User Experience Team labels Jul 8, 2024

jennypavlova self-assigned this Jul 8, 2024

jennypavlova added 2 commits July 9, 2024 13:47

Cleanup and add api test

74ace5d

Hide sparklines on smaller screen

cd40707

jennypavlova marked this pull request as ready for review July 9, 2024 12:05

jennypavlova requested review from a team as code owners July 9, 2024 12:05

Merge branch 'main' into 187567-apm-add-sparklines-to-the-multi-signa…

d24d37f

…l-view-table

botelastic bot added the ci:project-deploy-observability Create an Observability project label Jul 9, 2024

Fix type

c660e21

kpatticha reviewed Jul 10, 2024

View reviewed changes

x-pack/plugins/observability_solution/apm/server/routes/entities/services/routes.ts Outdated Show resolved Hide resolved

kpatticha reviewed Jul 10, 2024

View reviewed changes

kpatticha approved these changes Jul 10, 2024

View reviewed changes

jennypavlova added 2 commits July 10, 2024 11:08

CR fixes

c56c3a8

Merge branch 'main' into 187567-apm-add-sparklines-to-the-multi-signa…

20d1206

…l-view-table

jennypavlova enabled auto-merge (squash) July 10, 2024 09:36

jennypavlova requested a review from achyutjhunjhunwala July 10, 2024 12:20

crespocarlos reviewed Jul 10, 2024

View reviewed changes

jennypavlova added 2 commits July 10, 2024 17:25

CR fixes

1d531fe

Merge branch 'main' into 187567-apm-add-sparklines-to-the-multi-signa…

f49269f

…l-view-table

jennypavlova requested a review from crespocarlos July 10, 2024 15:28

jennypavlova mentioned this pull request Jul 11, 2024

[ObsUX][APM] Multi-signal services overview table alignment #188060

Closed

yngrdyn approved these changes Jul 11, 2024

View reviewed changes

jennypavlova merged commit 35b5fcc into elastic:main Jul 11, 2024
24 checks passed

kibanamachine added the v8.16.0 label Jul 11, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[APM] Add sparklines to the multi-signal view table #187782

[APM] Add sparklines to the multi-signal view table #187782

jennypavlova commented Jul 8, 2024 •

edited

Loading

obltmachine commented Jul 8, 2024

elasticmachine commented Jul 9, 2024

kpatticha Jul 10, 2024

kpatticha left a comment •

edited

Loading

achyutjhunjhunwala commented Jul 10, 2024

jennypavlova commented Jul 10, 2024

crespocarlos Jul 10, 2024

jennypavlova Jul 10, 2024

crespocarlos Jul 10, 2024

jennypavlova Jul 10, 2024

crespocarlos Jul 10, 2024

jennypavlova Jul 10, 2024

elasticmachine commented Jul 10, 2024 •

edited

Loading

ESLint disabled line counts

Total ESLint disabled count

jennypavlova commented Jul 11, 2024

yngrdyn left a comment

[APM] Add sparklines to the multi-signal view table #187782

[APM] Add sparklines to the multi-signal view table #187782

Conversation

jennypavlova commented Jul 8, 2024 • edited Loading

Summary

Testing

obltmachine commented Jul 8, 2024

🤖 GitHub comments

elasticmachine commented Jul 9, 2024

kpatticha Jul 10, 2024

Choose a reason for hiding this comment

kpatticha left a comment • edited Loading

Choose a reason for hiding this comment

achyutjhunjhunwala commented Jul 10, 2024

jennypavlova commented Jul 10, 2024

crespocarlos Jul 10, 2024

Choose a reason for hiding this comment

jennypavlova Jul 10, 2024

Choose a reason for hiding this comment

crespocarlos Jul 10, 2024

Choose a reason for hiding this comment

jennypavlova Jul 10, 2024

Choose a reason for hiding this comment

crespocarlos Jul 10, 2024

Choose a reason for hiding this comment

jennypavlova Jul 10, 2024

Choose a reason for hiding this comment

elasticmachine commented Jul 10, 2024 • edited Loading

💛 Build succeeded, but was flaky

Failed CI Steps

Metrics [docs]

Async chunks

Public APIs missing exports

ESLint disabled line counts

Total ESLint disabled count

History

jennypavlova commented Jul 11, 2024

yngrdyn left a comment

Choose a reason for hiding this comment

jennypavlova commented Jul 8, 2024 •

edited

Loading

kpatticha left a comment •

edited

Loading

elasticmachine commented Jul 10, 2024 •

edited

Loading