show pr status

spaduret · Jul 21, 2021 · 29ae1d8 · 29ae1d8
1 parent 693a0cc
commit 29ae1d8
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 18 deletions.
diff --git a/src/app/components/pull-request-view/pull-request.component.html b/src/app/components/pull-request-view/pull-request.component.html
@@ -3,21 +3,23 @@
     <div class="data">
       <span class="self-url url" (click)="navigateTo(selfUrl)">
         <app-user class="user" *ngIf="showAuthorAvatar" [user]="pullRequest.author.user" [size]="14"></app-user>
-        <span class="title" [ngClass]="{'conflicts': hasConflicts, 'approved': approved}">{{pullRequest.title}}</span>
+        <span class="title" [ngClass]="{'conflicts': hasConflicts, 'approved': approved, 'needs-work': needsWork}">
+          {{pullRequest.title}}
+        </span>
       </span>
       <div class="status-bar">
         <span class="pr-status"
               [class.pr-can-be-merged]="approved"
-              [attr.title]="hasConflicts ? 'code conflicts' : approved ? 'approved' : ''"
-              [class.pr-approved]="approved"
-              [class.pr-has-conflicts]="hasConflicts">
-          {{pullRequest.state}}
+              [ngClass]="{'conflicts': hasConflicts, 'approved': approved, 'needs-work': needsWork}">
+          {{status}}
           <i *ngIf="hasConflicts" class="icon icon-warning"></i>
         </span>
 
         <span title="created date">{{pullRequest.createdDate | date}}</span>
 
-        <span class="to-ref url" (click)="navigateTo(pullRequest.fromRef.repository.links.self[0].href)">{{pullRequest.fromRef.repository.name}}</span>
+        <span class="to-ref url" (click)="navigateTo(pullRequest.fromRef.repository.links.self[0].href)">
+          {{pullRequest.fromRef.repository.name}}
+        </span>
 
         <span class="to-ref" title="destination branch">{{pullRequest.toRef.displayId}}</span>
 
@@ -27,7 +29,6 @@
         </span>
 
         <app-snooze-notification [id]="pullRequest.id"></app-snooze-notification>
-
       </div>
     </div>
     <div class="reviewers">

diff --git a/src/app/components/pull-request-view/pull-request.component.scss b/src/app/components/pull-request-view/pull-request.component.scss
@@ -51,8 +51,8 @@
           overflow: hidden;
           text-overflow: ellipsis;
 
-          &.conflicts {
-            color: rgb(255, 139, 0);
+          &.conflicts, &.needs-work {
+            color: $pr-needs-work-color;
           }
         }
       }
@@ -83,14 +83,14 @@
   border-radius: $pr-control-border-radius;
   font-weight: 700;
   margin-right: $pr-control-distance;
-}
 
-.pr-approved {
-  background-color: $pr-approved-color;
-}
+  &.approved {
+    background-color: $pr-approved-color;
+  }
 
-.pr-has-conflicts {
-  background-color: rgb(255, 139, 0);
+  &.conflicts, &.needs-work {
+    background-color: $pr-needs-work-color;
+  }
 }
 
 .comments {
@@ -104,7 +104,7 @@
 .to-ref {
   border: 1px solid $border-color;
   border-radius: $pr-control-border-radius;
-  color: orange;
+  color: #ffc682;
   background-color: $pr-background-color-hover;
   margin-right: $pr-control-distance;
 }
diff --git a/src/app/components/pull-request-view/pull-request.component.ts b/src/app/components/pull-request-view/pull-request.component.ts
@@ -1,5 +1,6 @@
 import {Component, Input, OnInit} from '@angular/core';
 import {PullRequest} from '../../models/models';
+import {PullRequestStatus} from '../../models/enums';
 
 @Component({
   selector: 'app-pull-request',
@@ -13,7 +14,9 @@ export class PullRequestComponent implements OnInit {
 
   selfUrl!: string;
   approved!: boolean;
+  needsWork!: boolean;
   hasConflicts!: boolean;
+  status!: string;
   commentsCount!: number;
 
   constructor() {
@@ -24,9 +27,15 @@ export class PullRequestComponent implements OnInit {
       this.selfUrl = this.pullRequest.links.self[0].href;
     }
 
-    this.approved = this.pullRequest.reviewers.some(r => r.approved);
+    this.needsWork = this.pullRequest.reviewers.some(r => r.status === PullRequestStatus.NeedsWork);
+    this.approved = !this.needsWork && this.pullRequest.reviewers.some(r => r.status === PullRequestStatus.Approved);
     this.hasConflicts = this.pullRequest.properties.mergeResult.outcome !== 'CLEAN'; // CONFLICTED
 
+    this.status = this.needsWork && 'NEEDS WORK'
+      || this.hasConflicts && 'HAS CONFLICTS'
+      || this.approved && 'APPROVED'
+      || 'OPEN';
+
     this.commentsCount = this.pullRequest.properties.commentCount || 0;
   }
 

diff --git a/src/variables.scss b/src/variables.scss
@@ -4,5 +4,5 @@ $role-title-color: #ffffffe0;
 $pr-control-distance: 5px;
 $pr-control-border-radius: 3px;
 $pr-approved-color: rgb(0, 135, 90);
-$pr-needs-work-color: rgb(255, 171, 0);
+$pr-needs-work-color: rgb(255, 139, 0);
 $pr-background-color-hover: #2D333B;