grafana/public/app/plugins/panel/nodeGraph/useHighlight.ts
Andrej Ocenas fdd6620d0a
NodeGraph: Exploration mode (#33623)
* Add exploration option to node layout

* Add hidden node count

* Add grid layout option

* Fix panning bounds calculation

* Add legend with sorting

* Allow sorting on any stats or arc value

* Fix merge

* Make sorting better

* Reset focused node on layout change

* Refactor limit hook a bit

* Disable selected layout button

* Don't show markers if only 1 node is hidden

* Move legend to the bottom

* Fix text backgrounds

* Add show in graph layout action in grid layout

* Center view on the focused node, fix perf issue when expanding big graph

* Limit the node counting

* Comment and linting fixes

* Bit of code cleanup and comments

* Add state for computing layout

* Prevent computing map with partial data

* Add rollup plugin for worker

* Add rollup plugin for worker

* Enhance data from worker

* Fix perf issues with reduce and object creation

* Improve comment

* Fix tests

* Css fixes

* Remove worker plugin

* Add comments

* Fix test

* Add test for exploration

* Add test switching to grid layout

* Apply suggestions from code review

Co-authored-by: Zoltán Bedi <zoltan.bedi@gmail.com>

* Remove unused plugin

* Fix function name

* Remove unused rollup plugin

* Review fixes

* Fix context menu shown on layout change

* Make buttons bigger

* Moved NodeGraph to core grafana

Co-authored-by: Zoltán Bedi <zoltan.bedi@gmail.com>
2021-05-12 16:04:21 +02:00

20 lines
516 B
TypeScript

import { useEffect, useState } from 'react';
import useMountedState from 'react-use/lib/useMountedState';
export function useHighlight(focusedNodeId?: string) {
const [highlightId, setHighlightId] = useState<string>();
const mounted = useMountedState();
useEffect(() => {
if (focusedNodeId) {
setHighlightId(focusedNodeId);
setTimeout(() => {
if (mounted()) {
setHighlightId(undefined);
}
}, 500);
}
}, [focusedNodeId, mounted]);
return highlightId;
}