[8.18] [APM][Errors] Fix: Missing summary data in in error sample (#2…

…13430) (#213573)

# Backport

This will backport the following commits from `main` to `8.18`:
- [[APM][Errors] Fix: Missing summary data in in error sample
(#213430)](#213430)

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT
[{"author":{"name":"jennypavlova","email":"dzheni.pavlova@elastic.co"},"sourceCommit":{"committedDate":"2025-03-07T14:08:39Z","message":"[APM][Errors]
Fix: Missing summary data in in error sample (#213430)\n\nCloses #213418
\n## Summary\n\nThis PR fixes the missing error sample summary by adding
the missing\nfields\n\nBug (Before) | Fix
(After)\n|-----------------------|-----------|\n| <img width=\"1912\"
alt=\"image\"\nsrc=\"https://github.com/user-attachments/assets/f7a9b007-529d-422d-b0e2-eac2e06c26b1\"\n/>
|\n![image](https://github.com/user-attachments/assets/c31ef1f6-44fd-442f-a12e-d3df0790cdc5)\n|\n\n##
Testing\n- Find a service with errors (using edge oblt data or any data
that\nincludes the field values shown)\n- Click on the service and
navigate to Errors tab \n- The Error sample should include the summary
data
\n\n![image](https://github.com/user-attachments/assets/c86fdc3e-cd88-46b5-a59a-e1b8c7d44bef)","sha":"36e930c27346b1a729bea7fc663b6934bbfca403","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:fix","backport:prev-minor","backport:prev-major","Team:obs-ux-infra_services","v9.1.0"],"title":"[APM][Errors]
Fix: Missing summary data in in error
sample","number":213430,"url":"https://github.com/elastic/kibana/pull/213430","mergeCommit":{"message":"[APM][Errors]
Fix: Missing summary data in in error sample (#213430)\n\nCloses #213418
\n## Summary\n\nThis PR fixes the missing error sample summary by adding
the missing\nfields\n\nBug (Before) | Fix
(After)\n|-----------------------|-----------|\n| <img width=\"1912\"
alt=\"image\"\nsrc=\"https://github.com/user-attachments/assets/f7a9b007-529d-422d-b0e2-eac2e06c26b1\"\n/>
|\n![image](https://github.com/user-attachments/assets/c31ef1f6-44fd-442f-a12e-d3df0790cdc5)\n|\n\n##
Testing\n- Find a service with errors (using edge oblt data or any data
that\nincludes the field values shown)\n- Click on the service and
navigate to Errors tab \n- The Error sample should include the summary
data
\n\n![image](https://github.com/user-attachments/assets/c86fdc3e-cd88-46b5-a59a-e1b8c7d44bef)","sha":"36e930c27346b1a729bea7fc663b6934bbfca403"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/213430","number":213430,"mergeCommit":{"message":"[APM][Errors]
Fix: Missing summary data in in error sample (#213430)\n\nCloses #213418
\n## Summary\n\nThis PR fixes the missing error sample summary by adding
the missing\nfields\n\nBug (Before) | Fix
(After)\n|-----------------------|-----------|\n| <img width=\"1912\"
alt=\"image\"\nsrc=\"https://github.com/user-attachments/assets/f7a9b007-529d-422d-b0e2-eac2e06c26b1\"\n/>
|\n![image](https://github.com/user-attachments/assets/c31ef1f6-44fd-442f-a12e-d3df0790cdc5)\n|\n\n##
Testing\n- Find a service with errors (using edge oblt data or any data
that\nincludes the field values shown)\n- Click on the service and
navigate to Errors tab \n- The Error sample should include the summary
data
\n\n![image](https://github.com/user-attachments/assets/c86fdc3e-cd88-46b5-a59a-e1b8c7d44bef)","sha":"36e930c27346b1a729bea7fc663b6934bbfca403"}}]}]
BACKPORT-->

Co-authored-by: jennypavlova <dzheni.pavlova@elastic.co>

x-pack/platform/packages/shared/kbn-apm-types/src/es_fields/apm.ts

@@ -48,6 +48,7 @@ export const HTTP_RESPONSE_STATUS_CODE = 'http.response.status_code';
 export const USER_ID = 'user.id';
 export const USER_AGENT_ORIGINAL = 'user_agent.original';
 export const USER_AGENT_NAME = 'user_agent.name';
+export const USER_AGENT_VERSION = 'user_agent.version';
 
 export const OBSERVER_VERSION = 'observer.version';
 export const OBSERVER_VERSION_MAJOR = 'observer.version_major';

x-pack/solutions/observability/plugins/apm/public/components/app/error_group_details/error_sampler/error_sample_detail.tsx

@@ -158,6 +158,7 @@ export function ErrorSampleDetails({
   const errorUrl = error.error.page?.url || error.url?.full;
   const method = error.http?.request?.method;
   const status = error.http?.response?.status_code;
+  const userAgent = error?.user_agent;
   const environment = error.service.environment;
   const serviceVersion = error.service.version;
   const isUnhandled = error.error.exception?.[0]?.handled === false;
@@ -249,9 +250,7 @@ export function ErrorSampleDetails({
             errorUrl && method ? (
               <HttpInfoSummaryItem url={errorUrl} method={method} status={status} />
             ) : null,
-            transaction && transaction.user_agent ? (
-              <UserAgentSummaryItem {...transaction.user_agent} />
-            ) : null,
+            userAgent?.name ? <UserAgentSummaryItem {...userAgent} /> : null,
             transaction && (
               <EuiToolTip
                 content={i18n.translate('xpack.apm.errorSampleDetails.relatedTransactionSample', {

x-pack/solutions/observability/plugins/apm/server/routes/errors/get_error_groups/get_error_sample_details.ts

@@ -29,6 +29,12 @@ import {
   ERROR_STACK_TRACE,
   SPAN_ID,
   SERVICE_LANGUAGE_NAME,
+  URL_FULL,
+  HTTP_REQUEST_METHOD,
+  HTTP_RESPONSE_STATUS_CODE,
+  TRANSACTION_PAGE_URL,
+  USER_AGENT_NAME,
+  USER_AGENT_VERSION,
 } from '../../../../common/es_fields/apm';
 import { environmentQuery } from '../../../../common/utils/environment_query';
 import { ApmDocumentType } from '../../../../common/document_type';
@@ -42,6 +48,7 @@ export interface ErrorSampleDetailsResponse {
   transaction: Transaction | undefined;
   error: Omit<APMError, 'transaction' | 'error'> & {
     transaction?: { id?: string; type?: string };
+    user_agent?: { name?: string; version?: string };
     error: {
       id: string;
     } & Omit<APMError['error'], 'exception' | 'log'> & {
@@ -90,6 +97,12 @@ export async function getErrorSampleDetails({
     ERROR_EXC_MESSAGE,
     ERROR_EXC_HANDLED,
     ERROR_EXC_TYPE,
+    URL_FULL,
+    HTTP_REQUEST_METHOD,
+    HTTP_RESPONSE_STATUS_CODE,
+    TRANSACTION_PAGE_URL,
+    USER_AGENT_NAME,
+    USER_AGENT_VERSION,
   ] as const);
 
   const params = {