Added feature flag to show/hide the new draft history UI

Author: pmachapman

src/SIL.XForge.Scripture/ClientApp/src/app/translate/draft-generation/draft-generation.component.html

@@ -261,7 +261,7 @@ <h3>{{ t("draft_finishing_header") }}</h3>
                   <app-working-animated-indicator></app-working-animated-indicator>
                 </section>
               }
-              @if (isDraftComplete(draftJob) || hasAnyCompletedBuild) {
+              @if ((isDraftComplete(draftJob) || hasAnyCompletedBuild) && !featureFlags.newDraftHistory.enabled) {
                 <section class="draft-complete">
                   <mat-card class="preview-card">
                     <mat-card-header>
@@ -333,6 +333,10 @@ <h3>{{ t("draft_finishing_header") }}</h3>
       }
     </section>
 
+    @if (featureFlags.newDraftHistory.enabled) {
+      <app-draft-history-list></app-draft-history-list>
+    }
+
     @if (canShowAdditionalInfo(draftJob)) {
       <section>
         <mat-expansion-panel class="diagnostics-info">
@@ -363,5 +367,3 @@ <h3>{{ t("draft_finishing_header") }}</h3>
     }
   }
 </ng-container>
-
-<app-draft-history-list></app-draft-history-list>

src/SIL.XForge.Scripture/ClientApp/src/app/translate/draft-generation/draft-generation.component.spec.ts

@@ -13,6 +13,7 @@ import { anything, instance, mock, verify, when } from 'ts-mockito';
 import { ActivatedProjectService } from 'xforge-common/activated-project.service';
 import { AuthService } from 'xforge-common/auth.service';
 import { DialogService } from 'xforge-common/dialog.service';
+import { createTestFeatureFlag, FeatureFlagService } from 'xforge-common/feature-flags/feature-flag.service';
 import { RealtimeQuery } from 'xforge-common/models/realtime-query';
 import { UserDoc } from 'xforge-common/models/user-doc';
 import { NoticeService } from 'xforge-common/notice.service';
@@ -51,6 +52,7 @@ describe('DraftGenerationComponent', () => {
   let mockPreTranslationSignupUrlService: jasmine.SpyObj<PreTranslationSignupUrlService>;
   let mockTrainingDataService: jasmine.SpyObj<TrainingDataService>;
   let mockProgressService: jasmine.SpyObj<ProgressService>;
+  let mockFeatureFlagService: jasmine.SpyObj<FeatureFlagService>;
 
   const buildDto: BuildDto = {
     id: 'testId',
@@ -98,7 +100,8 @@ describe('DraftGenerationComponent', () => {
           { provide: OnlineStatusService, useClass: TestOnlineStatusService },
           { provide: PreTranslationSignupUrlService, useValue: mockPreTranslationSignupUrlService },
           { provide: TrainingDataService, useValue: mockTrainingDataService },
-          { provide: ProgressService, useValue: mockProgressService }
+          { provide: ProgressService, useValue: mockProgressService },
+          { provide: FeatureFlagService, useValue: mockFeatureFlagService }
         ]
       });
 
@@ -156,6 +159,9 @@ describe('DraftGenerationComponent', () => {
       when(mockTrainingDataQuery.remoteDocChanges$).thenReturn(of());
       mockTrainingDataService = jasmine.createSpyObj<TrainingDataService>(['queryTrainingDataAsync']);
       mockTrainingDataService.queryTrainingDataAsync.and.returnValue(Promise.resolve(instance(mockTrainingDataQuery)));
+      mockFeatureFlagService = jasmine.createSpyObj<FeatureFlagService>({
+        newDraftHistory: createTestFeatureFlag(false)
+      });
     }
 
     static initProject(currentUserId: string, preTranslate: boolean = true): void {
@@ -1416,6 +1422,7 @@ describe('DraftGenerationComponent', () => {
 
     it('button should display if there is a completed build while a build is queued', () => {
       const env = new TestEnvironment();
+      env.setup();
       env.component.draftJob = { ...buildDto, state: BuildStates.Queued };
       env.component.lastCompletedBuild = { ...buildDto, state: BuildStates.Completed };
       env.component.hasDraftBooksAvailable = true;

src/SIL.XForge.Scripture/ClientApp/src/app/translate/draft-generation/draft-generation.component.ts

@@ -17,6 +17,7 @@ import { AuthService } from 'xforge-common/auth.service';
 import { DataLoadingComponent } from 'xforge-common/data-loading-component';
 import { DialogService } from 'xforge-common/dialog.service';
 import { ExternalUrlService } from 'xforge-common/external-url.service';
+import { FeatureFlagService } from 'xforge-common/feature-flags/feature-flag.service';
 import { I18nService } from 'xforge-common/i18n.service';
 import { NoticeService } from 'xforge-common/notice.service';
 import { OnlineStatusService } from 'xforge-common/online-status.service';
@@ -152,6 +153,7 @@ export class DraftGenerationComponent extends DataLoadingComponent implements On
     private readonly preTranslationSignupUrlService: PreTranslationSignupUrlService,
     protected readonly noticeService: NoticeService,
     protected readonly urlService: ExternalUrlService,
+    protected readonly featureFlags: FeatureFlagService,
     private destroyRef: DestroyRef
   ) {
     super(noticeService);

src/SIL.XForge.Scripture/ClientApp/src/xforge-common/feature-flags/feature-flag.service.ts

@@ -319,6 +319,13 @@ export class FeatureFlagService {
     this.featureFlagStore
   );
 
+  readonly newDraftHistory: ObservableFeatureFlag = new FeatureFlagFromStorage(
+    'NewDraftHistory',
+    'Preview new draft history interface',
+    16,
+    this.featureFlagStore
+  );
+
   get featureFlags(): FeatureFlag[] {
     return Object.values(this).filter(value => value instanceof FeatureFlagFromStorage);
   }