From 759ee44b69d24612e2c6368101bd44c57dec12e4 Mon Sep 17 00:00:00 2001
From: Raymond Luong <raymond_luong@sil.org>
Date: Mon, 27 Jan 2025 16:06:36 -0700
Subject: [PATCH] SF-3173 Show error when matching training pairs not selected

---
 .../draft-generation-steps.component.html         | 15 ++++++++-------
 .../draft-generation-steps.component.spec.ts      |  6 ++++--
 2 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/src/SIL.XForge.Scripture/ClientApp/src/app/translate/draft-generation/draft-generation-steps/draft-generation-steps.component.html b/src/SIL.XForge.Scripture/ClientApp/src/app/translate/draft-generation/draft-generation-steps/draft-generation-steps.component.html
index c815881e9b..46ffecfc34 100644
--- a/src/SIL.XForge.Scripture/ClientApp/src/app/translate/draft-generation/draft-generation-steps/draft-generation-steps.component.html
+++ b/src/SIL.XForge.Scripture/ClientApp/src/app/translate/draft-generation/draft-generation-steps/draft-generation-steps.component.html
@@ -75,7 +75,9 @@ <h4 class="explanation">
           </button>
         </div>
       </mat-step>
-      <mat-step [completed]="isTrainingOptional || trainingSourceBooksSelected">
+      <mat-step
+        [completed]="(isTrainingOptional || trainingSourceBooksSelected) && translatedBooksSelectedInTrainingSources"
+      >
         <ng-template matStepLabel>
           {{ t("choose_books_for_training_header") }}
         </ng-template>
@@ -133,15 +135,14 @@ <h2>{{ t("reference_books") }}</h2>
             ></app-book-multi-select>
           }
         }
-        @if (showBookSelectionError) {
-          <app-notice type="error">
-            {{ t("choose_books_for_training_error") }}
-          </app-notice>
-        }
         @if (!translatedBooksSelectedInTrainingSources) {
-          <app-notice class="warn-translated-books-unselected" type="warning" icon="warning">
+          <app-notice class="error-translated-books-unselected" type="error">
             {{ t("translated_book_selected_no_training_pair") }}
           </app-notice>
+        } @else if (showBookSelectionError) {
+          <app-notice class="error-choose-training-books" type="error">
+            {{ t("choose_books_for_training_error") }}
+          </app-notice>
         }
         @if (translatedBooksWithNoSource.length > 0) {
           <app-notice class="warn-source-books-missing" type="warning" icon="warning">
diff --git a/src/SIL.XForge.Scripture/ClientApp/src/app/translate/draft-generation/draft-generation-steps/draft-generation-steps.component.spec.ts b/src/SIL.XForge.Scripture/ClientApp/src/app/translate/draft-generation/draft-generation-steps/draft-generation-steps.component.spec.ts
index 65e509c2d9..f9ec186900 100644
--- a/src/SIL.XForge.Scripture/ClientApp/src/app/translate/draft-generation/draft-generation-steps/draft-generation-steps.component.spec.ts
+++ b/src/SIL.XForge.Scripture/ClientApp/src/app/translate/draft-generation/draft-generation-steps/draft-generation-steps.component.spec.ts
@@ -484,10 +484,12 @@ describe('DraftGenerationStepsComponent', () => {
       expect(component.stepper.selectedIndex).toBe(2);
       component.onSourceTrainingBookSelect([2], config.trainingSources[0]);
       fixture.detectChanges();
-      expect(fixture.nativeElement.querySelector('.warn-translated-books-unselected')).not.toBeNull();
+      expect(fixture.nativeElement.querySelector('.error-translated-books-unselected')).not.toBeNull();
       component.tryAdvanceStep();
       fixture.detectChanges();
-      expect(component.stepper.selectedIndex).toBe(3);
+      // The user cannot advance if reference books are not provided for training
+      expect(component.stepper.selectedIndex).toBe(2);
+      expect(fixture.nativeElement.querySelector('.error-choose-training-books')).toBeNull();
     });
 
     it('clears selected reference books when translated book is unselected', () => {