From b259f2c46a584c115bd228970ab1a19249c5bdb0 Mon Sep 17 00:00:00 2001
From: Nathaniel Paulus <nathaniel_paulus@sil.org>
Date: Sun, 6 Oct 2024 19:34:06 -0400
Subject: [PATCH] Enable dev options as soon as version number is repeatedly
 clicked (#2770)

---
 scripts/db_tools/parse-version.ts                        | 2 +-
 .../ClientApp/src/app/app.component.html                 | 9 ++-------
 .../ClientApp/src/app/app.component.spec.ts              | 2 +-
 .../ClientApp/src/app/app.component.ts                   | 7 +++++++
 .../xforge-common/feature-flags/feature-flag.service.ts  | 6 +++---
 5 files changed, 14 insertions(+), 12 deletions(-)

diff --git a/scripts/db_tools/parse-version.ts b/scripts/db_tools/parse-version.ts
index f9a93fd81c..4a47f3440e 100644
--- a/scripts/db_tools/parse-version.ts
+++ b/scripts/db_tools/parse-version.ts
@@ -23,7 +23,7 @@ class ParseVersion {
 
   // This array is ordered based on the bit position of the feature flag
   featureFlags: string[] = [
-    'Show feature flags',
+    'Show developer tools',
     'Show non-published localizations',
     'Show NMT drafting',
     'Allow Forward Translation NMT drafting',
diff --git a/src/SIL.XForge.Scripture/ClientApp/src/app/app.component.html b/src/SIL.XForge.Scripture/ClientApp/src/app/app.component.html
index 775f450a89..c9bf18bbb4 100644
--- a/src/SIL.XForge.Scripture/ClientApp/src/app/app.component.html
+++ b/src/SIL.XForge.Scripture/ClientApp/src/app/app.component.html
@@ -70,19 +70,14 @@
           <a mat-menu-item target="_blank" href="/3rdpartylicenses.txt">
             <mat-icon>copyright</mat-icon> {{ t("open_source_licenses") }}
           </a>
-          @if (versionNumberClickCount >= 7 || featureFlags.showFeatureFlags.enabled) {
+          @if (featureFlags.showDeveloperTools.enabled) {
             <button mat-menu-item (click)="openFeatureFlagDialog()">
               <mat-icon>science</mat-icon>
               Developer settings
             </button>
           }
           <mat-divider></mat-divider>
-          <div
-            mat-menu-item
-            disabled="true"
-            (click)="versionNumberClickCount = versionNumberClickCount + 1"
-            id="version-number"
-          >
+          <div mat-menu-item disabled="true" (click)="versionNumberClicked()" id="version-number">
             {{ t("product_version", { version: version + this.featureFlags.versionSuffix }) }}
           </div>
         </mat-menu>
diff --git a/src/SIL.XForge.Scripture/ClientApp/src/app/app.component.spec.ts b/src/SIL.XForge.Scripture/ClientApp/src/app/app.component.spec.ts
index 5205730300..7dd65a4d40 100644
--- a/src/SIL.XForge.Scripture/ClientApp/src/app/app.component.spec.ts
+++ b/src/SIL.XForge.Scripture/ClientApp/src/app/app.component.spec.ts
@@ -662,7 +662,7 @@ class TestEnvironment {
     }
     when(mockedFeatureFlagService.showNmtDrafting).thenReturn(createTestFeatureFlag(false));
     when(mockedFeatureFlagService.allowForwardTranslationNmtDrafting).thenReturn(createTestFeatureFlag(false));
-    when(mockedFeatureFlagService.showFeatureFlags).thenReturn(createTestFeatureFlag(false));
+    when(mockedFeatureFlagService.showDeveloperTools).thenReturn(createTestFeatureFlag(false));
     when(mockedFeatureFlagService.stillness).thenReturn(createTestFeatureFlag(false));
     when(mockedFeatureFlagService.showNonPublishedLocalizations).thenReturn(createTestFeatureFlag(false));
     when(mockedFileService.notifyUserIfStorageQuotaBelow(anything())).thenResolve();
diff --git a/src/SIL.XForge.Scripture/ClientApp/src/app/app.component.ts b/src/SIL.XForge.Scripture/ClientApp/src/app/app.component.ts
index 84a754b60b..72c6bfd485 100644
--- a/src/SIL.XForge.Scripture/ClientApp/src/app/app.component.ts
+++ b/src/SIL.XForge.Scripture/ClientApp/src/app/app.component.ts
@@ -397,6 +397,13 @@ export class AppComponent extends DataLoadingComponent implements OnInit, OnDest
     this.dialogService.openMatDialog(FeatureFlagsDialogComponent);
   }
 
+  versionNumberClicked(): void {
+    this.versionNumberClickCount++;
+    if (this.versionNumberClickCount >= 7) {
+      this.featureFlags.showDeveloperTools.enabled = true;
+    }
+  }
+
   private async showProjectDeletedDialog(): Promise<void> {
     await this.userService.setCurrentProjectId(this.currentUserDoc!, undefined);
     await this.dialogService.message('app.project_has_been_deleted');
diff --git a/src/SIL.XForge.Scripture/ClientApp/src/xforge-common/feature-flags/feature-flag.service.ts b/src/SIL.XForge.Scripture/ClientApp/src/xforge-common/feature-flags/feature-flag.service.ts
index c04aeca74b..aa59f0a6bf 100644
--- a/src/SIL.XForge.Scripture/ClientApp/src/xforge-common/feature-flags/feature-flag.service.ts
+++ b/src/SIL.XForge.Scripture/ClientApp/src/xforge-common/feature-flags/feature-flag.service.ts
@@ -209,9 +209,9 @@ export class FeatureFlagService {
   // Also, the position is important - this is the bit wise position of the feature flag in the version.
   // The position in the dialog is determined by the order in this class.
 
-  readonly showFeatureFlags: ObservableFeatureFlag = new FeatureFlagFromStorage(
-    'SHOW_FEATURE_FLAGS',
-    'Show feature flags',
+  readonly showDeveloperTools: ObservableFeatureFlag = new FeatureFlagFromStorage(
+    'SHOW_DEVELOPER_TOOLS',
+    'Show developer tools',
     0,
     this.featureFlagStore
   );