Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Focus on components in dependency graph and hide other nodes #336

Conversation

rbt-mm
Copy link
Contributor

@rbt-mm rbt-mm commented Nov 24, 2022

Description

If a component is affected by a vulnerability and you want to know which components are dependent on the vulnerable component, it requires manually looking through the dependency graph and expanding every node to find every occurrence of the component.

This PR adds a new functionality to the dependency graph, which expands every path to a specific component and highlights the corresponding node, and optionally, hides all other nodes which are not in the path.

It also adds buttons to different views:

  • Component view
  • Project components list
  • Project audit vulnerabilities
  • Project exploit predictions
  • Project policy violations

These buttons redirect to the component's project view, open the dependency graph and then focus on every occurrence of the component.

Addressed Issue

Backend: #1997

Additional Details

Backend PR

Screenshot 2022-11-23 131931

image

image

Checklist

rbt-mm and others added 9 commits November 16, 2022 12:32
Added new buttons to `Component`, `ProjectComponents` and
`ProjectPolicyViolations`.

Button in `ProjectFindings` is not yet added.

Buttons don't have functionality yet.

Signed-off-by: RBickert <rbt@mm-software.com>
Adds a new query parameter for a project view, to find every occurence
of a component in the dependency graph and highlight it.

Signed-off-by: RBickert <rbt@mm-software.com>
Adds hyperlinks to components in different views:
- Component
- ProjectComponents
- ProjectFindings
- ProjectPolicyViolations
- ProjectEpss

Those hyperlinks redirect to the projects dependency graph with every
path to every occurrence of the specified component being expanded and
the corresponding node being highlighted.

Signed-off-by: RBickert <rbt@mm-software.com>
Adds new toggle to only show every direct path to the searched
dependency and hide all other dependencies.

Changed hyperlinks in other views to always display, regardless of a
projects direct dependencies.

Signed-off-by: RBickert <rbt@mm-software.com>
Signed-off-by: RBickert <rbt@mm-software.com>
Use `$route.param` instead of `$route.query` to redirect to dependency
graph to make redirect transition smooth instead of reloading the page
everytime.

Fix tooltips not showing or still displaying after redirect.

Signed-off-by: RBickert <rbt@mm-software.com>
Signed-off-by: RBickert <rbt@mm-software.com>
Signed-off-by: RBickert <rbt@mm-software.com>
…om-other-views

Focus on components in dependency graph and hide other nodes
@msymons
Copy link
Member

msymons commented Dec 2, 2022

@rkg-mm, I think that this new functionality will be really useful and look forward to testing it and providing feedback.

Will the work (or a possible later PR) cater for the use case where a dependency graph contains clashing versions of transitive dependencies that need to be explored (and resolved)? I have had Maven projects where there have been three different versions of a component in the SBOM. Only one is actually included in the shaded jar (or whatever) and it is almost always the latest of the versions... but not always. Hence the desire to investigate.

A simple addition to dependencyManagement can fix things. But I would hope that one of the values of a dependency graph is that one might think about how updating one or more parent components can give one "more bang for the buck".

ie, if the basic functionality is to graph (say):

pkg:maven/commons-codec/commons-codec@1.15?type=jar

might it be possible to add a button to the screen that allows the user to expand the graph for:

pkg:maven/commons-codec/commons-codec@

As a work-around, It is possible to manually expand the entire graph for a project and just search it for commons-codec. Now that the whole tree can already be expanded to full depth manually in an already-released SNAPSHOT, I have done some testing. It works great... but can take absolutely ages! Not because of performance but just because of the effort in spotting all nodes that can be expanded and then clicking on them one by one.

Aside, I read (and understood) comments in other issues that there is a strong desire to NOT automatically load the whole tree due to potential performance issues.

@rkg-mm
Copy link
Contributor

rkg-mm commented Dec 2, 2022

@msymons
At the moment we don't plan an addition for finding multiple versions. What you can do, is load the tree separate for each of the versions from the components view, since it will look up the exact version in the tree. You'd have to check each tree then. Not sure what benefit you would get from having them all in one view?
It's surely possible to do, but will take a while to load for big trees when checking for more than a single component I think (it already takes a while for one single component now).

Loading the full tree is something we don't want to do, but one addition I thought about, is to be able to double click a node or its + sign which could expand the full tree below. I don't see how this would be useful anymore from my current use cases with this addition here, so we no longer planned to do this though...

Copy link
Member

@nscuro nscuro left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the great PR @rbt-mm!

Sorry for the long wait. Few suggestions.

On a related note, would it be possible to extend this in the future to allow searching the graph? The lazy loading may make this challenging, but maybe you have some ideas already?

src/i18n/locales/en.json Outdated Show resolved Hide resolved
src/views/portfolio/projects/ProjectDependencyGraph.vue Outdated Show resolved Hide resolved
src/views/portfolio/projects/Component.vue Show resolved Hide resolved
rbt-mm and others added 2 commits December 9, 2022 11:18
Signed-off-by: RBickert <rbt@mm-software.com>
…rom-other-views

Change `Hide other components` to `Show complete graph`.

Don't show complete graph on component lookup.
@nscuro nscuro added the enhancement New feature or request label Dec 9, 2022
@nscuro nscuro added this to the 4.7 milestone Dec 9, 2022
@nscuro nscuro merged commit 0c1b1e1 into DependencyTrack:master Dec 9, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants