Skip to content

[Discover][Traces] Fix processed OTel waterfall flyout #224548

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
iblancof merged 3 commits into from
Jun 19, 2025
Merged

[Discover][Traces] Fix processed OTel waterfall flyout #224548

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
9402fdd
Use fields in useSpan instead of _source
iblancof Jun 19, 2025
695d026
Update logic for "isSpan" and extract it to isSpanHit
iblancof Jun 19, 2025
fa38832
Update useSpan to match discover fields query
iblancof Jun 19, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 14 additions & 0 deletions ...ublic/components/observability/traces/components/full_screen_waterfall/helpers/is_span.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the "Elastic License
* 2.0", the "GNU Affero General Public License v3.0 only", and the "Server Side
* Public License v 1"; you may not use this file except in compliance with, at
* your election, the "Elastic License 2.0", the "GNU Affero General Public
* License v3.0 only", or the "Server Side Public License, v 1".
*/

import { DataTableRecord, PARENT_ID_FIELD, TRANSACTION_NAME_FIELD } from '@kbn/discover-utils';

export const isSpanHit = (hit: DataTableRecord | null): boolean => {
return !!hit?.flattened[PARENT_ID_FIELD] && !hit?.flattened[TRANSACTION_NAME_FIELD];
};
Comment on lines +12 to +14
Copy link
Copy Markdown
Contributor

@rmyz rmyz Jun 19, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe this is a dumb question, but since unprocessed OTel data doesn't have a transaction field (afaik), will this work?

Copy link
Copy Markdown
Contributor

@Bluefinger Bluefinger Jun 19, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think this will work anyway with unprocessed OTEL data yet, at least looking at the code, since it is querying for transactions. I think that would be best tackled as a separate PR/step.

Copy link
Copy Markdown
Contributor Author

@iblancof iblancof Jun 19, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, the specifics for non-processed OTel data compatibility are being handled in a separate issue, but I think we’ll likely end up with something similar to what you, @Bluefinger, did in this PR, using a combination of processor.event and kind.

Copy link
Copy Markdown
Contributor Author

@iblancof iblancof Jun 20, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@rmyz This PR #224654 updates the logic to support compatibility with non-processed data as well.

8 changes: 7 additions & 1 deletion .../components/observability/traces/components/full_screen_waterfall/hooks/use_span/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,12 @@ async function getSpanData({ spanId, indexPattern, data, signal }: GetTransactio
size: 1,
body: {
timeout: '20s',
fields: [
{
field: '*',
include_unmapped: true,
},
],
query: {
match: {
[SPAN_ID_FIELD]: spanId,
Expand Down Expand Up @@ -68,7 +74,7 @@ export const useSpan = ({ spanId, indexPattern }: UseSpanParams) => {
try {
setLoading(true);
const result = await getSpanData({ spanId, indexPattern, data, signal });
setSpan(result.rawResponse.hits.hits[0]?._source);
setSpan(result.rawResponse.hits.hits[0]?.fields ?? null);
setDocId(result.rawResponse.hits.hits[0]?._id ?? null);
} catch (err) {
if (!signal.aborted) {
Expand Down
4 changes: 2 additions & 2 deletions ...nts/observability/traces/components/full_screen_waterfall/hooks/use_span/use_span.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ describe('useSpan', () => {

describe('when parameters are NOT missing', () => {
it('should fetch span data successfully', async () => {
const mockHit = { _source: { name: 'test-span' }, _id: 'test-id' };
const mockHit = { fields: { name: 'test-span' }, _id: 'test-id' };

mockSearch.mockReturnValue(
of({
Expand All @@ -61,7 +61,7 @@ describe('useSpan', () => {
await waitFor(() => !result.current.loading);

expect(result.current.loading).toBe(false);
expect(result.current.span).toEqual(mockHit._source);
expect(result.current.span).toEqual(mockHit.fields);
expect(result.current.docId).toEqual(mockHit._id);
});
});
Expand Down
6 changes: 4 additions & 2 deletions ...ic/components/observability/traces/components/full_screen_waterfall/span_flyout/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,13 +15,14 @@ import {
EuiFlyoutBody,
EuiSkeletonTitle,
} from '@elastic/eui';
import { DataTableRecord, PARENT_ID_FIELD } from '@kbn/discover-utils';
import { DataTableRecord } from '@kbn/discover-utils';
import { flattenObject } from '@kbn/object-utils';
import React, { useMemo } from 'react';
import { i18n } from '@kbn/i18n';
import { DocViewRenderProps } from '@kbn/unified-doc-viewer/types';
import { useSpan } from '../hooks/use_span';
import { SpanFlyoutBody } from './span_flyout_body';
import { isSpanHit } from '../helpers/is_span';

const flyoutId = 'spanDetailFlyout';

Expand Down Expand Up @@ -53,7 +54,8 @@ export const SpanFlyout = ({
flattened: flattenObject(span),
};
}, [docId, span]);
const isSpan = !!documentAsHit?.flattened[PARENT_ID_FIELD];

const isSpan = isSpanHit(documentAsHit);

return (
<EuiFlyout
Expand Down
5 changes: 3 additions & 2 deletions ...ts/observability/traces/components/full_screen_waterfall/span_flyout/span_flyout_body.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
*/

import { EuiSkeletonText, EuiTab, EuiTabs } from '@elastic/eui';
import { DataTableRecord, PARENT_ID_FIELD } from '@kbn/discover-utils';
import { DataTableRecord } from '@kbn/discover-utils';
import React, { useState } from 'react';
import { i18n } from '@kbn/i18n';
import { DocViewRenderProps } from '@kbn/unified-doc-viewer/types';
Expand All @@ -17,6 +17,7 @@ import TransactionOverview from '../../../doc_viewer_transaction_overview';
import DocViewerTable from '../../../../../doc_viewer_table';
import DocViewerSource from '../../../../../doc_viewer_source';
import { useDataSourcesContext } from '../../../hooks/use_data_sources';
import { isSpanHit } from '../helpers/is_span';

const tabIds = {
OVERVIEW: 'unifiedDocViewerTracesSpanFlyoutOverview',
Expand Down Expand Up @@ -58,7 +59,7 @@ export interface SpanFlyoutProps {

export const SpanFlyoutBody = ({ hit, loading, dataView }: SpanFlyoutProps) => {
const [selectedTabId, setSelectedTabId] = useState(tabIds.OVERVIEW);
const isSpan = !!hit?.flattened[PARENT_ID_FIELD];
const isSpan = isSpanHit(hit);
const { indexes } = useDataSourcesContext();
const onSelectedTabChanged = (id: string) => setSelectedTabId(id);

Expand Down