griffithlab · jmcmichael · Jul 13, 2022 · Jul 12, 2022 · Jul 12, 2022 · Jul 13, 2022
diff --git a/client/src/app/components/assertions/assertions-tag/assertion-tag.component.html b/client/src/app/components/assertions/assertions-tag/assertion-tag.component.html
@@ -5,13 +5,12 @@
 </ng-container>
 
 <ng-template #tag>
-  <nz-tag *ngIf="enablePopover; else noPopover"
+  <nz-tag [ngClass]="{ rejected: assertion.status === 'REJECTED', submitted: assertion.status === 'SUBMITTED', accepted: assertion.status === 'ACCEPTED' }"
     nz-popover
     [nzPopoverMouseEnterDelay]="0.5"
     [nzPopoverContent]="assertionPopover"
     nzPopoverPlacement="right"
-    nzPopoverTrigger="hover"
-    [nzColor]="assertion.status | colorNameForStatus">
+    [nzPopoverTrigger]="enablePopover ? 'hover' : null">
     <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
   </nz-tag>
 
@@ -20,16 +19,15 @@
   </ng-template>
 </ng-template>
 
-<ng-template #noPopover>
-  <nz-tag [nzColor]="assertion.status | colorNameForStatus">
-    <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
-  </nz-tag>
-</ng-template>
-
 <ng-template #unlinked>
   <ng-template [ngTemplateOutlet]="tag"></ng-template>
 </ng-template>
 
 <ng-template #tagContent>
-  <i nz-icon nzType="civic-assertion" nzTheme="twotone" nzTwotoneColor="#7243B5"></i> {{ assertion.name }}
+  <i nz-icon
+    nzType="civic-assertion"
+    nzTheme="twotone"
+    [nzTwotoneColor]="assertion.status === 'REJECTED' ? '#BBB' : '#7243B5'">
+  </i>
+  {{ assertion.name }}
 </ng-template>
diff --git a/client/src/app/components/assertions/assertions-tag/assertion-tag.component.less b/client/src/app/components/assertions/assertions-tag/assertion-tag.component.less
@@ -1,3 +1,5 @@
+@import 'themes/overrides/entity-tag-overrides.less';
+
 :host {
   display: inline-block;
 }
diff --git a/...t/src/app/components/clinical-trials/clinical-trial-tag/clinical-trial-tag.component.html b/...t/src/app/components/clinical-trials/clinical-trial-tag/clinical-trial-tag.component.html
@@ -5,12 +5,12 @@
 </ng-container>
 
 <ng-template #tag>
-  <nz-tag *ngIf="enablePopover; else noPopover"
+  <nz-tag
     nz-popover
     [nzPopoverMouseEnterDelay]="0.5"
     [nzPopoverContent]="clinicalTrialPopover"
     nzPopoverPlacement="right"
-    nzPopoverTrigger="hover">
+    [nzPopoverTrigger]="enablePopover ? 'hover' : null">
     <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
   </nz-tag>
 
@@ -19,12 +19,6 @@
   </ng-template>
 </ng-template>
 
-<ng-template #noPopover>
-  <nz-tag>
-    <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
-  </nz-tag>
-</ng-template>
-
 <ng-template #unlinked>
   <ng-template [ngTemplateOutlet]="tag"></ng-template>
 </ng-template>

diff --git a/client/src/app/components/comments/comment-tag/comment-tag.component.html b/client/src/app/components/comments/comment-tag/comment-tag.component.html
@@ -3,12 +3,12 @@
 </a>
 
 <ng-template #tag>
-  <nz-tag *ngIf="enablePopover; else noPopover"
+  <nz-tag
     nz-popover
     [nzPopoverMouseEnterDelay]="0.5"
     [nzPopoverContent]="commentPopover"
     nzPopoverPlacement="right"
-    nzPopoverTrigger="hover">
+    [nzPopoverTrigger]="enablePopover ? 'hover' : null">
     <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
   </nz-tag>
 

diff --git a/client/src/app/components/diseases/cvc-disease-tag/cvc-disease-tag.component.html b/client/src/app/components/diseases/cvc-disease-tag/cvc-disease-tag.component.html
@@ -5,14 +5,13 @@
 </ng-container>
 
 <ng-template #tag>
-  <nz-tag *ngIf="enablePopover; else noPopover"
-    nz-popover
+  <nz-tag nz-popover
     [nzPopoverMouseEnterDelay]="this.onCloseClicked ? 0 : 0.5"
     [nzPopoverContent]="diseasePopover"
     nzPopoverPlacement="right"
-    nzPopoverTrigger="hover"
-    [nzMode]="this.onCloseClicked ? 'closeable' : 'default'" (nzOnClose)="itemClosed($event)"
-    >
+    [nzPopoverTrigger]="enablePopover ? 'hover' : null"
+    [nzMode]="this.onCloseClicked ? 'closeable' : 'default'"
+    (nzOnClose)="itemClosed($event)">
     <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
   </nz-tag>
 
@@ -21,18 +20,15 @@
   </ng-template>
 </ng-template>
 
-<ng-template #noPopover>
-  <nz-tag [nzMode]="this.onCloseClicked ? 'closeable' : 'default'" (nzOnClose)="itemClosed($event)">
-    <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
-  </nz-tag>
-</ng-template>
-
 <ng-template #unlinked>
   <ng-template [ngTemplateOutlet]="tag"></ng-template>
 </ng-template>
 
 <ng-template #tagContent>
-  <i nz-icon nzType="civic-disease" nzTheme="twotone" nzTwotoneColor="#E62F76"></i>
+  <i nz-icon
+    nzType="civic-disease"
+    nzTheme="twotone"
+    nzTwotoneColor="#E62F76"></i>
   <ng-container *ngIf="truncateLongName; else fullName">
     {{ disease.name | truncate: 27 }}
   </ng-container>

diff --git a/client/src/app/components/drugs/cvc-drug-tag/cvc-drug-tag.component.html b/client/src/app/components/drugs/cvc-drug-tag/cvc-drug-tag.component.html
@@ -5,12 +5,12 @@
 </ng-container>
 
 <ng-template #tag>
-  <nz-tag *ngIf="enablePopover; else noPopover"
+  <nz-tag
     nz-popover
     [nzPopoverMouseEnterDelay]="this.onCloseClicked ? 0 : 0.5"
     [nzPopoverContent]="drugPopover"
     nzPopoverPlacement="right"
-    nzPopoverTrigger="hover"
+    [nzPopoverTrigger]="enablePopover ? 'hover' : null"
     [nzMode]="this.onCloseClicked ? 'closeable' : 'default'" (nzOnClose)="itemClosed($event)">
     <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
   </nz-tag>
@@ -20,12 +20,6 @@
   </ng-template>
 </ng-template>
 
-<ng-template #noPopover>
-  <nz-tag [nzMode]="this.onCloseClicked ? 'closeable' : 'default'" (nzOnClose)="itemClosed($event)">
-    <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
-  </nz-tag>
-</ng-template>
-
 <ng-template #unlinked>
   <ng-template [ngTemplateOutlet]="tag"></ng-template>
 </ng-template>

diff --git a/client/src/app/components/evidence/evidence-tag/evidence-tag.component.html b/client/src/app/components/evidence/evidence-tag/evidence-tag.component.html
@@ -5,12 +5,12 @@
 </ng-container>
 
 <ng-template #tag>
-  <nz-tag *ngIf="enablePopover; else noPopover" nz-popover
+  <nz-tag [ngClass]="{ rejected: evidence.status === 'REJECTED', submitted: evidence.status === 'SUBMITTED', accepted: evidence.status === 'ACCEPTED' }"
+    nz-popover
     [nzPopoverMouseEnterDelay]="0.5"
     [nzPopoverContent]="evidencePopover"
     nzPopoverPlacement="right"
-    nzPopoverTrigger="hover"
-    [nzColor]="evidence.status | colorNameForStatus">
+    [nzPopoverTrigger]="enablePopover ? 'hover' : null">
     <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
   </nz-tag>
   <ng-template #evidencePopover>
@@ -19,12 +19,6 @@
   </ng-template>
 </ng-template>
 
-<ng-template #noPopover>
-  <nz-tag [nzColor]="evidence.status | colorNameForStatus">
-    <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
-  </nz-tag>
-</ng-template>
-
 <ng-template #unlinked>
   <ng-template [ngTemplateOutlet]="tag"></ng-template>
 </ng-template>
@@ -33,5 +27,7 @@
   <i nz-icon
     nzType="civic-evidence"
     nzTheme="twotone"
-    nzTwotoneColor="#F68F37"></i> {{ evidence.name }}
+    [nzTwotoneColor]="evidence.status === 'REJECTED' ? '#BBB' : '#F68F37'">
+  </i>
+  {{ evidence.name }}
 </ng-template>
diff --git a/client/src/app/components/evidence/evidence-tag/evidence-tag.component.less b/client/src/app/components/evidence/evidence-tag/evidence-tag.component.less
@@ -1,3 +1,5 @@
+@import 'themes/overrides/entity-tag-overrides.less';
+
 :host {
   display: inline-block;
 }
diff --git a/client/src/app/components/flags/flag-tag/flag-tag.component.html b/client/src/app/components/flags/flag-tag/flag-tag.component.html
@@ -3,12 +3,12 @@
 </a>
 
 <ng-template #tag>
-  <nz-tag *ngIf="enablePopover; else noPopover"
+  <nz-tag
     nz-popover
     [nzPopoverMouseEnterDelay]="0.5"
     [nzPopoverContent]="flagPopover"
     nzPopoverPlacement="right"
-    nzPopoverTrigger="hover">
+    [nzPopoverTrigger]="enablePopover ? 'hover' : null">
     <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
   </nz-tag>
 
@@ -17,13 +17,7 @@
   </ng-template>
 </ng-template>
 
-<ng-template #noPopover>
-  <nz-tag>
-    <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
-  </nz-tag>
-</ng-template>
-
 <ng-template #tagContent>
   <i nz-icon nzType="civic-flag" nzTheme="twotone" nzTwotoneColor="#E24759"></i>
   {{ flag.name }}
-</ng-template>
+</ng-template>
diff --git a/client/src/app/components/genes/gene-tag/gene-tag.component.html b/client/src/app/components/genes/gene-tag/gene-tag.component.html
@@ -5,11 +5,11 @@
 </ng-container>
 
 <ng-template #tag>
-  <nz-tag *ngIf="enablePopover; else noPopover"
+  <nz-tag
     nz-popover
     [nzPopoverMouseEnterDelay]="this.onCloseClicked ? 0 : 0.5"
     [nzPopoverContent]="genePopover"
-    nzPopoverTrigger="hover"
+    [nzPopoverTrigger]="enablePopover ? 'hover' : null"
     [nzMode]="this.onCloseClicked ? 'closeable' : 'default'"
     (nzOnClose)="itemClosed($event)">
     <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
@@ -19,13 +19,6 @@
   </ng-template>
 </ng-template>
 
-<ng-template #noPopover>
-  <nz-tag [nzMode]="this.onCloseClicked ? 'closeable' : 'default'"
-    (nzOnClose)="itemClosed($event)">
-    <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
-  </nz-tag>
-</ng-template>
-
 <ng-template #unlinked>
   <ng-template [ngTemplateOutlet]="tag"></ng-template>
 </ng-template>

diff --git a/client/src/app/components/organizations/organization-tag/organization-tag.component.html b/client/src/app/components/organizations/organization-tag/organization-tag.component.html
@@ -5,27 +5,23 @@
 </ng-container>
 
 <ng-template #tag>
-  <nz-tag *ngIf="enablePopover; else noPopover"
-    nz-popover
+  <nz-tag nz-popover
     [nzPopoverContent]="orgPopover">
     <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
   </nz-tag>
   <ng-template #orgPopover>
-    <cvc-organization-popover *ngIf="enablePopover" [orgId]="org.id"></cvc-organization-popover>
+    <cvc-organization-popover *ngIf="enablePopover"
+      [orgId]="org.id"></cvc-organization-popover>
   </ng-template>
 </ng-template>
 
-<ng-template #noPopover>
-  <nz-tag>
-    <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
-  </nz-tag>
-</ng-template>
-
 <ng-template #unlinked>
   <ng-template [ngTemplateOutlet]="tag"></ng-template>
 </ng-template>
 
 <ng-template #tagContent>
   <i nz-icon
-    nzType="civic-organization" nzTheme="twotone" nzTwotoneColor="#58A0C4"></i> {{ org.name }}
+    nzType="civic-organization"
+    nzTheme="twotone"
+    nzTwotoneColor="#58A0C4"></i> {{ org.name }}
 </ng-template>
diff --git a/client/src/app/components/phenotypes/phenotype-tag/phenotype-tag.component.html b/client/src/app/components/phenotypes/phenotype-tag/phenotype-tag.component.html
@@ -5,12 +5,12 @@
 </ng-container>
 
 <ng-template #tag>
-  <nz-tag *ngIf="enablePopover; else noPopover"
+  <nz-tag
     nz-popover
     [nzPopoverMouseEnterDelay]="this.onCloseClicked ? 0 : 0.5"
     [nzPopoverContent]="phenotypePopover"
     nzPopoverPlacement="right"
-    nzPopoverTrigger="hover"
+    [nzPopoverTrigger]="enablePopover ? 'hover' : null"
     [nzMode]="this.onCloseClicked ? 'closeable' : 'default'" (nzOnClose)="itemClosed($event)"
     >
     <ng-template [ngTemplateOutlet]="tagContent"></ng-template>

diff --git a/client/src/app/components/revisions/revision-tag/revision-tag.component.html b/client/src/app/components/revisions/revision-tag/revision-tag.component.html
@@ -3,12 +3,12 @@
 </a>
 
 <ng-template #tag>
-  <nz-tag *ngIf="enablePopover; else noPopover"
+  <nz-tag
     nz-popover
     [nzPopoverMouseEnterDelay]="0.5"
     [nzPopoverContent]="revisionPopover"
     nzPopoverPlacement="right"
-    nzPopoverTrigger="hover">
+    [nzPopoverTrigger]="enablePopover ? 'hover' : null">
     <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
   </nz-tag>
 
@@ -17,13 +17,7 @@
   </ng-template>
 </ng-template>
 
-<ng-template #noPopover>
-  <nz-tag>
-    <ng-template [ngTemplateOutlet]="tagContent"></ng-template>
-  </nz-tag>
-</ng-template>
-
 <ng-template #tagContent>
   <i nz-icon nzType="civic-revision" nzTheme="twotone" nzTwotoneColor="#F0673A"></i>
   {{ revision.name }}
-</ng-template>
+</ng-template>
diff --git a/client/src/app/components/shared/contributor-stack/contributor-stack.component.html b/client/src/app/components/shared/contributor-stack/contributor-stack.component.html
@@ -1,15 +1,27 @@
 <ng-container *ngIf="sortedContributors && sortedContributors.length > 0; else noContributors">
-  <a *ngFor="let u of sortedContributors" routerLink="/users/{{u.user.id}}" class="avatar">
-    <nz-avatar [nzSize]="14" nz-popover [nzPopoverMouseEnterDelay]="0.5" [nzPopoverContent]="curatorPopover"
-      nzPopoverTrigger="hover" nzPopoverPlacement="bottomRight" nzIcon="user" [nzSrc]="u.user.profileImagePath"
+  <a *ngFor="let u of sortedContributors"
+    routerLink="/users/{{u.user.id}}"
+    class="avatar">
+    <nz-avatar [nzSize]="14"
+      nz-popover
+      [nzPopoverMouseEnterDelay]="0.5"
+      [nzPopoverContent]="curatorPopover"
+      nzPopoverTrigger="hover"
+      nzPopoverPlacement="bottomRight"
+      nzIcon="user"
+      [nzSrc]="u.user.profileImagePath"
       nzSize="small"></nz-avatar>
     <ng-template #curatorPopover>
       <cvc-user-popover [userId]="u.user.id">
         <ng-template #additionalMetadata>
-          <nz-descriptions nzBordered nzTitle="Activity" nzSize="small" [nzColumn]="1">
+          <nz-descriptions nzBordered
+            nzTitle="Activity"
+            nzSize="small"
+            [nzColumn]="1">
             <nz-descriptions-item nzTitle="Contributions">
               <ng-container *ngFor="let a of u.uniqueActions; last as isLast">
-                {{a.action | eventVerbiage: 'contributor-card' : a.count }}<ng-container *ngIf="! isLast">, </ng-container>
+                {{a.action | eventVerbiage: 'contributor-card' : a.count }}
+                <ng-container *ngIf="! isLast">, </ng-container>
               </ng-container>
             </nz-descriptions-item>
             <nz-descriptions-item nzTitle="Last Contribution">
@@ -23,4 +35,4 @@
 </ng-container>
 <ng-template #noContributors>
   None
-</ng-template>
+</ng-template>