Implement new vulnerabilities and packages tabs.
Fixes https://github.com/coreos-inc/design/issues/268
This commit is contained in:
Joseph Schorr
parent
c7904db30d
commit
ae9140caae
16 changed files with 1547 additions and 171 deletions
|
|
@ -27,7 +27,7 @@
|
|||
<i class="fa fa-bug"></i>
|
||||
</span>
|
||||
<span class="cor-tab" tab-title="Packages" tab-target="#packages"
|
||||
tab-init="loadImageSecurity()"
|
||||
tab-init="loadImagePackages()"
|
||||
quay-show="Features.SECURITY_SCANNER">
|
||||
<i class="fa ci-package"></i>
|
||||
</span>
|
||||
|
|
@ -44,123 +44,12 @@
|
|||
|
||||
<!-- Vulnerabilities -->
|
||||
<div id="vulnerabilities" class="tab-pane" quay-require="['SECURITY_SCANNER']">
|
||||
<div class="resource-view" resource="securityResource" error-message="'Could not load security information for image'">
|
||||
<div class="col-md-9">
|
||||
<div class="filter-box floating" collection="securityVulnerabilities" filter-model="options.vulnFilter" filter-name="Vulnerabilities" ng-if="securityStatus == 'scanned' && securityVulnerabilities.length"></div>
|
||||
|
||||
<h3>Image Security</h3>
|
||||
<div class="empty" ng-if="securityStatus == 'queued'">
|
||||
<div class="empty-primary-msg">This image has not been indexed yet</div>
|
||||
<div class="empty-secondary-msg">
|
||||
Please try again in a few minutes.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="empty" ng-if="securityStatus == 'failed'">
|
||||
<div class="empty-primary-msg">This image could not be indexed</div>
|
||||
<div class="empty-secondary-msg">
|
||||
Our security scanner was unable to index this image.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="empty" ng-if="securityStatus == 'scanned' && !securityVulnerabilities.length">
|
||||
<div class="empty-primary-msg">This image contains no recognized security vulnerabilities</div>
|
||||
<div class="empty-secondary-msg">
|
||||
Quay currently indexes Debian, Red Hat and Ubuntu based images.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-if="securityStatus == 'scanned' && securityVulnerabilities.length">
|
||||
<table class="co-table">
|
||||
<thead>
|
||||
<td style="width: 200px;">Vulnerability</td>
|
||||
<td style="width: 200px;">Priority</td>
|
||||
<td style="width: 200px;">Introduced by</td>
|
||||
<td style="width: 200px;">Fixed by</td>
|
||||
<td>Description</td>
|
||||
</thead>
|
||||
|
||||
<tr ng-repeat="vulnerability in securityVulnerabilities | filter:options.vulnFilter | orderBy:'index'">
|
||||
<td><a href="{{ vulnerability.link }}" target="_blank">{{ vulnerability.name }}</a></td>
|
||||
<td>
|
||||
<span class="vulnerability-priority-view" priority="vulnerability.severity"></span>
|
||||
</td>
|
||||
<td>{{ vulnerability.feature.name }} {{ vulnerability.feature.version }}</td>
|
||||
<td>
|
||||
<span ng-if="vulnerability.fixedBy">{{ vulnerability.feature.name }} {{ vulnerability.fixedBy }}</span>
|
||||
</td>
|
||||
<td>{{ vulnerability.description }}</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<div class="empty" ng-if="(securityVulnerabilities | filter:options.vulnFilter).length == 0"
|
||||
style="margin-top: 20px;">
|
||||
<div class="empty-primary-msg">No matching vulnerabilities found</div>
|
||||
<div class="empty-secondary-msg">
|
||||
Please adjust your filter above.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="level-col col-md-3 hidden-sm hidden-xs">
|
||||
<h4>Priority Guide</h4>
|
||||
<ul class="levels">
|
||||
<li ng-repeat="level in VulnerabilityLevels | orderBy: 'index'">
|
||||
<div class="vulnerability-priority-view" priority="level.title"></div>
|
||||
<div class="description">
|
||||
{{ level.description }}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="image-vulnerability-view" repository="repository" image="image" is-enabled="imageSecurityCounter"></div>
|
||||
</div>
|
||||
|
||||
<!-- Features -->
|
||||
<div id="packages" class="tab-pane" quay-require="['SECURITY_SCANNER']">
|
||||
<div class="resource-view" resource="securityResource" error-message="'Could not load image packages'">
|
||||
<div class="filter-box floating" collection="securityFeatures" filter-model="options.packageFilter" filter-name="Features" ng-if="securityStatus == 'scanned' && securityFeatures.length"></div>
|
||||
|
||||
<h3>Image Packages</h3>
|
||||
<div class="empty" ng-if="securityStatus == 'queued'">
|
||||
<div class="empty-primary-msg">This image has not been indexed yet</div>
|
||||
<div class="empty-secondary-msg">
|
||||
Please try again in a few minutes.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="empty" ng-if="securityStatus == 'failed'">
|
||||
<div class="empty-primary-msg">This image could not be indexed</div>
|
||||
<div class="empty-secondary-msg">
|
||||
Our security scanner was unable to index this image.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<table class="co-table" ng-if="securityStatus == 'scanned'">
|
||||
<thead>
|
||||
<td>Package Name</td>
|
||||
<td>Package Version</td>
|
||||
<td>Package OS</td>
|
||||
<td>Number of vulnerabilities</td>
|
||||
</thead>
|
||||
|
||||
<tr ng-repeat="feature in securityFeatures | filter:options.packageFilter | orderBy:'Name'">
|
||||
<td>{{ feature.name }}</td>
|
||||
<td>{{ feature.version }}</td>
|
||||
<td>{{ feature.namespace }}</td>
|
||||
<td>{{ feature.vulnerabilities.length }}</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<div class="empty" ng-if="(securityFeatures | filter:options.packageFilter).length == 0"
|
||||
style="margin-top: 20px;">
|
||||
<div class="empty-primary-msg">No matching packages found</div>
|
||||
<div class="empty-secondary-msg" ng-if="options.packageFilter">
|
||||
Please adjust your filter above.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="image-feature-view" repository="repository" image="image" is-enabled="imagePackageCounter"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Reference in a new issue