From 2f467cd8d04b5727637314b155bc89c1223daaa1 Mon Sep 17 00:00:00 2001 From: iblancof Date: Mon, 27 Oct 2025 15:29:27 +0100 Subject: [PATCH 1/4] Add fallback to traceItems when calling useTraceWaterfall in TraceWaterfallContextProvider --- .../shared/trace_waterfall/trace_waterfall_context.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/x-pack/solutions/observability/plugins/apm/public/components/shared/trace_waterfall/trace_waterfall_context.tsx b/x-pack/solutions/observability/plugins/apm/public/components/shared/trace_waterfall/trace_waterfall_context.tsx index 081e744f423ff..dc9819a14e02e 100644 --- a/x-pack/solutions/observability/plugins/apm/public/components/shared/trace_waterfall/trace_waterfall_context.tsx +++ b/x-pack/solutions/observability/plugins/apm/public/components/shared/trace_waterfall/trace_waterfall_context.tsx @@ -87,7 +87,7 @@ export function TraceWaterfallContextProvider({ }: Props) { const { duration, traceWaterfall, maxDepth, rootItem, legends, colorBy, traceState } = useTraceWaterfall({ - traceItems, + traceItems: traceItems || [], }); const left = TOGGLE_BUTTON_WIDTH + ACCORDION_PADDING_LEFT * maxDepth; From c85ffbb53c881f16f56843999aba8326b5286792 Mon Sep 17 00:00:00 2001 From: iblancof Date: Tue, 28 Oct 2025 14:21:41 +0100 Subject: [PATCH 2/4] Undo default value for traceItems on useTraceWaterfall --- .../shared/trace_waterfall/trace_waterfall_context.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/x-pack/solutions/observability/plugins/apm/public/components/shared/trace_waterfall/trace_waterfall_context.tsx b/x-pack/solutions/observability/plugins/apm/public/components/shared/trace_waterfall/trace_waterfall_context.tsx index dc9819a14e02e..081e744f423ff 100644 --- a/x-pack/solutions/observability/plugins/apm/public/components/shared/trace_waterfall/trace_waterfall_context.tsx +++ b/x-pack/solutions/observability/plugins/apm/public/components/shared/trace_waterfall/trace_waterfall_context.tsx @@ -87,7 +87,7 @@ export function TraceWaterfallContextProvider({ }: Props) { const { duration, traceWaterfall, maxDepth, rootItem, legends, colorBy, traceState } = useTraceWaterfall({ - traceItems: traceItems || [], + traceItems, }); const left = TOGGLE_BUTTON_WIDTH + ACCORDION_PADDING_LEFT * maxDepth; From 11eb8a6807970e801de3e23f9b1980dd0834c7c5 Mon Sep 17 00:00:00 2001 From: iblancof Date: Tue, 28 Oct 2025 14:22:53 +0100 Subject: [PATCH 3/4] Add undefined safetycheck for useFetcher data in TraceWaterfallEmbeddable --- .../trace_waterfall_embeddable.tsx | 18 +++++++++++++++++- 1 file changed, 17 insertions(+), 1 deletion(-) diff --git a/x-pack/solutions/observability/plugins/apm/public/embeddable/trace_waterfall/trace_waterfall_embeddable.tsx b/x-pack/solutions/observability/plugins/apm/public/embeddable/trace_waterfall/trace_waterfall_embeddable.tsx index 29fb739dd99b3..7b80dbe9c8948 100644 --- a/x-pack/solutions/observability/plugins/apm/public/embeddable/trace_waterfall/trace_waterfall_embeddable.tsx +++ b/x-pack/solutions/observability/plugins/apm/public/embeddable/trace_waterfall/trace_waterfall_embeddable.tsx @@ -5,6 +5,8 @@ * 2.0. */ import React from 'react'; +import { EuiCallOut } from '@elastic/eui'; +import { i18n } from '@kbn/i18n'; import { isPending, useFetcher } from '../../hooks/use_fetcher'; import { Loading } from './loading'; import type { ApmTraceWaterfallEmbeddableEntryProps } from './react_embeddable_factory'; @@ -36,9 +38,23 @@ export function TraceWaterfallEmbeddable({ return ; } + if (data === undefined) { + return ( + + ); + } + return ( Date: Tue, 28 Oct 2025 14:23:23 +0100 Subject: [PATCH 4/4] Update FocusedTraceWaterfallEmbeddable to use EuiCallout --- .../focused_trace_waterfall_embeddable.tsx | 17 ++++++++++------- 1 file changed, 10 insertions(+), 7 deletions(-) diff --git a/x-pack/solutions/observability/plugins/apm/public/embeddable/trace_waterfall/focused_trace_waterfall_embeddable.tsx b/x-pack/solutions/observability/plugins/apm/public/embeddable/trace_waterfall/focused_trace_waterfall_embeddable.tsx index 328108af3d8e2..78079947003c8 100644 --- a/x-pack/solutions/observability/plugins/apm/public/embeddable/trace_waterfall/focused_trace_waterfall_embeddable.tsx +++ b/x-pack/solutions/observability/plugins/apm/public/embeddable/trace_waterfall/focused_trace_waterfall_embeddable.tsx @@ -4,7 +4,7 @@ * 2.0; you may not use this file except in compliance with the Elastic License * 2.0. */ -import { EuiText } from '@elastic/eui'; +import { EuiCallOut } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import React from 'react'; import { FocusedTraceWaterfall } from '../../components/shared/focused_trace_waterfall'; @@ -35,12 +35,15 @@ export function FocusedTraceWaterfallEmbeddable({ if (data === undefined) { return ( - - {i18n.translate( - 'xpack.apm.focusedTraceWaterfallEmbeddable.traceWaterfallCouldNotTextLabel', - { defaultMessage: 'Trace waterfall could not be loaded' } - )} - + ); }