add konvoy in stable releases && remove build data in development branch

src/app/app.routing.ts

@@ -9,8 +9,8 @@ import { StableReleaseComponent } from "./stable-release/stable-release.componen
 
 const routes: Routes = [
   //routes without header and footer
-  { path: "", component: TableComponent },
-  { path: "stable-release", component: StableReleaseComponent },
+  { path: "development", component: TableComponent },
+  { path: "", component: StableReleaseComponent },
   { path: "workload-dashboard", component: WorkloadDashboardComponent },
   { path: "mongo-jiva", component: WorkloadsComponent },
   { path: "mongo-cstor", component: WorkloadsComponent },

src/app/services/ci-dashboard.service.ts

@@ -1,44 +1,38 @@
 import { Injectable } from "@angular/core";
 import { HttpClient } from "@angular/common/http";
 import { map } from "rxjs/operators";
-import { Meta,Title } from '@angular/platform-browser';
+import { Meta, Title } from '@angular/platform-browser';
 
 @Injectable()
 export class DashboardData {
 
     private apiurl: string;
     host: any;
-    constructor(private http: HttpClient, private meta:Meta,private titleService: Title) {
+    constructor(private http: HttpClient, private meta: Meta, private titleService: Title) {
         this.host = window.location.host;
         if ((this.host.toString().indexOf("localhost") + 1) && this.host.toString().indexOf(":")) {
-          this.apiurl = "http://localhost:3000";
-        } else if (this.host == "openebs.ci" || this.host == "wwww.openebs.ci" ) {
+            this.apiurl = "http://localhost:3000";
+        } else if (this.host == "openebs.ci" || this.host == "wwww.openebs.ci") {
             this.apiurl = "https://openebs.ci/api";
         } else {
-          this.apiurl = "https://staging.openebs.ci/api";
+            this.apiurl = "https://staging.openebs.ci/api";
         }
     }
-
-    getPacketv15Details() {
-        return this.http.get<any[]>(this.apiurl + "/packet/v15");
-    }
-
-    getPacketv14Details() {
-        return this.http.get<any[]>(this.apiurl + "/packet/v14");
-    }
-
-    getPacketv13Details() {
-        return this.http.get<any[]>(this.apiurl + "/packet/v13");
-    }
-    getKonvoyDetails() {
-        return this.http.get<any[]>(this.apiurl + "/konvoy");
-    }
-
-    getBuildDetails() {
-        return this.http.get<any[]>(this.apiurl + "/build");
-    }
-
-    getOpenshiftReleaseDetails() {
-        return this.http.get<any[]>(this.apiurl + "/openshift/release");
+    getEndPointData(platform) {
+        switch (platform) {
+            case "packet-ultimate":
+                return this.http.get<any[]>(this.apiurl + "/packet/ultimate");
+            case "packet-penultimate":
+                return this.http.get<any[]>(this.apiurl + "/packet/penultimate");
+            case "packet-antepenultimate":
+                return this.http.get<any[]>(this.apiurl + "/packet/antepenultimate");
+            case "konvoy":
+                return this.http.get<any[]>(this.apiurl + "/konvoy");
+            case "openshift":
+                return this.http.get<any[]>(this.apiurl + "/openshift/release");
+            default:
+                console.log('Unable To Find Platform');
+                break;
+        }
     }
 }

src/app/sidebar/sidebar.component.html

@@ -11,13 +11,13 @@
     <div class="collapse navbar-collapse" id="sidebar">
       <ul class="list-unstyled justify-content-center w-100">
         <li *ngIf="vendor == 'false'"
-          class="item cursor-pointer rounded-left py-md-4 py-sm-1 button text-center border-bottom" routerLink="/"
+          class="item cursor-pointer rounded-left py-md-4 py-sm-1 button text-center border-bottom" routerLink="/development"
           [routerLinkActiveOptions]="{ exact : true }" routerLinkActive="active-link">
           <div>
             <h5>Development Branch</h5>
           </div>
         </li>
-        <li *ngIf="vendor == 'false'" routerLink="/stable-release" [routerLinkActiveOptions]="{ exact : true }"
+        <li *ngIf="vendor == 'false'" routerLink="/" [routerLinkActiveOptions]="{ exact : true }"
           routerLinkActive="active-link"
           class="item cursor-pointer rounded-left py-md-4 py-sm-1 button text-center border-bottom">
           <div>

src/app/stable-release/stable-release.component.html

@@ -1,23 +1,47 @@
 <div class="container-fluid bg-white h-100">
   <div class="row">
-    <div class="col-md-12 heading-row text-white py-2 mb-2">
-      <h4>CI/E2E Summary of OpeneEBS Release Pipelines</h4>
+    <div class="col-md-12 text-white py-2 mb-2"
+      [ngClass]="currentPlatform == 'openshift' ? 'red-gradient': 'grey-gradient'">
+      <div class="row">
+        <div class="col-md-6">
+          <h4>CI/E2E Summary of OpeneEBS Release Pipelines</h4>
+        </div>
+      </div>
     </div>
   </div>
-  <div class="row">
+<div class="row">
+  <!-- <div class="col-md-5"></div> -->
+  <div class="col-md-7">
+    <div class="d-flex justify-content-center mb-2">
+      <div class="d-flex justify-content-between select-platform text-dark">
+        <div class="flex rounded shadow bg-white shadow-lg">
+          <div class="btn" [ngClass]="currentPlatform == 'openshift' ? 'btn-primary':'btn-disabled'"
+            (click)="checkoutPlatform('openshift')"><img src="/assets/images/cloud/openshift.png" alt="Platform-logo"
+              class="rounded-circle shadow" height="30px"><span class="mx-2">Openshift</span>
+          </div>
+          <div class="btn" [ngClass]="currentPlatform == 'konvoy' ? 'btn-primary' : 'btn-disabled'"
+            (click)="checkoutPlatform('konvoy')"><img src="/assets/images/cloud/konvoy.png" alt="Platform-logo"
+              class="rounded-circle shadow" height="30px"><span class="mx-2">Konvoy</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+  <div class="row" *ngIf='openshiftRelease.dashboard;else loadingSpinner'>
     <div class="col-md-7 table-pipelines-section">
       <table class="table" id="data">
         <thead>
           <th>Pipeline_ID</th>
           <th>Release_version</th>
-          <th class="text-center">Openshift 4.2</th>
+          <th class="text-center">{{getPlatformName(currentPlatform)}}</th>
         </thead>
         <tbody>
           <tr *ngFor="let pipeline of openshiftRelease.dashboard; let i = index"
             [ngClass]="{'row_color': i==rowCount()}" [attr.data-index]="i">
             <td><a href={{pipeline.web_url}} target="_blank">{{pipeline.id}}</a></td>
             <td>{{pipeline.release_tag}}</td>
-            <td class="text-center">
+            <td class="text-center cursor-pointer">
               <span [ngClass]="{'highlight': (status == 1 && i==rowCount())}" (click)="getJobDetails(pipeline,i)"
                 ngbTooltip="{{ pipelineTooltip(pipeline)}}" placement="right" class="pb-2">
                 <i *ngIf="pipelineTooltip(pipeline) == 'running';else donutSuccessFail"
@@ -47,9 +71,9 @@ <h4>CI/E2E Summary of OpeneEBS Release Pipelines</h4>
           <div class="col-md-12">
             <div class="d-flex justify-content-around">
               <div class="text-center">
-                <img src="/assets/images/cloud/openshift.png" alt="Openshift-logo" class="rounded-circle shadow"
-                  height="80px">
-                <h5 class="my-2">Openshift 4.2</h5>
+                <img src="/assets/images/cloud/{{currentPlatform}}.png" alt="Platform-logo"
+                  class="rounded-circle shadow" height="80px">
+                <h5 class="my-2">{{getPlatformName(currentPlatform)}}</h5>
               </div>
             </div>
           </div>
@@ -70,7 +94,8 @@ <h5 class="my-2">Openshift 4.2</h5>
           <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
             <div class="d-flex justify-content-around mt-2">
               <div>
-                <span class="font-weight-bold">Pipeliene #{{activePipeline.id}} </span><span>triggered {{activePipeline.triggered}} .</span>
+                <span class="font-weight-bold">Pipeliene #{{activePipeline.id}} </span><span>triggered
+                  {{activePipeline.triggered}} .</span>
               </div>
               <div>
                 <button type="button" class="rounded btn-outline-primary"> <i
@@ -155,7 +180,7 @@ <h5 class="my-2">Openshift 4.2</h5>
                           <div class="d-flex">
                             <div><i [ngClass]=statusIcon(job.status)></i></div>
                             <div class="job-link-line-right"></div>
-                            <div> <a href="https://gitlab.openebs.ci/openebs/e2e-openshift/-/jobs/{{job.id}}"
+                            <div> <a href="https://gitlab.openebs.ci/openebs/e2e-{{currentPlatform}}/-/jobs/{{job.id}}"
                                 target="_blank">
                                 <img src="/assets/images/workload-logo/gitlab-notxt.svg" alt="gitlab-logo"
                                   class="gitlab-job-image"></a>
@@ -169,11 +194,11 @@ <h5 class="my-2">Openshift 4.2</h5>
               </div>
             </div>
           </div>
-
         </div>
-
-
       </div>
     </div>
   </div>
+  <ng-template #loadingSpinner>
+    <app-lodding-spinners class="row"></app-lodding-spinners>
+  </ng-template>
 </div>

src/app/stable-release/stable-release.component.scss

@@ -1,5 +1,27 @@
-.heading-row{
-  background-image: radial-gradient( circle farthest-corner at 12.3% 19.3%,  rgba(85,88,218,1) 0%, rgba(95,209,249,1) 100.2% );
+.heading-row {
+  background-image: radial-gradient(
+    circle farthest-corner at 12.3% 19.3%,
+    rgba(85, 88, 218, 1) 0%,
+    rgba(95, 209, 249, 1) 100.2%
+  );
+}
+.red-gradient {
+  background-image: radial-gradient(
+    circle farthest-corner at 12.3% 19.3%,
+    rgba(85, 88, 218, 1) 0%,
+    rgba(219, 33, 46, 0.6) 100.2%
+  );
+
+  // background: linear-gradient(90deg, rgba(219,33,46,1) 5%, rgba(255,255,255,1) 78%);
+}
+.grey-gradient {
+  background-image: radial-gradient(
+    circle farthest-corner at 12.3% 19.3%,
+    rgba(85, 88, 218, 1) 0%,
+    rgba(49, 2, 112, 0.6) 100.2%
+  );
+
+  // background: linear-gradient(90deg, #310270 5%, rgba(255,255,255,1) 78%);
 }
 .highlight {
   border-bottom: 5px solid #654cf9;
@@ -21,8 +43,8 @@ ul {
 .font-size-14 {
   font-size: 14px;
 }
-.font-size-25{
-  font-size:25px;
+.font-size-25 {
+  font-size: 25px;
 }
 .job-link-line-left {
   margin: 0;
@@ -56,28 +78,28 @@ ul {
   height: 25px;
   top: -3px;
 }
-.stage-jobs-content{
-  border-left: 1px solid #dee2e6 ;
+.stage-jobs-content {
+  border-left: 1px solid #dee2e6;
 }
-.stage-jobs-content:hover{
-border-color: #62b9f3;
+.stage-jobs-content:hover {
+  border-color: #62b9f3;
 }
 .job-row:hover {
   .job-name {
     color: #007bff;
   }
-  .job-link-line-right{
+  .job-link-line-right {
     border-top-color: #62b9f3;
   }
-  .job-link-line-left{
+  .job-link-line-left {
     border-top-color: #62b9f3;
   }
   i {
     text-shadow: 1px 1px 60px;
     font-weight: 900;
   }
-  img{
-    box-shadow:0px 250px 15px -35px rgba(0,0,0,.25);
+  img {
+    box-shadow: 0px 250px 15px -35px rgba(0, 0, 0, 0.25);
   }
 }
 
@@ -93,11 +115,18 @@ border-color: #62b9f3;
   background-image: none;
   border-color: #dfe3e9;
 }
-.table-pipelines-section{
+.table-pipelines-section {
   height: 90vh;
   overflow-y: auto;
 }
-.jobs-content-section{
+.jobs-content-section {
   height: 65vh;
   overflow-y: auto;
+}
+.cursor-pointer{
+  cursor: pointer;
+}
+
+.table{
+  table-layout: auto;
 }