Merge pull request #5371 from kofj/master

Build history
goharbor · Oct 24, 2018 · 04e9190 · 04e9190
2 parents 4e73921 + 735ae1b
commit 04e9190
Show file tree

Hide file tree

Showing 14 changed files with 551 additions and 294 deletions.
diff --git a/src/portal/lib/src/service/interface.ts b/src/portal/lib/src/service/interface.ts
@@ -382,3 +382,14 @@ export interface HelmChartSignature {
   signed: boolean;
   prov_file: string;
 }
+
+/**
+ * The manifest of image.
+ *
+ **
+ * interface Manifest
+ */
+export interface Manifest {
+  manifset: Object;
+  config: string;
+}
diff --git a/src/portal/lib/src/service/tag.service.ts b/src/portal/lib/src/service/tag.service.ts
@@ -9,7 +9,7 @@ import {
   HTTP_GET_OPTIONS
 } from "../utils";
 import { RequestQueryParams } from "./RequestQueryParams";
-import { Tag } from "./interface";
+import { Tag, Manifest } from "./interface";
 
 /**
  * For getting tag signatures.
@@ -90,6 +90,19 @@ export abstract class TagService {
     tagName: string,
     labelId: number
   ): Observable<any> | Promise<any> | any;
+
+  /**
+   * Get manifest of tag under the specified repository.
+   *
+   * @abstract
+   * returns {(Observable<Manifest> | Promise<Manifest> | Manifest)}
+   *
+   * @memberOf TagService
+   */
+  abstract getManifest(
+    repositoryName: string,
+    tag: string
+  ): Observable<Manifest> | Promise<Manifest> | Manifest;
 }
 
 /**
@@ -225,4 +238,19 @@ export class TagDefaultService extends TagService {
       .then(response => response.status)
       .catch(error => Promise.reject(error));
   }
+
+  public getManifest(
+    repositoryName: string,
+    tag: string
+  ): Observable<Manifest> | Promise<Manifest> | Manifest {
+    if (!repositoryName || !tag) {
+      return Promise.reject("Bad argument");
+    }
+    let url: string = `${this._baseUrl}/${repositoryName}/tags/${tag}/manifest`;
+    return this.http
+      .get(url, HTTP_GET_OPTIONS)
+      .toPromise()
+      .then(response => response.json() as Manifest)
+      .catch(error => Promise.reject(error));
+  }
 }
diff --git a/src/portal/lib/src/tag/index.ts b/src/portal/lib/src/tag/index.ts
@@ -1,11 +1,14 @@
-import { Type } from '@angular/core';
-import { TagComponent } from './tag.component';
-import { TagDetailComponent } from './tag-detail.component';
+import { Type } from "@angular/core";
+import { TagComponent } from "./tag.component";
+import { TagDetailComponent } from "./tag-detail.component";
+import { TagHistoryComponent } from "./tag-history.component";
 
-export * from './tag.component';
-export * from './tag-detail.component';
+export * from "./tag.component";
+export * from "./tag-detail.component";
+export * from "./tag-history.component";
 
 export const TAG_DIRECTIVES: Type<any>[] = [
   TagComponent,
-  TagDetailComponent
+  TagDetailComponent,
+  TagHistoryComponent
 ];
diff --git a/src/portal/lib/src/tag/tag-detail.component.html b/src/portal/lib/src/tag/tag-detail.component.html
@@ -20,7 +20,7 @@ <h2 class="custom-h2">{{repositoryId}}:{{tagDetails.name}}</h2>
                             <label class="detail-label">{{'TAG.ARCHITECTURE' | translate }}</label>
                             <div class="image-details" [title]="tagDetails.architecture">{{tagDetails.architecture}}</div>
                         </section>
-                        <section class="detail-row"> 
+                        <section class="detail-row">
                             <label class="detail-label">{{'TAG.OS' | translate }}</label>
                             <div class="image-details" [title]="tagDetails.os">{{tagDetails.os}}</div>
                         </section>
@@ -42,17 +42,29 @@ <h2 class="custom-h2">{{repositoryId}}:{{tagDetails.name}}</h2>
                 <div class="flex-block vulnerabilities-info">
                     <div class="second-column">
                         <div class="row-flex">
-                            <div class="icon-position"><clr-icon shape="error" size="24" class="is-error"></clr-icon></div> 
-                            <span class="detail-count">{{highCount}}</span> {{packageText(highCount) | translate}} {{haveText(highCount) | translate}} {{'VULNERABILITY.SEVERITY.HIGH' | translate }} {{suffixForHigh | translate }}</div>
+                            <div class="icon-position">
+                                <clr-icon shape="error" size="24" class="is-error"></clr-icon>
+                            </div>
+                            <span class="detail-count">{{highCount}}</span> {{packageText(highCount) | translate}} {{haveText(highCount) | translate}} {{'VULNERABILITY.SEVERITY.HIGH' | translate }} {{suffixForHigh | translate }}
+                        </div>
                         <div class="second-row row-flex">
-                            <div class="icon-position"><clr-icon shape="exclamation-triangle" size="24" class="tip-icon-medium"></clr-icon></div>
-                            <span class="detail-count">{{mediumCount}}</span> {{packageText(mediumCount) | translate}} {{haveText(mediumCount) | translate}} {{'VULNERABILITY.SEVERITY.MEDIUM' | translate }} {{suffixForMedium | translate }}</div>
+                            <div class="icon-position">
+                                <clr-icon shape="exclamation-triangle" size="24" class="tip-icon-medium"></clr-icon>
+                            </div>
+                            <span class="detail-count">{{mediumCount}}</span> {{packageText(mediumCount) | translate}} {{haveText(mediumCount) | translate}} {{'VULNERABILITY.SEVERITY.MEDIUM' | translate }} {{suffixForMedium | translate }}
+                        </div>
                         <div class="second-row row-flex">
-                            <div class="icon-position"><clr-icon shape="play" size="22" class="tip-icon-low rotate-90"></clr-icon></div>
-                            <span class="detail-count">{{lowCount}}</span> {{packageText(lowCount) | translate}} {{haveText(lowCount) | translate}} {{'VULNERABILITY.SEVERITY.LOW' | translate }} {{suffixForLow | translate }}</div>
+                            <div class="icon-position">
+                                <clr-icon shape="play" size="22" class="tip-icon-low rotate-90"></clr-icon>
+                            </div>
+                            <span class="detail-count">{{lowCount}}</span> {{packageText(lowCount) | translate}} {{haveText(lowCount) | translate}} {{'VULNERABILITY.SEVERITY.LOW' | translate }} {{suffixForLow | translate }}
+                        </div>
                         <div class="second-row row-flex">
-                            <div class="icon-position"><clr-icon shape="help" size="20"></clr-icon></div>
-                            <span class="detail-count">{{unknownCount}}</span> {{packageText(unknownCount) | translate}} {{haveText(unknownCount) | translate}} {{'VULNERABILITY.SEVERITY.UNKNOWN' | translate }} {{suffixForUnknown | translate }}</div>
+                            <div class="icon-position">
+                                <clr-icon shape="help" size="20"></clr-icon>
+                            </div>
+                            <span class="detail-count">{{unknownCount}}</span> {{packageText(unknownCount) | translate}} {{haveText(unknownCount) | translate}} {{'VULNERABILITY.SEVERITY.UNKNOWN' | translate }} {{suffixForUnknown | translate }}
+                        </div>
                     </div>
                 </div>
 
@@ -67,12 +79,23 @@ <h2 class="custom-h2">{{repositoryId}}:{{tagDetails.name}}</h2>
             </div>
         </div>
     </section>
-    <section class="detail-section">
+    <ul id="configTabs" class="nav" role="tablist">
+        <li *ngIf="withClair" role="presentation" class="nav-item">
+            <button id="tag-vulnerability" class="btn btn-link nav-link" aria-controls="vulnerability" [class.active]='isCurrentTabLink("tag-vulnerability")' type="button" (click)='tabLinkClick("tag-vulnerability")'>{{'REPOSITORY.VULNERABILITY' | translate}}</button>
+        </li>
+        <li role="presentation" class="nav-item">
+            <button id="tag-history" class="btn btn-link nav-link" aria-controls="history" [class.active]='isCurrentTabLink("tag-history")' type="button" (click)='tabLinkClick("tag-history")'>{{ 'REPOSITORY.BUILD_HISTORY' | translate }}</button>
+        </li>
+    </ul>
+    <section class="detail-section" id="vulnerability" role="tabpanel" aria-labelledby="tag-vulnerability" [hidden]='!isCurrentTabContent("vulnerability")'>
         <div class="vulnerability-block">
             <hbr-vulnerabilities-grid [repositoryId]="repositoryId" [tagId]="tagId" [withAdminRole]="withAdminRole"></hbr-vulnerabilities-grid>
         </div>
         <div>
             <ng-content></ng-content>
         </div>
     </section>
+    <section class="detail-section" id="history" role="tabpanel" aria-labelledby="tag-history" [hidden]='!isCurrentTabContent("history")'>
+        <hbr-tag-history [repositoryId]="repositoryId" [tagId]="tagId"></hbr-tag-history>
+    </section>
 </div>