[frontend] Update drawer to include vulnerability management policy
Why are we doing this work
When clicking on a policy in the policy list, it opens the drawer. The policy drawer needs to support the new Vulnerability management policy type.
Relevant links
Design: No design for this yet. We can go with #452328[list_view-with_drawer.png] for now as inspiration.
Non-functional requirements
-
Documentation: -
Feature flag: vulnerability_management_policy_type
-
Performance: -
Testing: unit tests
Implementation plan
- Create new folder
vulnerability_management
insecurity_orchestration/components/policy_drawer
- Add
details_drawer.vue
similar to existing ones (checkpipeline_execution
) - Make sure it has all rows as design requires
Verification steps
- Go to https://staging.gitlab.com/govern-team-test/verify-vulnerability-management-policy/verify-465728/-/security/policies
- make sure you have vue force dev extension installed https://chromewebstore.google.com/detail/vue-force-dev/oohfffedbkbjnbpbbedapppafmlnccmb
- open vue devtools and find the
ListComponent
(see screenshot) and select it - open the console and enter
$vm0.selectedPolicy = {
__typename: 'VulnerabilityManagementPolicy',
name: 'Resolve no longer detected',
yaml: '---\nname: Resolve no longer detected\ndescription: Auto-resolve all no longer detected vulnerabilities.\nenabled: true\nactions:\n- type: auto_resolve\nrules:\n- type: no_longer_detected\n severity_levels: []\n scanners: []',
editPath:
'https://gdk.test:3443/gitlab-org/security-reports/-/security/policies/scan+exec+1/edit?type=scan_execution_policy',
enabled: true,
policyScope: {
__typename: 'PolicyScope',
complianceFrameworks: {
__typename: 'ComplianceFrameworkConnection',
nodes: [],
pageInfo: {
__typename: 'PageInfo',
hasNextPage: false,
hasPreviousPage: false,
startCursor: null,
endCursor: null,
},
},
excludingProjects: {
__typename: 'ProjectConnection',
nodes: [],
pageInfo: {
__typename: 'PageInfo',
hasNextPage: false,
hasPreviousPage: false,
startCursor: null,
endCursor: null,
},
},
includingProjects: {
__typename: 'ProjectConnection',
nodes: [],
pageInfo: {
__typename: 'PageInfo',
hasNextPage: false,
hasPreviousPage: false,
startCursor: null,
endCursor: null,
},
},
},
source: {
__typename: 'ProjectSecurityPolicySource',
project: { __typename: 'Project', fullPath: 'gitlab-org/security-reports' },
},
updatedAt: '2024-07-03T12:50:07+00:00',
policyType: 'Vulnerability management',
}
- the drawer should open with this mocked policy.
- verify that you can click and see the Details and Yaml tabs
- verify that you see the basic policy info like name, description, status, type, and scope.
Edited by Lorenz van Herwaarden