From 456e9fdd3bff4b24244749cad18cbfaa33c29844 Mon Sep 17 00:00:00 2001 From: Adam Tackett Date: Wed, 4 Dec 2024 10:45:39 -0800 Subject: [PATCH] address comments Signed-off-by: Adam Tackett --- .../components/common/helper_functions.tsx | 31 +++---------------- .../components/services/services_content.tsx | 7 ++--- .../span_detail_table.test.tsx.snap | 2 ++ .../__tests__/span_detail_panel.test.tsx | 22 +------------ .../components/traces/span_detail_table.tsx | 2 ++ .../components/traces/traces_content.tsx | 7 ++--- public/components/trace_analytics/index.scss | 24 ++++++++++++++ .../components/visualizations/plotly/plot.tsx | 2 +- 8 files changed, 40 insertions(+), 57 deletions(-) diff --git a/public/components/trace_analytics/components/common/helper_functions.tsx b/public/components/trace_analytics/components/common/helper_functions.tsx index 847b136a7a..ec7ad6e17b 100644 --- a/public/components/trace_analytics/components/common/helper_functions.tsx +++ b/public/components/trace_analytics/components/common/helper_functions.tsx @@ -596,6 +596,7 @@ interface FullScreenWrapperProps { isFullScreen: boolean; } +// EUI Data grid full screen button is currently broken, this is a workaround export const FullScreenWrapper: React.FC = ({ children, onClose, @@ -605,39 +606,15 @@ export const FullScreenWrapper: React.FC = ({ return ( -
+
-
- {children} -
+
{children}
); diff --git a/public/components/trace_analytics/components/services/services_content.tsx b/public/components/trace_analytics/components/services/services_content.tsx index bdde68ab75..4535eeda21 100644 --- a/public/components/trace_analytics/components/services/services_content.tsx +++ b/public/components/trace_analytics/components/services/services_content.tsx @@ -61,10 +61,6 @@ export function ServicesContent(props: ServicesProps) { const [serviceTrends, setServiceTrends] = useState({}); const searchBarRef = useRef<{ updateQuery: (newQuery: string) => void }>(null); - useEffect(() => { - refresh(); - }, [startTime, endTime, props.dataSourceMDSId]); - useEffect(() => { const isNavGroupEnabled = coreRefs?.chrome?.navGroup.getNavGroupEnabled(); chrome.setBreadcrumbs([...(isNavGroupEnabled ? [] : [parentBreadcrumb]), ...childBreadcrumbs]); @@ -104,6 +100,9 @@ export function ServicesContent(props: ServicesProps) { jaegerIndicesExist, dataPrepperIndicesExist, isServiceTrendEnabled, + startTime, + endTime, + props.dataSourceMDSId, ]); const refresh = async (currService?: string, overrideQuery?: string) => { diff --git a/public/components/trace_analytics/components/traces/__tests__/__snapshots__/span_detail_table.test.tsx.snap b/public/components/trace_analytics/components/traces/__tests__/__snapshots__/span_detail_table.test.tsx.snap index bf78baef2b..b48c8a26b9 100644 --- a/public/components/trace_analytics/components/traces/__tests__/__snapshots__/span_detail_table.test.tsx.snap +++ b/public/components/trace_analytics/components/traces/__tests__/__snapshots__/span_detail_table.test.tsx.snap @@ -614,6 +614,7 @@ exports[`SpanDetailTableHierarchy renders the empty component 1`] = ` , , { expect(resetButton.prop('isDisabled')).toBe(true); }); - it('handles view toggle button group', () => { - const wrapper = mount(); - const toggleButtons = wrapper.find(EuiButtonGroup); - expect(toggleButtons).toHaveLength(1); - - // Verify initial state is 'timeline' - expect(toggleButtons.prop('idSelected')).toBe('timeline'); - - // Simulate changing the toggle - act(() => { - toggleButtons.prop('onChange')!('span_list'); - }); - - wrapper.update(); - - // Verify the toggle button group has been updated - const updatedToggleButtons = wrapper.find(EuiButtonGroup); - expect(updatedToggleButtons.prop('idSelected')).toBe('span_list'); - }); - it('handles user-defined zoom range via mini-map', () => { const wrapper = mount(); diff --git a/public/components/trace_analytics/components/traces/span_detail_table.tsx b/public/components/trace_analytics/components/traces/span_detail_table.tsx index e432172b64..8cabda8692 100644 --- a/public/components/trace_analytics/components/traces/span_detail_table.tsx +++ b/public/components/trace_analytics/components/traces/span_detail_table.tsx @@ -459,6 +459,7 @@ export function SpanDetailTableHierarchy(props: SpanDetailTableProps) { key="expandAll" color="text" iconType="expand" + data-test-subj="treeExpandAll" > Expand all , @@ -468,6 +469,7 @@ export function SpanDetailTableHierarchy(props: SpanDetailTableProps) { key="collapseAll" color="text" iconType="minimize" + data-test-subj="treeCollapseAll" > Collapse all , diff --git a/public/components/trace_analytics/components/traces/traces_content.tsx b/public/components/trace_analytics/components/traces/traces_content.tsx index 1912032d5b..b809372fc7 100644 --- a/public/components/trace_analytics/components/traces/traces_content.tsx +++ b/public/components/trace_analytics/components/traces/traces_content.tsx @@ -73,10 +73,6 @@ export function TracesContent(props: TracesProps) { const [includeMetrics, setIncludeMetrics] = useState(false); const isNavGroupEnabled = coreRefs?.chrome?.navGroup.getNavGroupEnabled(); - useEffect(() => { - refresh(); - }, [startTime, endTime, props.dataSourceMDSId]); - useEffect(() => { chrome.setBreadcrumbs([ ...(isNavGroupEnabled ? [] : [props.parentBreadcrumb]), @@ -119,6 +115,9 @@ export function TracesContent(props: TracesProps) { includeMetrics, tracesTableMode, props.setDataSourceMenuSelectable, + startTime, + endTime, + props.dataSourceMDSId, ]); const onToggle = (isOpen: boolean) => { diff --git a/public/components/trace_analytics/index.scss b/public/components/trace_analytics/index.scss index 779a472596..5cd2ec9cdf 100644 --- a/public/components/trace_analytics/index.scss +++ b/public/components/trace_analytics/index.scss @@ -122,3 +122,27 @@ th[data-test-subj^='tableHeaderCell_dashboard_latency_variance'] { .popOverSelectableItem { white-space: initial !important; } + +.full-screen-wrapper { + position: fixed; + top: 0; + left: 0; + width: 100vw; + height: 100vh; + background-color: #fff; + z-index: 9999; + display: flex; + flex-direction: column; +} + +.full-screen-close-icon { + position: absolute; + top: 4px; + right: 4px; + z-index: 10000; +} + +.full-screen-content { + flex: 1 1 auto; + overflow: auto; +} \ No newline at end of file diff --git a/public/components/visualizations/plotly/plot.tsx b/public/components/visualizations/plotly/plot.tsx index 96ef96a3fa..359e1e6d54 100644 --- a/public/components/visualizations/plotly/plot.tsx +++ b/public/components/visualizations/plotly/plot.tsx @@ -16,7 +16,7 @@ interface PltProps { onUnhoverHandler?: (event: Readonly) => void; onClickHandler?: (event: Readonly) => void; onSelectedHandler?: (event: Readonly) => void; - onRelayout?: (event: any) => void; + onRelayout?: (event: Readonly) => void; height?: string; dispatch?: (props: any) => void; }