Focus filter first pass for VFOI

[jdanish]

The basic idea here is that you should be able to:

1. Select a node
2. Tell the system to focus
3. Set the range of the focus (e.g., how far out we focus) with a default / min of 1
4. Remove the focus much like you clear filters

Focus means the equivalent of hiding any nodes that are further away than the range. For example, If Joshua -> Kalani -> Ben -> Srithen focusing on Joshua with a range of 1 will show Joshua and Kalani, range of 2 will add Ben, and 3 will show Sri .

The focus button can go below the 3 buttons in the top right, and the range / clear can appear on the top once focus is activated.

Key elements:

• [x] Add basic focus
• [x] Add focus range
• [x] Have focus impact table view too
• [ ] Have options on how focus works (hide or filter or remove)
• [ ] Have focus work with filters as well (do both?)

[benloh]

@jdanish is this always a focus on just ONE node? Or might you have multiple nodes selected for focus?

[benloh]

Implementation Notes

We probably want to create a selection manager to properly handle this because we need to distinguish between... ...nodes

• What is being highlighted by search, which may include nodes not selected in the NodeSelector component.
• What is currently selected for display in the NodeSelector component.
• Whether the current NodeSelector component is being edited
• The currently entered text snippet
• Matching nodes that can be used as AutoSuggest for the text snippet

...edges

• Which edges are selected
• Which edges are expanded
• Which edges are in edit mode
• Any text entered as a search term as a source or target in any number of open Edge edit fields.

...everything else

• Matches also affect the NodeTable and EdgeTable displays

Due to the complexity, upping Estimate to 20.

UPDATE 2023-0530 11pm

A few more thoughts:

• We can build a shadow/parallel selection manager system just to handle this focus filter. That allows us to keep the existing system in place (even though there are some edge cases it is not handling well, especially when transitioning between edit and selection modes).
• The UI handling will be done by the selection manager, but the actual data updating is basically a filter function and probably belongs in filter-logic.js.
• The algorithm might involve stuffing a "kevin_bacon" value ("degrees of separation") into each node, starting from the selected node, and expanding to its connections. Then the filter can easily set the threshold for display.

[jdanish]

@jdanish is this always a focus on just ONE node? Or might you have multiple nodes selected for focus?

One node, but then a distance. The default distance is 1. Ideally, long-term, we can set the distance and adjust it, but short-term a distance of 1 is fine. I think unless @kalanicraig disagrees, you would only focus on a node, not an edge to help simplify.

What this means: if we assume Joshua - Kalani - Ben - Sri and Joshua - Nathan (using lines to ignore direction) if we focus on Joshua we see:

Joshua - Kalani, Joshua - Nathan

If we focus on Kalani we see: Joshua - Kalani - Ben

If we focus on Joshua but change distance to 2, we see:

Joshua - Kalani - Ben, and Joshua - Nathan

If we change distance to 3:

Joshua - Kalani - Ben - Sri, and Joshua - Nathan

[jdanish]

We probably want to create a selection manager to properly handle this because we need to distinguish between... ...nodes

• What is being highlighted by search, which may include nodes not selected in the NodeSelector component.
• What is currently selected for display in the NodeSelector component.
• Whether the current NodeSelector component is being edited
• The currently entered text snippet
• Matching nodes that can be used as AutoSuggest for the text snippet

...edges

• Which edges are selected
• Which edges are expanded
• Which edges are in edit mode
• Any text entered as a search term as a source or target in any number of open Edge edit fields.

...everything else

• Matches also affect the NodeTable and EdgeTable displays

Due to the complexity, upping Estimate to 20.

OK. However, and I'll email this - let's pause on these "quick" features until we can get a ballpark estimate on major features for Fall 2024 so that we can make sure we don't eat into those or do so intentionally?

[benloh]

@jdanish I have this mostly working now. One question is how much validation we want to do on the range field. e.g.

• By default the focus is 1
• If you want to show all nodes, you can click "Clear Filters" to show ALL nodes
• What happens if the user enters 0? or -1? Should we trap that and force the number to 1? Or do we let the user enter invalid numbers (and possibly end up removing all nodes)?

[jdanish]

Hm. I guess let's force it to be a positive integer from 1 up? If something else is entered, default back to either whatever the last number was (if easy) or 1 (if the last number is not easy).