From 1fc0989d65802f4ea1d402fea7dad56613da2204 Mon Sep 17 00:00:00 2001 From: Alex Date: Tue, 2 Sep 2025 12:09:26 -0400 Subject: [PATCH] refactor: replace first report prompt in all-apps files with a dedicated dialog component --- .../all-applications.component.html | 65 ------------------- .../all-applications.component.ts | 54 +-------------- .../first-report-prompt-dialog.component.html | 45 +++++++++++++ .../first-report-prompt-dialog.component.ts | 30 +++++++++ 4 files changed, 78 insertions(+), 116 deletions(-) create mode 100644 bitwarden_license/bit-web/src/app/dirt/access-intelligence/first-report-prompt-dialog.component.html create mode 100644 bitwarden_license/bit-web/src/app/dirt/access-intelligence/first-report-prompt-dialog.component.ts diff --git a/bitwarden_license/bit-web/src/app/dirt/access-intelligence/all-applications.component.html b/bitwarden_license/bit-web/src/app/dirt/access-intelligence/all-applications.component.html index f67a6600ca8..5cd7e700ce6 100644 --- a/bitwarden_license/bit-web/src/app/dirt/access-intelligence/all-applications.component.html +++ b/bitwarden_license/bit-web/src/app/dirt/access-intelligence/all-applications.component.html @@ -1,68 +1,3 @@ - -@if (showFirstReportPromptDialog) { - -
- -
- - Welcome to Risk insights - -
-

- To get started, follow these steps to find potential security risks. -

- -
-
-

- 1. Enforce organization data ownership - (recommended) -

-

- Turn on the - enforce organization data ownership policy - to get complete visibility of all organization vault data. This setting can be - enabled at any time. -

-
-
-

2. Run the report

-

- Run the report to see a detailed view of potential at-risk passwords across your - most critical applications. -

-
-
-
- - - - - -
-
-} - @if (dataService.isLoading$ | async) { } @else { diff --git a/bitwarden_license/bit-web/src/app/dirt/access-intelligence/all-applications.component.ts b/bitwarden_license/bit-web/src/app/dirt/access-intelligence/all-applications.component.ts index b301c23d363..b3a20dcdb1b 100644 --- a/bitwarden_license/bit-web/src/app/dirt/access-intelligence/all-applications.component.ts +++ b/bitwarden_license/bit-web/src/app/dirt/access-intelligence/all-applications.component.ts @@ -1,4 +1,3 @@ -import { CdkTrapFocus } from "@angular/cdk/a11y"; import { Component, DestroyRef, inject, OnInit } from "@angular/core"; import { takeUntilDestroyed } from "@angular/core/rxjs-interop"; import { FormControl } from "@angular/forms"; @@ -27,8 +26,6 @@ import { TableDataSource, ToastService, DialogService, - ButtonModule, - DialogModule, } from "@bitwarden/components"; import { CardComponent } from "@bitwarden/dirt-card"; import { HeaderModule } from "@bitwarden/web-vault/app/layouts/header/header.module"; @@ -36,14 +33,12 @@ import { SharedModule } from "@bitwarden/web-vault/app/shared"; import { PipesModule } from "@bitwarden/web-vault/app/vault/individual-vault/pipes/pipes.module"; import { AppTableRowScrollableComponent } from "./app-table-row-scrollable.component"; +import { FirstReportPromptDialogComponent } from "./first-report-prompt-dialog.component"; import { ApplicationsLoadingComponent } from "./risk-insights-loading.component"; @Component({ selector: "tools-all-applications", templateUrl: "./all-applications.component.html", - host: { - "(keydown.escape)": "handleEscape($event)", // escape dialog with keyboard - }, imports: [ ApplicationsLoadingComponent, HeaderModule, @@ -54,9 +49,6 @@ import { ApplicationsLoadingComponent } from "./risk-insights-loading.component" SharedModule, AppTableRowScrollableComponent, IconButtonModule, - ButtonModule, - DialogModule, - CdkTrapFocus, ], }) export class AllApplicationsComponent implements OnInit { @@ -74,7 +66,6 @@ export class AllApplicationsComponent implements OnInit { private hasShownFirstReportPrompt = false; // Flag to prevent multiple prompts private organizationId: string | null = null; - protected showFirstReportPromptDialog = false; // Controls visibility of the simple dialog destroyRef = inject(DestroyRef); constructor( @@ -112,9 +103,6 @@ export class AllApplicationsComponent implements OnInit { this.dataSource.data = report.data; // this.applicationSummary = this.reportService.generateApplicationsSummary(report.data); this.hasShownFirstReportPrompt = false; // Reset flag when data is available - if (this.showFirstReportPromptDialog) { - this.closePrompt(); // Use closePrompt method to properly restore scroll - } } else if (!this.hasShownFirstReportPrompt) { // Show prompt only once when no report data is available void this.showFirstReportPrompt(); @@ -130,44 +118,8 @@ export class AllApplicationsComponent implements OnInit { // Set flag to prevent multiple prompts this.hasShownFirstReportPrompt = true; - // Show the simple dialog and prevent body scroll - this.showFirstReportPromptDialog = true; - document.body.classList.add("tw-overflow-hidden"); - } - - /** - * Runs the report and closes the prompt - */ - async runReport(): Promise { - // Close the prompt first - this.closePrompt(); - - // Add a small delay to ensure prompt closes before triggering the report - await new Promise((resolve) => setTimeout(resolve, 100)); - - // Trigger the report generation - if (this.dataService) { - this.dataService.triggerReport(); - } - } - - /** - * Closes the prompt (called when clicking backdrop or pressing Escape) - */ - closePrompt(): void { - this.showFirstReportPromptDialog = false; - // Restore body scroll - document.body.classList.remove("tw-overflow-hidden"); - } - - /** - * Handles Escape key press to close prompt - */ - handleEscape(event: KeyboardEvent): void { - if (this.showFirstReportPromptDialog) { - this.closePrompt(); - event.stopPropagation(); - } + // Open the dialog using the dialog service + FirstReportPromptDialogComponent.open(this.dialogService); } goToCreateNewLoginItem = async () => { diff --git a/bitwarden_license/bit-web/src/app/dirt/access-intelligence/first-report-prompt-dialog.component.html b/bitwarden_license/bit-web/src/app/dirt/access-intelligence/first-report-prompt-dialog.component.html new file mode 100644 index 00000000000..589f6ca30c9 --- /dev/null +++ b/bitwarden_license/bit-web/src/app/dirt/access-intelligence/first-report-prompt-dialog.component.html @@ -0,0 +1,45 @@ + + Welcome to Risk insights + +
+

+ To get started, follow these steps to find potential security risks. +

+ +
+
+

+ 1. Enforce organization data ownership + (recommended) +

+

+ Turn on the + enforce organization data ownership policy + to get complete visibility of all organization vault data. This setting can be enabled + at any time. +

+
+
+

2. Run the report

+

+ Run the report to see a detailed view of potential at-risk passwords across your most + critical applications. +

+
+
+
+ + + + + diff --git a/bitwarden_license/bit-web/src/app/dirt/access-intelligence/first-report-prompt-dialog.component.ts b/bitwarden_license/bit-web/src/app/dirt/access-intelligence/first-report-prompt-dialog.component.ts new file mode 100644 index 00000000000..958365fae55 --- /dev/null +++ b/bitwarden_license/bit-web/src/app/dirt/access-intelligence/first-report-prompt-dialog.component.ts @@ -0,0 +1,30 @@ +import { Component, inject } from "@angular/core"; + +import { RiskInsightsDataService } from "@bitwarden/bit-common/dirt/reports/risk-insights"; +import { ButtonModule, DialogModule, DialogRef, DialogService } from "@bitwarden/components"; + +@Component({ + templateUrl: "./first-report-prompt-dialog.component.html", + imports: [ButtonModule, DialogModule], +}) +export class FirstReportPromptDialogComponent { + private dialogRef = inject(DialogRef); + private dataService = inject(RiskInsightsDataService); + + static open(dialogService: DialogService) { + return dialogService.open(FirstReportPromptDialogComponent); + } + + async runReport(): Promise { + // Close the dialog first + this.dialogRef.close(true); + + // Add a small delay to ensure dialog closes before triggering the report + await new Promise((resolve) => setTimeout(resolve, 100)); + + // Trigger the report generation + if (this.dataService) { + this.dataService.triggerReport(); + } + } +}