Skip to content

Show security reports summary in pipelines' Security Dashboard - Frontend

frontend Implementation parent issue for #197115 (closed)

Problem to solve

This is a 2nd iteration issue for #197115 (closed) to move the data into an expandable component.

image

Implementation Strategy

  • Cleanup the work that was done in !31136 (diffs)
    • Revert the changes done in ee/app/assets/javascripts/security_dashboard/components/filter.vue
    • Revert the changes done in ee/app/assets/javascripts/security_dashboard/components/filters.vue and its specs
    • Stop passing the reports summary down the filters in ee/app/assets/javascripts/security_dashboard/components/security_dashboard_vuex.vue
  • Update the GraphQL query in the frontend to match the final schema that was implemented in !31550 (merged).
  • Create a new SecurityReportsSummary component
    • The component is based on GlCollapse
    • We'll want to store the collapsed/expanded state in the local storage
    • The component receives securityReportSummary as a prop
      • note: we could potentially move the GraphQL query to the new component, but keeping it in the parent component makes it easier to reuse if we ever wanted to display similar summaries somewhere else.
    • Hide summary entries if the corresponding scanner is null in the GraphQL response (= scanner is not setup). The backend for this will be done in #223073 (closed)
    • Add unit tests
  • Extend the PipelineSecurityDashboard component's template to include the SecurityReportsSummary component
Edited by Paul Gascou-Vaillancourt