Refactoring: DAG migrated to Plexus's Digraph

[prathamesh-mutkure]

Which problem is this PR solving?

• This issue is related to LFX task [Feature]: combine all graph views into one - LFX Mentorship #1466
• I can create a more specific sub-issue if that's more suitable

Description of the changes

• I've removed cytoscape and replaced it with Digraph from Plexus
• Had to add support for labels in Digraph to support this change

How was this change tested?

• The changes were tested visually
• Tested with test data involving around 50 nodes

Before -

Now -

Tha additional tab visible in above images has been removed

Checklist

• I have read https://github.com/jaegertracing/jaeger/blob/master/CONTRIBUTING_GUIDELINES.md
• I have signed all commits
• I have added unit tests for the new functionality
• I have run lint and test steps successfully
  • for jaeger: make lint test
  • for jaeger-ui: yarn lint and yarn test

[prathamesh-mutkure]

Hey @yurishkuro, the two test cases will fail for DAG, I'll fix them ASAP, you can review the changes in the meantime

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Comparison is base (63361a2) 96.54% compared to head (c8d6f3d) 96.54%.

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #1981   +/-   ##
=======================================
  Coverage   96.54%   96.54%           
=======================================
  Files         255      255           
  Lines        7611     7616    +5     
  Branches     1983     1984    +1     
=======================================
+ Hits         7348     7353    +5     
  Misses        263      263           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[prathamesh-mutkure]

Hey @yashrsharma44, tagging you for review

The code coverage has dropped, will try to increase it

[yurishkuro]

• ping zoom does not seem to work at all, I am getting the whole browser window changing zoom instead of the graph div only, as it was in the old DAG. I know that zoom does work in DDG (but does not seem to work in Trace Diff)
• is dragging of the nodes not supported by Plexus at all? Not the end of the world if it's not.

[yurishkuro]

Another odd thing: if I tab to Force Directed Graph and then back to DAG, the minimap goes rather nuts - the light-gray box is supposed to indicate current zoom view in the viewport, and it shows outside of it, even though the main display is fine. Clicking on the reset button returns the box back into full size minimap. I suspect it may be related to the zoom nor working.

[yurishkuro]

I tried this with graphs with larger number of nodes. With 15 nodes it looks like this:

Curious why the nodes / text are so small, there's enough space between them for larger nodes.

The zoom seems to work with these larger graphs.

[prathamesh-mutkure]

• ping zoom does not seem to work at all, I am getting the whole browser window changing zoom instead of the graph div only, as it was in the old DAG. I know that zoom does work in DDG (but does not seem to work in Trace Diff)

The graph is likely smaller, you seem to got the zoom working with larger graph

is dragging of the nodes not supported by Plexus at all? Not the end of the world if it's not.

Did not see anything in the documentation and code sadly

if I tab to Force Directed Graph and then back to DAG, the minimap goes rather nuts

I'll check this one and try to fix it

I tried this with graphs with a larger number of nodes. With 15 nodes it looks like this:
Curious why the nodes / text are so small, there's enough space between them for larger nodes

The coordinates are actually returned by Plexus, the size of nodes is static, and we can play around with the size of nodes

Also, can you share data for those 15 nodes?

[yurishkuro]

15-node graph https://gist.github.com/yurishkuro/1f7dfbceebc5f192a2e3108c53ad96da

[yurishkuro]

The graph is likely smaller, you seem to got the zoom working with larger graph

that doesn't explain why the zoom doesn't work - with the larger 15-node graph I can zoom it so that the nodes are twice as large as in the default hotrod graph (which doesn't zoom)

[yurishkuro]

why do we need to use ShallowRenderer and not the standard render? Does ShallowRenderer actually render more details?