Fix caching issue for component filter
What does this MR do and why?
Utilize cache for the component filter. Turns out the reason the caching wasn't working before (!202657 (comment 2732857626)) was due to Vue's reactivity. Instead of passing the argument as a Vue reactive array, convert it to a plain array. Now GraphQL caching is working as expected.
- Select 2 versions > makes request > show 2 dependencies
- Select 1 versions > make request > show 1 dependency
- Section 2 versions again - NO request (utilizing cache) > show 2 dependencies
✅
Screenshots or screen recordings
| Before | After |
|---|---|
How to set up and validate locally
- Enable FF: http://gdk.test:3000/rails/features/project_dependencies_graphql
- Clone this project: https://gitlab.com/gitlab-org/govern/threat-insights-demos/security-reports-with-dependency-paths
- Run a successful pipeline
- Go to the Dependency list page
- Filter by Version and make sure it works
- Only GraphQL requests are made
MR acceptance checklist
Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.
Related to #569450 (closed)
Edited by Samantha Ming