jens/flipper
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Draw selected and hovered node borders in overlay layer

Browse Source 
Summary:
The previous approach of setting some of the borders to be thicker and different colours was flakey, sometimes parts of the border would be cut off by a parent

With this approach we figure out the offset relative to the root of the visualiser, and draw a box that is definatley on top. It works much more reliably

Also fixed a couple of other niggles:
1. Can unselect when clicking again
2. Going into focus mode clears selection since your selection may not be in the focused area and there is a phantom box

Reviewed By: lblasa

Differential Revision: D46224034

fbshipit-source-id: 24bed8db38cddab796f786e7e0a4acfe7c6a9089
This commit is contained in:
Luke De Feo
2023-06-07 06:20:13 -07:00
committed by Facebook GitHub Bot
parent 2815ba0fb8
commit c13180a929
2 changed files with 78 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
desktop/plugins/public/ui-debugger/index.tsx
View File

@@ -375,7 +375,12 @@ function uiActions(uiState: UIState, nodes: Atom<Map<Id, UINode>>): UIActions {
});
};
const onSelectNode = (node?: Id) => {
uiState.selectedNode.set(node);
if (uiState.selectedNode.get() === node) {
uiState.selectedNode.set(undefined);
} else {
uiState.selectedNode.set(node);
}
if (node) {
const selectedNode = nodes.get().get(node);
const tags = selectedNode?.tags;
@@ -410,12 +415,14 @@ function uiActions(uiState: UIState, nodes: Atom<Map<Id, UINode>>): UIActions {
};
const onFocusNode = (node?: Id) => {
if (node) {
if (node != null) {
const focusedNode = nodes.get().get(node);
const tags = focusedNode?.tags;
if (tags) {
tracker.track('node-focused', {name: focusedNode.name, tags});
}
uiState.selectedNode.set(undefined);
}
uiState.focusedNode.set(node);