Skip to content

Commit 770276a

Browse files
authored
feat: Add search to trace waterfall (#1377)
Closes HDX-2753 Closes HDX-2755 Closes HDX-2756 # Summary This PR adds a search function for filtering spans and logs in the trace waterfall. Because the waterfall can consist of both spans and logs, from two different sources, there is one input per source. If the correlated log source is not available (ensuring there are no logs in the waterfall) then there is only one input. The input persists in the query parameters so that the filtered side panel can be shared, and the parameters are cleared when the side panel closes. Currently, only Lucene is supported for searching. This PR also adds a couple of minor improvements to the waterfall 1. There is now a count of spans and errors 2. There is now a span status in the waterfall tooltip ## Demo https://github.com/user-attachments/assets/fb623875-5811-4f7f-9f40-c0b34de1c541
1 parent 237a267 commit 770276a

File tree

8 files changed

+280
-39
lines changed

8 files changed

+280
-39
lines changed

.changeset/slimy-mayflies-press.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@hyperdx/app": patch
3+
---
4+
5+
feat: Add waterfall span/error count summary, span tooltip status

.changeset/wet-pillows-pump.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
"@hyperdx/common-utils": patch
3+
"@hyperdx/app": patch
4+
---
5+
6+
feat: Add search to trace waterfall

packages/app/src/components/DBRowSidePanel.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import DBRowSidePanelHeader, {
2121
BreadcrumbPath,
2222
} from '@/components/DBRowSidePanelHeader';
2323
import useResizable from '@/hooks/useResizable';
24+
import useWaterfallSearchState from '@/hooks/useWaterfallSearchState';
2425
import { LogSidePanelKbdShortcuts } from '@/LogSidePanelElements';
2526
import { getEventBody } from '@/source';
2627
import TabBar from '@/TabBar';
@@ -518,14 +519,19 @@ export default function DBRowSidePanelErrorBoundary({
518519
parseAsStringEnum<Tab>(Object.values(Tab)),
519520
);
520521

522+
const { clear: clearTraceWaterfallSearchState } = useWaterfallSearchState({});
523+
521524
const _onClose = useCallback(() => {
522525
// Reset tab to undefined when unmounting, so that when we open the drawer again, it doesn't open to the last tab
523526
// (which might not be valid, ex session replay)
524527
if (!isNestedPanel) {
525528
setQueryTab(null);
526529
}
530+
// Clear waterfall search state on close, so that filters don't
531+
// persist when reopening another trace.
532+
clearTraceWaterfallSearchState();
527533
onClose();
528-
}, [setQueryTab, isNestedPanel, onClose]);
534+
}, [setQueryTab, isNestedPanel, onClose, clearTraceWaterfallSearchState]);
529535

530536
useHotkeys(['esc'], _onClose, { enabled: subDrawerOpen === false });
531537

0 commit comments

Comments
 (0)