WS-755: add Fail QA button to request status page

apps/web/src/app/workspaces/components/capability-request/capability-request.component.html

@@ -45,23 +45,49 @@
         </div>
         <br/>
         <div id="qa-container" class="col-5">
+
           <div class="d-flex justify-content-left py-3" *ngIf="capability !== undefined
           && capabilityRequest.current_execution
           && capabilityRequest.current_execution.state
           && capabilityRequest.current_execution.state == 'Awaiting QA'">
             <span id="qa-label">QA Processing: </span>
-            <button
-              id="set-qa-pass"
-              type="button"
-              class="btn btn-success"
-              (click)="passQa(capabilityExecution.current_workflow_request_id)"
-
-            >
-              <span class="fas fa-image"></span>
-              <span class="p1-2">Pass QA</span>
-            </button>
+
+            <div class="btn-group">
+
+              <div id="pass-button">
+
+              <button
+                id="set-qa-pass"
+                type="button"
+                class="btn btn-success btn-sm"
+                style="margin-right:10px"
+                (click)="passQa(capabilityExecution.current_workflow_request_id)"
+
+              >
+                <span class="fas fa-image"></span>
+                <span class="p1-2">Pass QA</span>
+              </button>
+              </div>
+
+              <div id="fail-button">
+                <button
+                  id="set-qa-fail"
+                  type="button"
+                  class="btn btn-secondary btn-sm"
+                  (click)="failQa(capabilityExecution.current_workflow_request_id)"
+                >
+                  <span class="fas fa-image"></span>
+                  <span class="p1-2">Fail QA</span>
+                </button>
+              </div>
+
+            </div>
+
           </div>
+
+
         </div>
+
       </div>
 
       <div id="parameters-files-container" class="col-7">

apps/web/src/app/workspaces/components/capability-request/capability-request.component.ts

@@ -105,7 +105,7 @@ export class CapabilityRequestComponent implements OnInit, OnDestroy {
   public passQa(requestId: string) {
     const addRestCallObservable = {
       next: (response) => {
-        console.log(">>> GOT RESPONSE:'" + response + "'");
+        console.log(">>> QA Pass response:'" + response + "'");
       },
       error: (error) => console.error("Error when trying to pass QA on request " + requestId + ": " + error),
     };
@@ -113,6 +113,25 @@ export class CapabilityRequestComponent implements OnInit, OnDestroy {
     return this.capabilityRequestService.sendQaPassRequest(parseInt(requestId)).subscribe(addRestCallObservable)
 
   }
+
+  /**
+   * Fail this request's QA
+   *
+   * @param requestId the ID of the request on which to pass QA
+   */
+  public failQa(requestId: string) {
+    const addRestCallObservable = {
+      next: (response) => {
+        console.log(">>> QA Fail response:'" + response + "'");
+      },
+      error: (error) => console.error("Error when trying to fail QA on workflow request " + requestId + ": " + error),
+    };
+
+    return this.capabilityRequestService.sendQaFailRequest(parseInt(requestId)).subscribe(addRestCallObservable)
+
+  }
+
+
   ngOnInit(): void {}
 
   ngOnDestroy(): void {

apps/web/src/app/workspaces/services/capability-request.service.ts

@@ -116,6 +116,19 @@ export class CapabilityRequestService {
     )
   }
 
+  /**
+   * QA Fail this request by POSTing URL to REST endpoint
+   *
+   * @param requestId ID of request whose capability execution is to be passed
+   */
+  public sendQaFailRequest(requestId: number): Observable<string> {
+    const qaFailUrl = `workflows/requests/${requestId}/qa/qa_fail`
+    console.log(">>> qaFailUrl: " + qaFailUrl)
+    return this.httpClient.post<string>(
+      qaFailUrl, null
+    )
+  }
+
   /**
    * Create a new version of the specified capability request with specified settings
    * @param request_id  ID of request to add new version to