From 1cc06fd3b9ffbb1bfbfff74f286d849212aeccd7 Mon Sep 17 00:00:00 2001
From: Vijay Oommen <voommen@livefront.com>
Date: Tue, 13 May 2025 14:29:23 -0500
Subject: [PATCH] [PM-20999] Styling corrections to Access Intelligence - Part
 2 (#14552)

---
 apps/web/src/locales/en/messages.json         | 15 +++++
 .../app-table-row-scrollable.component.html   |  2 +-
 .../risk-insights.component.html              | 63 +++++++++++--------
 3 files changed, 54 insertions(+), 26 deletions(-)

diff --git a/apps/web/src/locales/en/messages.json b/apps/web/src/locales/en/messages.json
index b5725d4edd..cf2174cc1d 100644
--- a/apps/web/src/locales/en/messages.json
+++ b/apps/web/src/locales/en/messages.json
@@ -140,9 +140,15 @@
   "atRiskMembersDescription": {
     "message": "These members are logging into applications with weak, exposed, or reused passwords."
   },
+  "atRiskMembersDescriptionNone": {
+    "message": "These are no members logging into applications with weak, exposed, or reused passwords."
+  },
   "atRiskApplicationsDescription": {
     "message": "These applications have weak, exposed, or reused passwords."
   },
+  "atRiskApplicationsDescriptionNone": {
+    "message": "These are no applications with weak, exposed, or reused passwords."
+  },
   "atRiskMembersDescriptionWithApp": {
     "message": "These members are logging into $APPNAME$ with weak, exposed, or reused passwords.",
     "placeholders": {
@@ -152,6 +158,15 @@
       }
     }
   },
+  "atRiskMembersDescriptionWithAppNone": {
+    "message": "There are no at risk members for $APPNAME$.",
+    "placeholders": {
+      "appname": {
+        "content": "$1",
+        "example": "Salesforce"
+      }
+    }
+  },
   "totalMembers": {
     "message": "Total members"
   },
diff --git a/bitwarden_license/bit-web/src/app/dirt/access-intelligence/app-table-row-scrollable.component.html b/bitwarden_license/bit-web/src/app/dirt/access-intelligence/app-table-row-scrollable.component.html
index ff38ab5687..10dbb17951 100644
--- a/bitwarden_license/bit-web/src/app/dirt/access-intelligence/app-table-row-scrollable.component.html
+++ b/bitwarden_license/bit-web/src/app/dirt/access-intelligence/app-table-row-scrollable.component.html
@@ -89,7 +89,7 @@
 
         <bit-menu #rowMenu>
           <button type="button" bitMenuItem (click)="unmarkAsCriticalApp(row.applicationName)">
-            <i aria-hidden="true" class="bwi bwi-star-f"></i> {{ "unmarkAsCriticalApp" | i18n }}
+            {{ "unmarkAsCriticalApp" | i18n }}
           </button>
         </bit-menu>
       </td>
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 fea0b32e95..f759e483bd 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
@@ -68,19 +68,24 @@
         </bit-drawer-header>
         <bit-drawer-body>
           <span bitTypography="body1" class="tw-text-muted tw-text-sm">{{
-            "atRiskMembersDescription" | i18n
+            (dataService.atRiskMemberDetails.length > 0
+              ? "atRiskMembersDescription"
+              : "atRiskMembersDescriptionNone"
+            ) | i18n
           }}</span>
-          <div class="tw-flex tw-justify-between tw-mt-2 tw-text-muted">
-            <div bitTypography="body2" class="tw-text-sm tw-font-bold">{{ "email" | i18n }}</div>
-            <div bitTypography="body2" class="tw-text-sm tw-font-bold">
-              {{ "atRiskPasswords" | i18n }}
-            </div>
-          </div>
-          <ng-container *ngFor="let member of dataService.atRiskMemberDetails">
-            <div class="tw-flex tw-justify-between tw-mt-2">
-              <div>{{ member.email }}</div>
-              <div>{{ member.atRiskPasswordCount }}</div>
+          <ng-container *ngIf="dataService.atRiskMemberDetails.length > 0">
+            <div class="tw-flex tw-justify-between tw-mt-2 tw-text-muted">
+              <div bitTypography="body2" class="tw-text-sm tw-font-bold">{{ "email" | i18n }}</div>
+              <div bitTypography="body2" class="tw-text-sm tw-font-bold">
+                {{ "atRiskPasswords" | i18n }}
+              </div>
             </div>
+            <ng-container *ngFor="let member of dataService.atRiskMemberDetails">
+              <div class="tw-flex tw-justify-between tw-mt-2">
+                <div>{{ member.email }}</div>
+                <div>{{ member.atRiskPasswordCount }}</div>
+              </div>
+            </ng-container>
           </ng-container>
         </bit-drawer-body>
       </ng-container>
@@ -94,7 +99,10 @@
           </div>
           <div bitTypography="body1" class="tw-text-muted tw-text-sm tw-mb-2">
             {{
-              "atRiskMembersDescriptionWithApp" | i18n: dataService.appAtRiskMembers.applicationName
+              (dataService.appAtRiskMembers.members.length > 0
+                ? "atRiskMembersDescriptionWithApp"
+                : "atRiskMembersDescriptionWithAppNone"
+              ) | i18n: dataService.appAtRiskMembers.applicationName
             }}
           </div>
           <div class="tw-mt-1">
@@ -113,21 +121,26 @@
 
         <bit-drawer-body>
           <span bitTypography="body2" class="tw-text-muted tw-text-sm">{{
-            "atRiskApplicationsDescription" | i18n
+            (dataService.atRiskAppDetails.length > 0
+              ? "atRiskApplicationsDescription"
+              : "atRiskApplicationsDescriptionNone"
+            ) | i18n
           }}</span>
-          <div class="tw-flex tw-justify-between tw-mt-2 tw-text-muted">
-            <div bitTypography="body2" class="tw-text-sm tw-font-bold">
-              {{ "application" | i18n }}
-            </div>
-            <div bitTypography="body2" class="tw-text-sm tw-font-bold">
-              {{ "atRiskPasswords" | i18n }}
-            </div>
-          </div>
-          <ng-container *ngFor="let app of dataService.atRiskAppDetails">
-            <div class="tw-flex tw-justify-between tw-mt-2">
-              <div>{{ app.applicationName }}</div>
-              <div>{{ app.atRiskPasswordCount }}</div>
+          <ng-container *ngIf="dataService.atRiskAppDetails.length > 0">
+            <div class="tw-flex tw-justify-between tw-mt-2 tw-text-muted">
+              <div bitTypography="body2" class="tw-text-sm tw-font-bold">
+                {{ "application" | i18n }}
+              </div>
+              <div bitTypography="body2" class="tw-text-sm tw-font-bold">
+                {{ "atRiskPasswords" | i18n }}
+              </div>
             </div>
+            <ng-container *ngFor="let app of dataService.atRiskAppDetails">
+              <div class="tw-flex tw-justify-between tw-mt-2">
+                <div>{{ app.applicationName }}</div>
+                <div>{{ app.atRiskPasswordCount }}</div>
+              </div>
+            </ng-container>
           </ng-container>
         </bit-drawer-body>
       </ng-container>