From 4220eafa460cc04c62f2bec8e5598299500e59b1 Mon Sep 17 00:00:00 2001
From: Alex <adewitt@bitwarden.com>
Date: Fri, 31 Oct 2025 16:18:21 -0400
Subject: [PATCH] update dialog template to display application metrics

- Update @for track to use app.applicationName
- Update all app references to app.applicationName for selection logic
- Add "Total items" and "Members affected" column headers
- Replace placeholder cell with three data cells for metrics
- Display atRiskPasswordCount, passwordCount, and atRiskMemberCount
- Apply right-alignment and muted styling to secondary metrics
- Direct property binding - no helper methods needed

Part 4 of 5: Dialog template now displays full application data.
---
 .../new-applications-dialog.component.html    | 26 ++++++++++++++-----
 1 file changed, 20 insertions(+), 6 deletions(-)

diff --git a/bitwarden_license/bit-web/src/app/dirt/access-intelligence/activity/new-applications-dialog.component.html b/bitwarden_license/bit-web/src/app/dirt/access-intelligence/activity/new-applications-dialog.component.html
index 14cb2558834..49e6b0619f6 100644
--- a/bitwarden_license/bit-web/src/app/dirt/access-intelligence/activity/new-applications-dialog.component.html
+++ b/bitwarden_license/bit-web/src/app/dirt/access-intelligence/activity/new-applications-dialog.component.html
@@ -21,25 +21,31 @@
               <th bitTypography="body2" class="tw-text-right tw-py-3 tw-px-2 tw-font-semibold">
                 {{ "atRiskItems" | i18n }}
               </th>
+              <th bitTypography="body2" class="tw-text-right tw-py-3 tw-px-2 tw-font-semibold">
+                {{ "totalItems" | i18n }}
+              </th>
+              <th bitTypography="body2" class="tw-text-right tw-py-3 tw-px-2 tw-font-semibold">
+                {{ "membersAffected" | i18n }}
+              </th>
             </tr>
           </thead>
           <tbody>
-            @for (app of newApplications; track app) {
+            @for (app of newApplications; track app.applicationName) {
               <tr class="tw-border-b tw-border-secondary-300 hover:tw-bg-background-alt">
                 <td class="tw-py-3 tw-px-2">
                   <button
                     type="button"
                     class="tw-bg-transparent tw-border-0 tw-p-0 tw-cursor-pointer"
-                    (click)="toggleSelection(app)"
+                    (click)="toggleSelection(app.applicationName)"
                     [attr.aria-label]="
-                      isSelected(app)
+                      isSelected(app.applicationName)
                         ? ('unselectApplication' | i18n)
                         : ('selectApplication' | i18n)
                     "
                   >
                     <i
                       class="bwi tw-text-muted"
-                      [ngClass]="isSelected(app) ? 'bwi-star-f' : 'bwi-star'"
+                      [ngClass]="isSelected(app.applicationName) ? 'bwi-star-f' : 'bwi-star'"
                       aria-hidden="true"
                     ></i>
                   </button>
@@ -47,10 +53,18 @@
                 <td bitTypography="body1" class="tw-py-3 tw-px-2">
                   <div class="tw-flex tw-items-center tw-gap-2">
                     <i class="bwi bwi-globe tw-text-muted" aria-hidden="true"></i>
-                    <span>{{ app }}</span>
+                    <span>{{ app.applicationName }}</span>
                   </div>
                 </td>
-                <td bitTypography="body1" class="tw-py-3 tw-px-2 tw-text-right tw-text-muted">—</td>
+                <td bitTypography="body1" class="tw-py-3 tw-px-2 tw-text-right">
+                  {{ app.atRiskPasswordCount }}
+                </td>
+                <td bitTypography="body1" class="tw-py-3 tw-px-2 tw-text-right tw-text-muted">
+                  {{ app.passwordCount }}
+                </td>
+                <td bitTypography="body1" class="tw-py-3 tw-px-2 tw-text-right tw-text-muted">
+                  {{ app.atRiskMemberCount }}
+                </td>
               </tr>
             }
           </tbody>