updated search to nf-base geneontology/noctua-form-base@6877a2c #30

geneontology · Dec 9, 2020 · 78fff0c · 78fff0c
1 parent 8ba484f
commit 78fff0c
Show file tree

Hide file tree

Showing 81 changed files with 450 additions and 443,270 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -81,7 +81,7 @@
     "ngx-color-picker": "8.1.0",
     "ngx-contextmenu": "^5.1.1",
     "ngx-cookie-service": "2.2.0",
-    "noctua-form-base": "1.0.11",
+    "noctua-form-base": "1.1.1",
     "noctua-sparql-query-builder": "0.0.41",
     "node-bourbon": "^4.2.8",
     "perfect-scrollbar": "1.5.0",

diff --git a/src/@noctua.editor/inline-editor/editor-dropdown/editor-dropdown.component.ts b/src/@noctua.editor/inline-editor/editor-dropdown/editor-dropdown.component.ts
@@ -149,7 +149,7 @@ export class NoctuaEditorDropdownComponent implements OnInit, OnDestroy {
       }
       self.noctuaFormDialogService.openSearchDatabaseDialog(data, success);
     } else {
-      // const error = new AnnotonError('error', 1, "Please enter a gene product", meta)
+      // const error = new AnnotonError(ErrorLevel.error, ErrorType.general,  "Please enter a gene product", meta)
       //errors.push(error);
       // self.dialogService.openAnnotonErrorsDialog(ev, entity, errors)
     }

diff --git a/src/@noctua.editor/inline-reference/reference-dropdown/reference-dropdown.component.ts b/src/@noctua.editor/inline-reference/reference-dropdown/reference-dropdown.component.ts
@@ -9,7 +9,9 @@ import {
   AnnotonError,
   noctuaFormConfig,
   Article,
-  NoctuaLookupService
+  NoctuaLookupService,
+  ErrorLevel,
+  ErrorType
 } from 'noctua-form-base';
 
 import { referenceDropdownData } from './reference-dropdown.tokens';
@@ -58,7 +60,7 @@ export class NoctuaReferenceDropdownComponent implements OnInit, OnDestroy {
     let canSave = true;
 
     if (accession.trim() === '') {
-      const error = new AnnotonError('error', 1, `${db.name} accession is required`);
+      const error = new AnnotonError(ErrorLevel.error, ErrorType.general, `${db.name} accession is required`);
       errors.push(error);
       self.noctuaFormDialogService.openAnnotonErrorsDialog(errors);
       canSave = false;

diff --git a/src/@noctua.editor/inline-with/with-dropdown/with-dropdown.component.ts b/src/@noctua.editor/inline-with/with-dropdown/with-dropdown.component.ts
@@ -10,7 +10,9 @@ import {
   noctuaFormConfig,
   Article,
   NoctuaLookupService,
-  withfrom
+  withfrom,
+  ErrorLevel,
+  ErrorType
 } from 'noctua-form-base';
 
 import { withDropdownData } from './with-dropdown.tokens';
@@ -183,7 +185,7 @@ export class NoctuaWithDropdownComponent implements OnInit, OnDestroy {
     const withs = this.myForm.value.companies.map((project) => {
       return project.projects.map((item) => {
         if (!item.projectName.includes(':')) {
-          const error = new AnnotonError('error', 1, `${item.projectName} wrong format, Did you forget ':'`);
+          const error = new AnnotonError(ErrorLevel.error, ErrorType.general, `${item.projectName} wrong format, Did you forget ':'`);
           errors.push(error);
           canSave = false;
         }
@@ -194,7 +196,7 @@ export class NoctuaWithDropdownComponent implements OnInit, OnDestroy {
     console.log(withs);
 
     /*   if (accession.trim() === '') {
-        const error = new AnnotonError('error', 1, `${db.name} accession is required`);
+        const error = new AnnotonError(ErrorLevel.error, ErrorType.general,  `${db.name} accession is required`);
         errors.push(error);
         self.noctuaFormDialogService.openAnnotonErrorsDialog(errors);
         canSave = false;

diff --git a/src/@noctua.search/components/art-basket/art-basket.component.html b/src/@noctua.search/components/art-basket/art-basket.component.html
@@ -16,7 +16,7 @@
       Log in to Continue
     </div>
     <div *ngFor="let cam of cams" id="{{'noc-basket-'+cam.displayId}}" (click)="selectItem(cam)" class="noc-group-row"
-      [ngClass]="{'noc-selected': cam.id===camsService.selectedCamUuid}" fxLayout="column"
+      [ngClass]="{'noc-selected': cam.id===camsService.currentMatch?.modelId}" fxLayout="column"
       fxLayoutAlign="start stretch">
       <div *ngIf="cam.modified" class="noc-modified-header w-100-p" fxLayout="row" fxLayoutAlign="start center">
         <div class="noc-title">Modified Model:
@@ -101,4 +101,4 @@
       </button>
     </ng-container>
   </div>
-</div>
+</div>
diff --git a/src/@noctua.search/components/art-basket/art-basket.component.scss b/src/@noctua.search/components/art-basket/art-basket.component.scss
@@ -12,11 +12,11 @@ $accent: map-get($theme, accent);
 
 
   .noc-drawer {
-    @include deep-width(450px);
+    @include deep-width(380px);
 
     .noc-drawer-header {
       padding: 0;
-      @include deep-height(240px);
+      @include deep-height(280px);
       background-color: #FFF;
       @include mat-elevation(2);
       z-index: 1000;
@@ -37,7 +37,7 @@ $accent: map-get($theme, accent);
 
     .noc-drawer-body {
       padding: 24px 8 100px 0;
-      min-height: calc(100% - 290px);
+      min-height: calc(100% - 330px);
     }
   }
 

diff --git a/src/@noctua.search/components/art-basket/art-basket.component.ts b/src/@noctua.search/components/art-basket/art-basket.component.ts
@@ -134,8 +134,15 @@ export class ArtBasketComponent implements OnInit, OnDestroy {
   }
 
   resetAll() {
-    this.camsService.loadCams();
-    this.camsService.reviewChanges();
+    const self = this;
+
+    self.camsService.resetModels().subscribe((cams) => {
+      if (cams) {
+        self.camsService.loadCams();
+        self.noctuaReviewSearchService.onReplaceChanged.next(true);
+      }
+    });
+    self.camsService.reviewChanges();
   }
 
   reviewChanges() {
@@ -155,7 +162,7 @@ export class ArtBasketComponent implements OnInit, OnDestroy {
         if (element) {
           element.scrollTop = 0;
         }
-        self.noctuaReviewSearchService.bulkEdit().pipe(takeUntil(this._unsubscribeAll))
+        self.noctuaReviewSearchService.bulkEdit(true).pipe(takeUntil(this._unsubscribeAll))
           .subscribe(cams => {
             if (!cams) {
               return;
@@ -174,6 +181,8 @@ export class ArtBasketComponent implements OnInit, OnDestroy {
       }
     };
 
+
+
     const options = {
       cancelLabel: 'Go Back',
       confirmLabel: 'Submit'

diff --git a/src/@noctua.search/components/review-form/review-form.component.html b/src/@noctua.search/components/review-form/review-form.component.html
@@ -20,9 +20,9 @@
         </mat-radio-button>
       </mat-radio-group>
     </div> -->
-    <div class="noc-annoton-group-row mb-4 w-100-p" fxLayout="row" fxLayoutAlign="start stretch">
+    <div class="noc-annoton-group-row mb-4 w-100-p" fxLayout="column" fxLayoutAlign="start stretch">
       <mat-form-field *ngIf="selectedCategoryName === ArtReplaceCategory.term" appearance="outline"
-        class="noc-sm noc-review-input mr-8">
+        class="noc-sm noc-review-input">
         <mat-label>Find What <strong>(Ontology Term)</strong></mat-label>
         <textarea type="text" matInput formControlName="findWhat" [matAutocomplete]="termFindAuto" rows="2"></textarea>
         <mat-autocomplete #termFindAuto="matAutocomplete" (optionSelected)="findSelected($event.option.value)"
@@ -46,32 +46,15 @@
         <textarea type="text" matInput formControlName="findWhat" [matAutocomplete]="gpAuto" rows="2"></textarea>
       </mat-form-field>
       <mat-form-field *ngIf="selectedCategoryName === ArtReplaceCategory.reference" appearance="outline"
-        class="noc-sm mr-8  noc-review-input">
+        class="noc-sm  noc-review-input">
         <mat-label>Find What <strong>(Reference)</strong></mat-label>
         <textarea type="text" matInput formControlName="findWhat"></textarea>
       </mat-form-field>
-      <div class="noc-review-actions" fxLayout="row" fxLayoutAlign="start center" fxFlex="">
-        <div *ngIf="noctuaReviewSearchService.matchedCount===0" class="noc-matched-count">
-          No Results
-        </div>
-        <div *ngIf="noctuaReviewSearchService.matchedCount>0" class="noc-matched-count">
-          {{noctuaReviewSearchService.matchedCountCursor +1}} of {{noctuaReviewSearchService.matchedCount}}
-        </div>
-        <span fxFlex></span>
-        <div [ngClass]="{'noc-disabled':noctuaReviewSearchService.matchedCount===0}">
-          <button mat-icon-button (click)="findPrevious()" class="" color="primary">
-            <fa-icon [icon]="['fas', 'arrow-up']"></fa-icon>
-          </button>
-          <button mat-icon-button (click)="findNext()" class="" color="primary">
-            <fa-icon [icon]="['fas', 'arrow-down']"></fa-icon>
-          </button>
-        </div>
-      </div>
     </div>
     <div [ngClass]="{'noc-disabled':!displayReplaceForm.replaceSection}" class="noc-annoton-group-row w-100-p"
-      fxLayout="row" fxLayoutAlign="start center">
+      fxLayout="column" fxLayoutAlign="start stretch">
       <mat-form-field *ngIf="selectedCategoryName === ArtReplaceCategory.term" appearance="outline"
-        class="noc-sm mr-8 noc-review-input">
+        class="noc-sm noc-review-input">
         <mat-label>Replace With <strong>(Ontology Term)</strong></mat-label>
         <textarea type="text" matInput formControlName="replaceWith" [matAutocomplete]="termReplaceAuto"></textarea>
         <mat-autocomplete #termReplaceAuto="matAutocomplete" [displayWith]="termDisplayFn"
@@ -91,21 +74,50 @@
         </mat-autocomplete>
       </mat-form-field>
       <mat-form-field *ngIf="selectedCategoryName === ArtReplaceCategory.gp" appearance="outline"
-        class="noc-sm mr-8  noc-review-input">
+        class="noc-sm  noc-review-input">
         <mat-label>Replace With <strong>(Gene Product)</strong></mat-label>
         <textarea type="text" matInput formControlName="replaceWith" [matAutocomplete]="gpAuto"></textarea>
       </mat-form-field>
       <mat-form-field *ngIf="selectedCategoryName === ArtReplaceCategory.reference" appearance="outline"
-        class="noc-sm mr-8  noc-review-input">
+        class="noc-sm  noc-review-input">
         <mat-label>Replace With <strong>(Reference)</strong></mat-label>
         <textarea type="text" matInput formControlName="replaceWith"></textarea>
       </mat-form-field>
+    </div>
+    <div class="noc-annoton-group-row mt-8 w-100-p" fxLayout="row" fxLayoutAlign="start center">
+      <div class="noc-review-actions" fxLayout="row" fxLayoutAlign="start center" fxFlex="">
+        <span fxFlex></span>
+        <div *ngIf="noctuaReviewSearchService.matchedCount===0" class="noc-matched-count">
+          No Results
+        </div>
+        <div *ngIf="noctuaReviewSearchService.matchedCount>0" class="noc-matched-count mr-8">
+          {{noctuaReviewSearchService.matchedCountCursor +1}} of {{noctuaReviewSearchService.matchedCount}}
+        </div>
+
+        <div [ngClass]="{'noc-disabled':noctuaReviewSearchService.matchedCount===0}" class="mr-8">
+          <button mat-icon-button (click)="goto('first')" class="noc-icon-button"
+            [ngClass]="{'noc-disabled': noctuaReviewSearchService.matchedCountCursor===0}" color="primary">
+            <fa-icon [icon]="['fas', 'angle-double-left']"></fa-icon>
+          </button>
+          <button mat-icon-button (click)="findPrevious()" class="noc-icon-button" color="primary">
+            <fa-icon [icon]="['fas', 'angle-left']"></fa-icon>
+          </button>
+          <button mat-icon-button (click)="findNext()" class="noc-icon-button  noc-rotate-90" color="primary">
+            <fa-icon [icon]="['fas', 'angle-right']"></fa-icon>
+          </button>
+          <button mat-icon-button (click)="goto('last')" class="noc-icon-button"
+            [ngClass]="{'noc-disabled': noctuaReviewSearchService.matchedCountCursor===noctuaReviewSearchService.matchedCount-1}"
+            color="primary">
+            <fa-icon [icon]="['fas', 'angle-double-right']"></fa-icon>
+          </button>
+        </div>
+      </div>
       <div [ngClass]="{'noc-disabled':!displayReplaceForm.replaceActions}" class="noc-review-actions" fxLayout="row"
-        fxLayoutAlign="space-between center">
-        <button (click)="replace()" mat-raised-button color="warn" class="noc-sm p-0 mr-4 noc-review-btn" fxFlex="50">
+        fxLayoutAlign="start center">
+        <button (click)="replace()" mat-raised-button color="warn" class="noc-sm mr-4 noc-review-btn">
           Replace
         </button>
-        <button (click)="replaceAll()" mat-raised-button color="warn" class="noc-sm p-0 noc-review-btn" fxFlex="50">
+        <button (click)="replaceAll()" mat-raised-button color="warn" class="noc-sm noc-review-btn">
           Replace All
         </button>
       </div>
@@ -125,4 +137,4 @@
       </div>
     </div>
   </mat-option>
-</mat-autocomplete>
+</mat-autocomplete>
diff --git a/src/@noctua.search/components/review-form/review-form.component.scss b/src/@noctua.search/components/review-form/review-form.component.scss
@@ -1,6 +1,9 @@
 @import "src/@noctua/scss/noctua";
 @import "src/@noctua.common/scss/noctua.common";
 
+$primary: map-get($theme, primary);
+
+
 :host {
   padding: 0px;
   width: 100%;
@@ -23,9 +26,7 @@
     @include deep-height(100%);
     background-color: #FFF;
 
-    .noc-review-input {
-      @include deep-width(240px);
-    }
+
   }
 
   .noc-cams-results {
@@ -81,7 +82,6 @@
   }
 
   .noc-review-actions {
-    @include deep-width(180px);
 
     .noc-matched-count {
 
@@ -91,12 +91,25 @@
       align-items: center;
       padding: 0 8px;
       height: 100%;
-      font-size: 10
+      font-size: 12px;
+    }
+
+    .noc-icon-button {
+      @include deep-width(30px);
+      @include deep-height(30px);
+      line-height: 28px;
+      font-size: 18px;
+      //border: map-get($accent, default) solid 1px;
+      //border-radius: 0 !important;
+
+
     }
 
     .noc-review-btn {
-      height: 35px;
-      width: 35px;
+      padding: 0 8px;
+      height: 30px;
+      line-height: 28px;
+      font-size: 12px;
     }
 
     .noc-disabled {}

diff --git a/src/@noctua.search/components/review-form/review-form.component.ts b/src/@noctua.search/components/review-form/review-form.component.ts
@@ -155,13 +155,19 @@ export class ReviewFormComponent implements OnInit, OnDestroy {
   }
 
   replace() {
+    const self = this;
     const value = this.searchForm.value;
     const replaceWith = value.replaceWith;
 
-    this.noctuaReviewSearchService.replace(replaceWith);
+    this.noctuaReviewSearchService.replace(replaceWith).subscribe((cams) => {
+      if (cams) {
+        self.noctuaReviewSearchService.onReplaceChanged.next(true);
+      }
+    });
   }
 
   replaceAll() {
+    const self = this;
     const value = this.searchForm.value;
     const replaceWith = value.replaceWith;
     const groupedEntities = groupBy(
@@ -171,7 +177,11 @@ export class ReviewFormComponent implements OnInit, OnDestroy {
     const occurrences = this.noctuaReviewSearchService.matchedCount;
     const success = (replace) => {
       if (replace) {
-        this.noctuaReviewSearchService.replaceAll(replaceWith);
+        this.noctuaReviewSearchService.replaceAll(replaceWith).subscribe((cams) => {
+          if (cams) {
+            self.noctuaReviewSearchService.onReplaceChanged.next(true);
+          }
+        });
       }
     };
 
@@ -188,6 +198,10 @@ export class ReviewFormComponent implements OnInit, OnDestroy {
     this.noctuaReviewSearchService.findPrevious();
   }
 
+  goto(step: 'first' | 'last') {
+    this.noctuaReviewSearchService.goto(step);
+  }
+
   findSelected(value) {
     const closures = this.getClosure(value.rootTypes);