display validation messages (#785)

display validation messages dockstore/dockstore#2707
dockstore · Sep 13, 2019 · 8187a93 · 8187a93
1 parent 9a217f0
commit 8187a93
Show file tree

Hide file tree

Showing 8 changed files with 77 additions and 11 deletions.
diff --git a/src/app/entry/entry-file-tab/entry-file-tab.component.html b/src/app/entry/entry-file-tab/entry-file-tab.component.html
@@ -1,3 +1,12 @@
+<div *ngIf="version" class="p-3">
+  <mat-card *ngIf="validationMessage$ | async as validation" class="alert alert-warning">
+    <mat-icon>warning</mat-icon>
+    <span *ngFor="let item of validation | keyvalue">
+      <strong>{{ item.key }}</strong
+      >: {{ item.value }}
+    </span>
+  </mat-card>
+</div>
 <mat-tab-group mat-stretch-tabs (selectedTabChange)="matTabChange($event)">
   <mat-tab *ngFor="let fileType of fileTypes$ | async" label="{{ 'ToolFile.FileTypeEnum' | mapFriendlyValue: fileType }}">
     <ng-template matTabContent>

diff --git a/src/app/entry/entry-file-tab/entry-file-tab.component.ts b/src/app/entry/entry-file-tab/entry-file-tab.component.ts
@@ -1,9 +1,9 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
 import { MatSelectChange, MatTabChangeEvent } from '@angular/material';
 import { SafeUrl } from '@angular/platform-browser';
 import { Base } from 'app/shared/base';
 import { WorkflowQuery } from 'app/shared/state/workflow.query';
-import { ToolFile } from 'app/shared/swagger';
+import { ToolFile, WorkflowVersion } from 'app/shared/swagger';
 import { Observable } from 'rxjs';
 import { EntryFileTabQuery } from './state/entry-file-tab.query';
 import { EntryFileTabService } from './state/entry-file-tab.service';
@@ -25,6 +25,7 @@ import { EntryFileTabStore } from './state/entry-file-tab.store';
   providers: [EntryFileTabService, EntryFileTabStore, EntryFileTabQuery]
 })
 export class EntryFileTabComponent extends Base implements OnInit {
+  @Input() version: WorkflowVersion;
   selectedFile$: Observable<ToolFile>;
   published$: Observable<boolean>;
   downloadFilePath$: Observable<string>;
@@ -35,6 +36,7 @@ export class EntryFileTabComponent extends Base implements OnInit {
   fileContents$: Observable<string>;
   downloadButtonTooltip$: Observable<string>;
   loading$: Observable<boolean>;
+  validationMessage$: Observable<Object>;
   constructor(
     private workflowQuery: WorkflowQuery,
     private entryFileTabQuery: EntryFileTabQuery,
@@ -54,6 +56,7 @@ export class EntryFileTabComponent extends Base implements OnInit {
     this.fileTypes$ = this.entryFileTabQuery.fileTypes$;
     this.published$ = this.workflowQuery.workflowIsPublished$;
     this.loading$ = this.entryFileTabQuery.selectLoading();
+    this.validationMessage$ = this.entryFileTabQuery.validationMessage$;
     this.entryFileTabService.init();
   }
 

diff --git a/src/app/entry/entry-file-tab/state/entry-file-tab.query.ts b/src/app/entry/entry-file-tab/state/entry-file-tab.query.ts
@@ -13,6 +13,7 @@ export class EntryFileTabQuery extends Query<EntryFileTabState> {
   selectedFileType$: Observable<ToolFile.FileTypeEnum> = this.select(state => state.selectedFileType);
   selectedFile$: Observable<ToolFile> = this.select(state => state.selectedFile);
   fileContents$: Observable<string> = this.select(state => state.fileContents);
+  validationMessage$: Observable<Object> = this.select(state => state.validationMessage);
   fileTypes$: Observable<ToolFile.FileTypeEnum[]> = this.select(state => state.fileTypes);
   downloadFilePath$: Observable<string> = this.select(state => state.downloadFilePath);
   downloadButtonTooltip$: Observable<string> = this.selectedFile$.pipe(map((file: ToolFile) => (file ? file.path : null)));

diff --git a/src/app/entry/entry-file-tab/state/entry-file-tab.service.ts b/src/app/entry/entry-file-tab/state/entry-file-tab.service.ts
@@ -14,6 +14,7 @@ import { FileWrapper, GA4GHService, ToolDescriptor, ToolFile } from 'app/shared/
 import { takeUntil } from 'rxjs/operators';
 import { EntryFileTabQuery } from './entry-file-tab.query';
 import { EntryFileTabStore } from './entry-file-tab.store';
+import { Validation } from '../../../shared/swagger/model/validation';
 
 @Injectable()
 export class EntryFileTabService extends Base {
@@ -130,6 +131,35 @@ export class EntryFileTabService extends Base {
   public changeFile(file: ToolFile) {
     this.setSelectedFile(file);
     this.getFileContents();
+    this.getValidations();
+  }
+
+  private getValidations() {
+    const version = this.workflowQuery.getSnapshot().version;
+    const file = this.entryFileTabQuery.getSnapshot().selectedFile;
+    if (version && version.validations && file && file.file_type === ToolFile.FileTypeEnum.PRIMARYDESCRIPTOR) {
+      for (const validation of version.validations) {
+        if (validation.type === Validation.TypeEnum.DOCKSTORESERVICEYML) {
+          const validationObject = JSON.parse(validation.message);
+          if (validationObject && Object.keys(validationObject).length === 0 && validationObject.constructor === Object) {
+            this.entryFileTabStore.setState(state => {
+              return {
+                ...state,
+                validationMessage: null
+              };
+            });
+          } else {
+            this.entryFileTabStore.setState(state => {
+              return {
+                ...state,
+                validationMessage: validationObject
+              };
+            });
+          }
+          break;
+        }
+      }
+    }
   }
 
   /**
@@ -170,6 +200,7 @@ export class EntryFileTabService extends Base {
         fileContents: null
       };
     });
+    this.getValidations();
   }
 
   /**

diff --git a/src/app/entry/entry-file-tab/state/entry-file-tab.store.ts b/src/app/entry/entry-file-tab/state/entry-file-tab.store.ts
@@ -10,6 +10,7 @@ export interface EntryFileTabState {
   selectedFile: ToolFile;
   fileContents: string;
   downloadFilePath: string;
+  validationMessage: Object;
 }
 
 export function createInitialState(): EntryFileTabState {
@@ -20,7 +21,8 @@ export function createInitialState(): EntryFileTabState {
     files: null,
     selectedFile: null,
     fileContents: null,
-    downloadFilePath: null
+    downloadFilePath: null,
+    validationMessage: null
   };
 }
 

diff --git a/src/app/workflow/version-modal/version-modal.component.html b/src/app/workflow/version-modal/version-modal.component.html
@@ -54,7 +54,14 @@ <h4 mat-dialog-title>{{ isPublic || !canWrite ? 'View' : 'Edit' }} {{ (isService
               required
               [matTooltip]="tooltip.workflowPath"
               placeholder="e.g. CancerCollaboratory/dockstore-tool-liftover"
-              [readonly]="(isService$ | async) || isPublic || !canWrite || workflow?.mode === WorkflowType.ModeEnum.HOSTED"
+              [readonly]="
+                (isService$ | async) ||
+                isPublic ||
+                !canWrite ||
+                workflow?.mode === WorkflowType.ModeEnum.HOSTED ||
+                version.frozen ||
+                version.doiURL
+              "
             />
             <div *ngIf="isService$ | async" class="label-value">
               {{ version.workflow_path }}
@@ -93,7 +100,7 @@ <h4 mat-dialog-title>{{ isPublic || !canWrite ? 'View' : 'Edit' }} {{ (isService
                   title="Remove test parameter file"
                   type="button"
                   class="btn btn-default form-sm-button"
-                  *ngIf="!isPublic"
+                  *ngIf="!isPublic && !version.frozen"
                   (click)="removeTestParameterFile(i)"
                 >
                   <mat-icon>clear</mat-icon>
@@ -104,7 +111,7 @@ <h4 mat-dialog-title>{{ isPublic || !canWrite ? 'View' : 'Edit' }} {{ (isService
           <div
             class="col-sm-9 col-md-9 col-lg-9"
             [ngClass]="{ 'col-sm-offset-3': testParameterFilePaths.length > 0 }"
-            *ngIf="!isPublic && !(isService$ | async)"
+            *ngIf="!isPublic && !(isService$ | async) && !version.frozen"
           >
             <div class="input-group">
               <input
@@ -163,7 +170,13 @@ <h4 mat-dialog-title>{{ isPublic || !canWrite ? 'View' : 'Edit' }} {{ (isService
           <div class="col-sm-9 col-md-9 col-lg-9">
             <div>
               <label>
-                <input type="checkbox" name="checkbox" [(ngModel)]="version.hidden" matTooltip="Hide tag from public view." />
+                <input
+                  [disabled]="version.doiURL"
+                  type="checkbox"
+                  name="checkbox"
+                  [(ngModel)]="version.hidden"
+                  matTooltip="Hide tag from public view."
+                />
               </label>
             </div>
           </div>

diff --git a/src/app/workflow/view/view.component.ts b/src/app/workflow/view/view.component.ts
@@ -21,10 +21,9 @@ import { BioWorkflow } from 'app/shared/swagger/model/bioWorkflow';
 import { Service } from 'app/shared/swagger/model/service';
 import { Observable } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
-import { AlertService } from '../../shared/alert/state/alert.service';
 import { AlertQuery } from '../../shared/alert/state/alert.query';
+import { AlertService } from '../../shared/alert/state/alert.service';
 import { DateService } from '../../shared/date.service';
-import { ViewService } from './view.service';
 import { SessionQuery } from '../../shared/session/session.query';
 import { WorkflowQuery } from '../../shared/state/workflow.query';
 import { WorkflowService } from '../../shared/state/workflow.service';
@@ -34,6 +33,7 @@ import { Workflow } from '../../shared/swagger/model/workflow';
 import { View } from '../../shared/view';
 import { VersionModalComponent } from '../version-modal/version-modal.component';
 import { VersionModalService } from '../version-modal/version-modal.service';
+import { ViewService } from './view.service';
 
 @Component({
   selector: 'app-view-workflow',
@@ -71,14 +71,21 @@ export class ViewWorkflowComponent extends View implements OnInit {
 
   showVersionModal() {
     this.versionModalService.setVersion(this.version);
+    this.alertService.start('Getting test parameter files');
     this.workflowsService.getTestParameterFiles(this.workflowId, this.version.name).subscribe(
       items => {
         this.items = items;
         this.versionModalService.setTestParameterFiles(this.items);
         this.openVersionModal();
+        this.alertService.simpleSuccess();
       },
       error => {
-        this.openVersionModal();
+        // TODO: Figure out a better way to handle this
+        // If we were to open the modal without test parameter files and the user saves,
+        // the legit files that were already there would be wiped out
+        // This is why we're straight up not opening the modal if getting the test parameter files failed
+        // Need to figure out a way to allow the user to edit version properties without test parameter files
+        this.alertService.detailedError(error);
       }
     );
   }

diff --git a/src/app/workflow/workflow.component.html b/src/app/workflow/workflow.component.html
@@ -217,7 +217,7 @@ <h3>
             <ng-template matTabContent>
               <div *ngIf="entryType === EntryType.Service; else FilesTabBioWorkflow" class="p-3">
                 <div *ngIf="(extendedWorkflow$ | async)?.workflowVersions.length > 0; else noVersionsFilesTab">
-                  <app-entry-file-tab></app-entry-file-tab>
+                  <app-entry-file-tab [version]="selectedVersion"></app-entry-file-tab>
                 </div>
 
                 <ng-template #noVersionsFilesTab>