Sets one workflow spec as master status spec.

src/app/workflow-spec-card/workflow-spec-card.component.html

@@ -1,10 +1,21 @@
-<mat-card class="mat-elevation-z0" [id]="workflowSpec.id">
+<mat-card class="mat-elevation-z0 {{workflowSpec.is_status ? 'master-status' : ''}}" [id]="workflowSpec.id">
   <mat-card-header>
     <mat-card-title fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="10px">
       <h3>{{workflowSpec.display_name}}</h3>
       <div class="action-buttons">
         <ng-container *ngTemplateOutlet="actionButtons"></ng-container>
       </div>
+      <span fxFlex></span>
+      <ng-container>
+        <button (click)="makeMasterStatus()" *ngIf="!workflowSpec.is_status" mat-button color="accent">
+          <mat-icon>radio_button_unchecked</mat-icon>
+          Master status spec
+        </button>
+        <button *ngIf="workflowSpec.is_status" (click)="makeMasterStatus()" mat-button color="accent">
+          <mat-icon>radio_button_checked</mat-icon>
+          Master status spec
+        </button>
+      </ng-container>
     </mat-card-title>
   </mat-card-header>
   <mat-card-content>

src/app/workflow-spec-card/workflow-spec-card.component.scss

@@ -1,6 +1,12 @@
+@import "../../config";
+
 mat-card {
   margin-bottom: 1em;
-  border: 1px solid #CCCCCC;
+  border: 1px solid $brand-gray;
+
+  &.master-status {
+    border: 2px dashed $brand-accent;
+  }
 
   mat-card-title {
     h3 {

src/app/workflow-spec-card/workflow-spec-card.component.ts

@@ -1,6 +1,4 @@
-import {Component, Input, OnInit, TemplateRef} from '@angular/core';
+import {Component, EventEmitter, Input, OnInit, Output, TemplateRef} from '@angular/core';
-import {MatDialog} from '@angular/material/dialog';
-import {MatSnackBar} from '@angular/material/snack-bar';
 import {ApiService, WorkflowSpec} from 'sartography-workflow-lib';
 
 @Component({
@@ -11,15 +9,20 @@ import {ApiService, WorkflowSpec} from 'sartography-workflow-lib';
 export class WorkflowSpecCardComponent implements OnInit {
   @Input() workflowSpec: WorkflowSpec;
   @Input() actionButtons: TemplateRef<any>;
+  @Output() workflowUpdated: EventEmitter<WorkflowSpec> = new EventEmitter();
 
-  constructor() {
+  constructor(
+    private api: ApiService
+  ) {
   }
 
   ngOnInit(): void {
   }
 
-  openFileDialog() {
+  makeMasterStatus() {
-
+    this.workflowSpec.is_status = true;
-
+    this.api.updateWorkflowSpecification(this.workflowSpec.id, this.workflowSpec).subscribe(spec => {
+      this.workflowUpdated.emit(spec);
+    });
   }
 }

src/app/workflow-spec-list/workflow-spec-list.component.html

@@ -25,7 +25,10 @@
         </div>
       </div>
       <div *ngFor="let wfs of cat.workflow_specs" class="workflow-spec">
-        <app-workflow-spec-card [workflowSpec]="wfs" [actionButtons]="actionButtons">
+        <app-workflow-spec-card
+          [workflowSpec]="wfs"
+          [actionButtons]="actionButtons"
+          (workflowUpdated)="onWorkflowUpdated($event)">
         </app-workflow-spec-card>
         <ng-template #actionButtons>
           <div class="workflow-spec-actions">

src/app/workflow-spec-list/workflow-spec-list.component.ts

@@ -233,5 +233,23 @@ export class WorkflowSpecListComponent implements OnInit {
     this.snackBar.open(message, 'Ok', {duration: 3000});
   }
 
+  onWorkflowUpdated(spec: WorkflowSpec) {
+    if (spec.is_status) {
+      // Mark all other specs as not is_status
+      let numUpdated = this.workflowSpecs.length - 1;
+      this.workflowSpecs.forEach(wfs => {
+        if (wfs.id !== spec.id) {
+          wfs.is_status = false;
+          this.api.updateWorkflowSpecification(wfs.id, wfs).subscribe(() => {
+            numUpdated--;
+            if (numUpdated === 0) {
+              this._loadWorkflowSpecCategories();
+            }
+          });
+        }
+      });
+    }
+    this._loadWorkflowSpecCategories();
+  }
 }