Merge pull request #941 from griffithlab/tag-input-multi--all-base-field

basic form fields now work with civic forms architecture
griffithlab · Dec 1, 2023 · fb9b4ca · fb9b4ca
2 parents 0992e0f + 6c11c15
commit fb9b4ca
Show file tree

Hide file tree

Showing 100 changed files with 2,097 additions and 1,485 deletions.
diff --git a/client/package.json b/client/package.json
@@ -35,8 +35,8 @@
     "@apollo/client": "^3.7.17",
     "@ngneat/until-destroy": "^9.1.2",
     "@ngrx/component": "^16.1.0",
-    "@ngx-formly/core": "^6.1.8",
-    "@ngx-formly/ng-zorro-antd": "^6.1.8",
+    "@ngx-formly/core": "^6.2.2",
+    "@ngx-formly/ng-zorro-antd": "^6.2.2",
     "apollo-angular": "^5.0.0",
     "ng-zorro-antd": "^16.1.0",
     "ngx-cookie-service": "^16.0.0",
@@ -79,4 +79,4 @@
       "error-stack-parser": "2.0.6"
     }
   }
-}
+}
diff --git a/client/src/app/components/layout/viewer-button/viewer-button.component.ts b/client/src/app/components/layout/viewer-button/viewer-button.component.ts
@@ -51,9 +51,6 @@ export class CvcViewerButtonComponent implements OnInit {
         )
     }
     this.addVariantModalVisible$ = new BehaviorSubject<boolean>(false)
-    this.addVariantModalVisible$
-      .pipe(tag('addVariantModalVisible$'))
-      .subscribe()
   }
 
   ngOnInit(): void {

diff --git a/client/src/app/core/utilities/get-entity-color.ts b/client/src/app/core/utilities/get-entity-color.ts
@@ -8,10 +8,11 @@ export const EntityColors = new Map<string, string>([
   ['Event', '#1db8a9'],
   ['EvidenceItem', '#2a63b6'],
   ['Gene', '#07aff0'],
-  ['Therapy', '#ac3996'],
   ['MolecularProfile', '#33b358'],
+  ['NccnGuideline', '#49566D'],
   ['Phenotype', '#1db8a9'],
   ['Source', '#f9ba45'],
+  ['Therapy', '#ac3996'],
   ['Variant', '#74d34c'],
   ['VariantGroup', '#74d34c'],
   ['VariantType', '#74d34c'],

diff --git a/client/src/app/forms/components/entity-tag/entity-tag.component.html b/client/src/app/forms/components/entity-tag/entity-tag.component.html
@@ -26,9 +26,11 @@
   <nz-tag
     [nzMode]="'closeable'"
     (nzOnClose)="cvcOnClose.next($event)">
-    <span *ngIf="entity && entity.tooltip; else noTooltip"
-      nz-tooltip [nzTooltipTitle]="entity.tooltip">
-        <ng-template [ngTemplateOutlet]="tagContent"> </ng-template>
+    <span
+      *ngIf="entity && entity.tooltip; else noTooltip"
+      nz-tooltip
+      [nzTooltipTitle]="entity.tooltip">
+      <ng-template [ngTemplateOutlet]="tagContent"> </ng-template>
     </span>
   </nz-tag>
 </span>
@@ -39,9 +41,11 @@
 <span
   *ngIf="cvcContext === 'multi-select-item'"
   class="multi-select-item">
-  <span *ngIf="entity && entity.tooltip; else noTooltip"
-    nz-tooltip [nzTooltipTitle]="entity.tooltip">
-      <ng-template [ngTemplateOutlet]="tagContent"> </ng-template>
+  <span
+    *ngIf="entity && entity.tooltip; else noTooltip"
+    nz-tooltip
+    [nzTooltipTitle]="entity.tooltip">
+    <ng-template [ngTemplateOutlet]="tagContent"> </ng-template>
   </span>
 </span>
 
@@ -55,7 +59,9 @@
 </ng-template>
 
 <ng-template #popoverContent>
-  <cvc-entity-tag-popover *ngIf="this.popoverInput" [entity]="this.popoverInput"></cvc-entity-tag-popover>
+  <cvc-entity-tag-popover
+    *ngIf="this.popoverInput"
+    [entity]="this.popoverInput"></cvc-entity-tag-popover>
 </ng-template>
 
 <!-- tag contents, just the tag icon and label, used by the context templates above-->
@@ -71,7 +77,7 @@
     </a>
     <ng-template #tagLabel>
       <span
-        *ngIf="typename; else noIcon"
+        *ngIf="typename && cvcShowIcon; else noIcon"
         nz-icon
         [nzType]="typename | typenameToIcon"
         nzTheme="twotone"
@@ -88,12 +94,9 @@
     <ng-template [ngTemplateOutlet]="noIcon"></ng-template>
     CACHE-MISS ({{ cvcCacheId }})
   </ng-template>
+
   <ng-template #noIcon>
-    <span
-      nz-icon
-      class="tag-icon"
-      nzType="question-circle"
-      nzTheme="outline"></span>
+    <span class="tag-no-icon"></span>
   </ng-template>
 </ng-template>
 

diff --git a/client/src/app/forms/components/entity-tag/entity-tag.component.less b/client/src/app/forms/components/entity-tag/entity-tag.component.less
@@ -100,6 +100,10 @@ nz-tag {
       padding: 3px 2px 3px 4px;
       margin: -3px 0 -3px 0;
     }
+    .tag-no-icon {
+      display: inline-block;
+      width: 4px;
+    }
     .tag-label {
       display: inline-block;
       font-weight: normal;

diff --git a/client/src/app/forms/components/entity-tag/entity-tag.component.ts b/client/src/app/forms/components/entity-tag/entity-tag.component.ts
@@ -32,7 +32,10 @@ export type LinkableEntity = {
 export const isLinkableEntity: TypeGuard<any, LinkableEntity> = (
   entity: any
 ): entity is LinkableEntity =>
-  entity !== undefined && entity.__typename && entity.id && entity.name !== undefined
+  entity !== undefined &&
+  entity.__typename &&
+  entity.id &&
+  entity.name !== undefined
 
 export type CvcTagLabelMax =
   | '50px'
@@ -100,6 +103,7 @@ export class CvcEntityTagComponent implements OnChanges {
   @Input() cvcHasTooltip: boolean = false
   @Input() cvcFullWidth: boolean = false
   @Input() cvcShowPopover: boolean = false
+  @Input() cvcShowIcon: boolean = true
   @Input() cvcTruncateLabel?: CvcTagLabelMax
 
   @Output() cvcTagCheckedChange: EventEmitter<boolean> =
@@ -143,7 +147,7 @@ export class CvcEntityTagComponent implements OnChanges {
     }
     // get linkable entity
     let fragment = undefined
-    if(!this.cvcDisableLink) {
+    if (!this.cvcDisableLink) {
       fragment = {
         id: `${typename}:${id}`,
         fragment: gql`
@@ -154,7 +158,7 @@ export class CvcEntityTagComponent implements OnChanges {
           }
         `,
       }
-    } else if(this.cvcHasTooltip) {
+    } else if (this.cvcHasTooltip) {
       fragment = {
         id: `${typename}:${id}`,
         fragment: gql`
@@ -165,8 +169,7 @@ export class CvcEntityTagComponent implements OnChanges {
           }
         `,
       }
-    }
-    else{
+    } else {
       fragment = {
         id: `${typename}:${id}`,
         fragment: gql`
@@ -176,8 +179,6 @@ export class CvcEntityTagComponent implements OnChanges {
           }
         `,
       }
-
-
     }
     const entity = this.apollo.client.readFragment(fragment)
     if (!isLinkableEntity(entity)) {

diff --git a/client/src/app/forms/components/quick-add-form/quick-add-form.module.ts b/client/src/app/forms/components/quick-add-form/quick-add-form.module.ts