Skip to content

Unguarded MatDialog Usages

Temporary planning document — delete after unguarded dialogs are addressed.

Context

PR #2400 added a dialog deduplication guard to the impersonation confirmation dialog using Angular Material's built-in id + getDialogById() pattern. This prevents multiple dialog instances from stacking on rapid clicks.

This document catalogues other MatDialog.open() call sites in the application that lack the same guard and could benefit from it in a future PR.

private static readonly DIALOG_ID = 'my-unique-dialog';

openMyDialog(): void {
  if (this.dialog.getDialogById(MyComponent.DIALOG_ID)) return;
  this.dialog.open(MyDialogComponent, {
    id: MyComponent.DIALOG_ID,
    // ...config
  });
}

Unguarded Call Sites

1. Data Export Error Details Dialog

  • File: src/services/web/src/app/project/data-export/shared/data-export-layout/data-export-layout.component.ts
  • Method: openErrorDetails() (line ~98)
  • Risk: Low — triggered by explicit button click on error rows
  • Dialog: ExportErrorDetailsDialogComponent

2. Stage Overview Settings Dialog

  • File: src/services/web/src/app/stage/stage-overview/member-progress/member-progress.component.ts
  • Method: openSettingDialog() (line ~152)
  • Risk: Low — triggered by settings button
  • Dialog: StageOverviewDialogComponent

3. Member Time Progress Dialog

  • File: src/services/web/src/app/stage/stage-overview/member-progress/member-progress.component.ts
  • Method: openMemberDialog() (line ~162)
  • Risk: Low — triggered by member row click
  • Dialog: MemberTimeProgressComponent

4. Stage Overview Time Progress Settings Dialog

  • File: src/services/web/src/app/stage/stage-overview/time-progress/time-progress.component.ts
  • Method: openSettingDialog() (line ~122)
  • Risk: Low — same pattern as member-progress
  • Dialog: StageOverviewDialogComponent

5. Environment Warning Dialog

  • File: src/services/web/src/app/shared/dialogs/version-info-dialog/version-info-dialog.component.ts
  • Method: openEnvironmentWarning() (line ~138)
  • Risk: Low — triggered from version info dialog
  • Dialog: EnvironmentWarningDialogComponent

6. Project Index — Multiple Dialog Usages

  • File: src/services/web/src/app/project-index/project-index.component.ts
  • Methods: loadProject effect (~211), launchJoinProjectDialog() (~813), onProjectCreate() (~841)
  • Risk: Medium for onProjectCreate (button click), Low for others (route-driven)
  • Dialogs: ProjectSummaryModalComponent, JoinProjectDialogComponent, InfoConfirmationDialogComponent, CreateProjectWizardComponent

Priority

All sites are low risk since Material dialogs are modal (overlay prevents interaction with content behind). The guard mainly protects against rapid double-clicks before the dialog animation completes. Prioritise onProjectCreate in project-index.component.ts as it's the most user-facing button-triggered dialog.