diff --git a/src/entities/profiler/lib/use-profiler/use-profiler.ts b/src/entities/profiler/lib/use-profiler/use-profiler.ts index bcc19fd6..980da4ec 100644 --- a/src/entities/profiler/lib/use-profiler/use-profiler.ts +++ b/src/entities/profiler/lib/use-profiler/use-profiler.ts @@ -7,7 +7,7 @@ type TUseProfiler = () => { normalizeProfilerEvent: (event: ServerEvent) => NormalizedEvent getTopFunctions: (id: EventId, params?: Record) => Promise getCallGraph: (id: EventId, params?: Record) => Promise - getFlameChart: (id: EventId, params?: Record) => Promise + getFlameChart: (id: EventId, params?: Record) => Promise } export const useProfiler: TUseProfiler = () => { diff --git a/src/entities/profiler/ui/flame-graph/flame-graph.vue b/src/entities/profiler/ui/flame-graph/flame-graph.vue index cb372ede..d94e49e0 100644 --- a/src/entities/profiler/ui/flame-graph/flame-graph.vue +++ b/src/entities/profiler/ui/flame-graph/flame-graph.vue @@ -66,6 +66,7 @@ const renderChart = async () => { }) flameChart.render() + window.addEventListener( 'resize', debounce(() => { diff --git a/src/entities/profiler/ui/profiler-page/profiler-page.vue b/src/entities/profiler/ui/profiler-page/profiler-page.vue index 11e208d5..ac9dd807 100644 --- a/src/entities/profiler/ui/profiler-page/profiler-page.vue +++ b/src/entities/profiler/ui/profiler-page/profiler-page.vue @@ -43,16 +43,23 @@ const activeEdgeStyle = computed(() => { } }) +const clearActiveEdge = () => { + activeEdge.value = null + activeEdgePosition.value = defaultPosition +} + const setActiveEdge = (value: CallStackHoverData | undefined) => { - if (value) { - const { position, ...edge } = value || {} - - activeEdge.value = edge - activeEdgePosition.value = position - } else { - activeEdge.value = null - activeEdgePosition.value = defaultPosition + if (!value) { + clearActiveEdge() + return } + + const { position, ...edge } = value || {} + + activeEdge.value = edge + activeEdgePosition.value = position + + return } const tabChange = (selectedTab: { tab: { name: string } }) => { @@ -82,7 +89,7 @@ const tabChange = (selectedTab: { tab: { name: string } }) => { :data-key="activeTab" :payload="event.payload" @hover="setActiveEdge" - @hide="setActiveEdge" + @hide="clearActiveEdge" /> diff --git a/src/shared/lib/io/use-profiler-requests.ts b/src/shared/lib/io/use-profiler-requests.ts index 2818df89..115ecbf6 100644 --- a/src/shared/lib/io/use-profiler-requests.ts +++ b/src/shared/lib/io/use-profiler-requests.ts @@ -7,7 +7,7 @@ import { REST_API_URL } from "./constants"; type TUseProfilerRequests = () => { getTopFunctions: (id: EventId, params?: Record) => Promise getCallGraph: (id: EventId, params?: Record) => Promise - getFlameChart: (id: EventId) => Promise + getFlameChart: (id: EventId) => Promise } enum ProfilerPartType {