From 906ac951752abb7e3c6127467b1685afcd613419 Mon Sep 17 00:00:00 2001
From: Alex <55413326+AlexRubik@users.noreply.github.com>
Date: Mon, 3 Nov 2025 17:03:11 -0500
Subject: [PATCH] [PM-26908] feature flag for empty state component (#17179)

---
 .../risk-insights.component.html              | 65 ++++++++++---------
 1 file changed, 33 insertions(+), 32 deletions(-)

diff --git a/bitwarden_license/bit-web/src/app/dirt/access-intelligence/risk-insights.component.html b/bitwarden_license/bit-web/src/app/dirt/access-intelligence/risk-insights.component.html
index b7d05c73768..15ccd3241e4 100644
--- a/bitwarden_license/bit-web/src/app/dirt/access-intelligence/risk-insights.component.html
+++ b/bitwarden_license/bit-web/src/app/dirt/access-intelligence/risk-insights.component.html
@@ -6,7 +6,8 @@
     <dirt-risk-insights-loading></dirt-risk-insights-loading>
   } @else {
     <!-- Check final states after initial calls have been completed -->
-    @if (!(dataService.hasReportData$ | async)) {
+    @if (isRiskInsightsActivityTabFeatureEnabled && !(dataService.hasReportData$ | async)) {
+      <!-- Show empty state only when feature flag is enabled and there's no report data -->
       <div class="tw-flex tw-justify-center tw-items-center tw-min-h-[70vh] tw-w-full">
         @if (!hasCiphers) {
           <!-- Show Empty state when there are no applications (no ciphers to make reports on) -->
@@ -33,47 +34,47 @@
         }
       </div>
     } @else {
-      <!-- Show screen when there is report data -->
+      <!-- Show screen when there is report data OR when feature flag is disabled (show tabs even without data) -->
       <div class="tw-min-h-screen tw-flex tw-flex-col">
         <div>
           <h1 bitTypography="h1">{{ "riskInsights" | i18n }}</h1>
           <div class="tw-text-main tw-max-w-4xl tw-mb-2" *ngIf="appsCount > 0">
             {{ "reviewAtRiskPasswords" | i18n }}
           </div>
-          @if (dataLastUpdated) {
-            <div
-              class="tw-bg-primary-100 tw-rounded-lg tw-w-full tw-px-8 tw-py-4 tw-my-4 tw-flex tw-items-center"
-            >
-              <i
-                class="bwi bwi-exclamation-triangle bwi-lg tw-text-[1.2rem] tw-text-muted"
-                aria-hidden="true"
-              ></i>
+          @let isRunningReport = dataService.isGeneratingReport$ | async;
+          <div
+            class="tw-bg-primary-100 tw-rounded-lg tw-w-full tw-px-8 tw-py-4 tw-my-4 tw-flex tw-items-center"
+          >
+            <i
+              class="bwi bwi-exclamation-triangle bwi-lg tw-text-[1.2rem] tw-text-muted"
+              aria-hidden="true"
+            ></i>
+            @if (dataLastUpdated) {
               <span class="tw-mx-4">{{
                 "dataLastUpdated" | i18n: (dataLastUpdated | date: "MMMM d, y 'at' h:mm a")
               }}</span>
-              @let isRunningReport = dataService.isGeneratingReport$ | async;
-              <span class="tw-flex tw-justify-center">
-                <button
-                  *ngIf="!isRunningReport"
-                  type="button"
-                  bitButton
-                  buttonType="secondary"
-                  class="tw-border-none !tw-font-normal tw-cursor-pointer !tw-py-0"
-                  tabindex="0"
-                  [bitAction]="generateReport.bind(this)"
-                >
-                  {{ "riskInsightsRunReport" | i18n }}
-                </button>
-                <span>
-                  <i
-                    *ngIf="isRunningReport"
-                    class="bwi bwi-spinner bwi-spin tw-text-muted tw-text-[1.2rem]"
-                    aria-hidden="true"
-                  ></i>
-                </span>
+            }
+            <span class="tw-flex tw-justify-center">
+              <button
+                *ngIf="!isRunningReport"
+                type="button"
+                bitButton
+                buttonType="secondary"
+                class="tw-border-none !tw-font-normal tw-cursor-pointer !tw-py-0"
+                tabindex="0"
+                [bitAction]="generateReport.bind(this)"
+              >
+                {{ "riskInsightsRunReport" | i18n }}
+              </button>
+              <span>
+                <i
+                  *ngIf="isRunningReport"
+                  class="bwi bwi-spinner bwi-spin tw-text-muted tw-text-[1.2rem]"
+                  aria-hidden="true"
+                ></i>
               </span>
-            </div>
-          }
+            </span>
+          </div>
         </div>
 
         <div class="tw-flex-1 tw-flex tw-flex-col">