feat: added type to dialog config

bodnara · xflord · commit 760f8df52135 · 2023-10-12T12:52:27.000+02:00
Method for retrieving default dialog config will return typed config if data type is provided.
Provided example implementation for couple of cases.
diff --git a/apps/admin-gui/src/app/admin/pages/admin-page/admin-attributes/admin-attributes.component.ts b/apps/admin-gui/src/app/admin/pages/admin-page/admin-attributes/admin-attributes.component.ts
@@ -1,6 +1,9 @@
 import { Component, HostBinding, OnInit } from '@angular/core';
 import { SelectionModel } from '@angular/cdk/collections';
-import { DeleteAttributeDefinitionDialogComponent } from '../../../../shared/components/dialogs/delete-attribute-definition-dialog/delete-attribute-definition-dialog.component';
+import {
+  DeleteAttributeDefinitionDialogComponent,
+  DeleteAttributeDefinitionDialogData,
+} from '../../../../shared/components/dialogs/delete-attribute-definition-dialog/delete-attribute-definition-dialog.component';
 import { MatDialog } from '@angular/material/dialog';
 import { CreateAttributeDefinitionDialogComponent } from '../../../../shared/components/dialogs/create-attribute-definition-dialog/create-attribute-definition-dialog.component';
 import { getDefaultDialogConfig } from '@perun-web-apps/perun/utils';
@@ -36,7 +39,7 @@ export class AdminAttributesComponent implements OnInit {
   }
 
   onCreate(): void {
-    const config = getDefaultDialogConfig();
+    const config = getDefaultDialogConfig<never>();
     config.width = '650px';
 
     const dialogRef = this.dialog.open(CreateAttributeDefinitionDialogComponent, config);
@@ -49,7 +52,7 @@ export class AdminAttributesComponent implements OnInit {
   }
 
   onDelete(): void {
-    const config = getDefaultDialogConfig();
+    const config = getDefaultDialogConfig<DeleteAttributeDefinitionDialogData>();
     config.width = '450px';
     config.data = {
       attributes: this.selected.selected,
@@ -79,7 +82,7 @@ export class AdminAttributesComponent implements OnInit {
   }
 
   onImport(): void {
-    const config = getDefaultDialogConfig();
+    const config = getDefaultDialogConfig<never>();
     config.width = '700px';
 
     const dialogRef = this.dialog.open(AttributeImportDialogComponent, config);
diff --git a/apps/admin-gui/src/app/admin/pages/admin-page/admin-services/service-detail-page/service-destinations/service-destinations.component.ts b/apps/admin-gui/src/app/admin/pages/admin-page/admin-services/service-detail-page/service-destinations/service-destinations.component.ts
@@ -10,7 +10,10 @@ import {
   PerunTranslateService,
 } from '@perun-web-apps/perun/services';
 import { getDefaultDialogConfig } from '@perun-web-apps/perun/utils';
-import { RemoveDestinationDialogComponent } from '../../../../../../shared/components/dialogs/remove-destination-dialog/remove-destination-dialog.component';
+import {
+  RemoveDestinationDialogComponent,
+  RemoveDestinationDialogData,
+} from '../../../../../../shared/components/dialogs/remove-destination-dialog/remove-destination-dialog.component';
 
 @Component({
   selector: 'app-service-destinations',
@@ -63,7 +66,7 @@ export class ServiceDestinationsComponent implements OnInit {
   }
 
   onRemove(): void {
-    const config = getDefaultDialogConfig();
+    const config = getDefaultDialogConfig<RemoveDestinationDialogData>();
     config.width = '500px';
     config.data = {
       destinations: this.selection.selected,
diff --git a/apps/admin-gui/src/app/admin/pages/admin-page/admin-services/service-detail-page/service-detail-page.component.ts b/apps/admin-gui/src/app/admin/pages/admin-page/admin-services/service-detail-page/service-detail-page.component.ts
@@ -10,15 +10,24 @@ import { SideMenuService } from '../../../../../core/services/common/side-menu.s
 import { SideMenuItemService } from '../../../../../shared/side-menu/side-menu-item.service';
 import { getDefaultDialogConfig } from '@perun-web-apps/perun/utils';
 import { MatDialog } from '@angular/material/dialog';
-import { CreateEditServiceDialogComponent } from '../../../../../shared/components/dialogs/create-edit-service-dialog/create-edit-service-dialog.component';
+import {
+  CreateEditServiceDialogComponent,
+  CreateServiceDialogData,
+} from '../../../../../shared/components/dialogs/create-edit-service-dialog/create-edit-service-dialog.component';
 import {
   EntityStorageService,
   GuiAuthResolver,
   NotificatorService,
 } from '@perun-web-apps/perun/services';
-import { DeleteServiceDialogComponent } from '../../../../../shared/components/dialogs/delete-service-dialog/delete-service-dialog.component';
+import {
+  DeleteServiceDialogComponent,
+  DeleteServiceDialogData,
+} from '../../../../../shared/components/dialogs/delete-service-dialog/delete-service-dialog.component';
 import { TranslateService } from '@ngx-translate/core';
-import { UniversalConfirmationItemsDialogComponent } from '@perun-web-apps/perun/dialogs';
+import {
+  UniversalConfirmationItemsDialogComponent,
+  UniversalConfirmationItemsDialogData,
+} from '@perun-web-apps/perun/dialogs';
 
 @Component({
   selector: 'app-service-detail-page',
@@ -55,7 +64,7 @@ export class ServiceDetailPageComponent implements OnInit {
   }
 
   editService(): void {
-    const config = getDefaultDialogConfig();
+    const config = getDefaultDialogConfig<CreateServiceDialogData>();
     config.width = '600px';
     config.data = {
       theme: 'service-theme',
@@ -72,7 +81,7 @@ export class ServiceDetailPageComponent implements OnInit {
   }
 
   removeService(): void {
-    const config = getDefaultDialogConfig();
+    const config = getDefaultDialogConfig<DeleteServiceDialogData>();
     config.width = '600px';
     config.data = {
       theme: 'service-theme',
@@ -112,7 +121,7 @@ export class ServiceDetailPageComponent implements OnInit {
   }
 
   evaluateConsents(): void {
-    const config = getDefaultDialogConfig();
+    const config = getDefaultDialogConfig<UniversalConfirmationItemsDialogData>();
     config.width = '500px';
     config.data = {
       title: this.translate.instant('SERVICE_DETAIL.CONFIRM_DIALOG_TITLE') as string,
diff --git a/apps/admin-gui/src/app/admin/pages/admin-page/admin-services/service-detail-page/service-required-attributes/service-required-attributes.component.ts b/apps/admin-gui/src/app/admin/pages/admin-page/admin-services/service-detail-page/service-required-attributes/service-required-attributes.component.ts
@@ -8,8 +8,14 @@ import {
 import { TABLE_REQUIRED_ATTRIBUTES } from '@perun-web-apps/config/table-config';
 import { MatDialog } from '@angular/material/dialog';
 import { getDefaultDialogConfig } from '@perun-web-apps/perun/utils';
-import { AddRequiredAttributesDialogComponent } from '../../../../../../shared/components/dialogs/add-required-attributes-dialog/add-required-attributes-dialog.component';
-import { RemoveRequiredAttributesDialogComponent } from '../../../../../../shared/components/dialogs/remove-required-attributes-dialog/remove-required-attributes-dialog.component';
+import {
+  AddRequiredAttributesDialogComponent,
+  AddRequiredAttributesDialogData,
+} from '../../../../../../shared/components/dialogs/add-required-attributes-dialog/add-required-attributes-dialog.component';
+import {
+  RemoveRequiredAttributesDialogComponent,
+  RemoveRequiredAttributesDialogData,
+} from '../../../../../../shared/components/dialogs/remove-required-attributes-dialog/remove-required-attributes-dialog.component';
 import { EntityStorageService, GuiAuthResolver } from '@perun-web-apps/perun/services';
 
 @Component({
@@ -48,7 +54,7 @@ export class ServiceRequiredAttributesComponent implements OnInit {
   }
 
   onAdd(): void {
-    const config = getDefaultDialogConfig();
+    const config = getDefaultDialogConfig<AddRequiredAttributesDialogData>();
     config.width = '950px';
     config.data = {
       serviceId: this.service.id,
@@ -65,7 +71,7 @@ export class ServiceRequiredAttributesComponent implements OnInit {
   }
 
   onRemove(): void {
-    const config = getDefaultDialogConfig();
+    const config = getDefaultDialogConfig<RemoveRequiredAttributesDialogData>();
     config.width = '650px';
     config.data = {
       serviceId: this.service.id,
diff --git a/apps/admin-gui/src/app/admin/pages/admin-user-detail-page/admin-user-detail-page.component.ts b/apps/admin-gui/src/app/admin/pages/admin-user-detail-page/admin-user-detail-page.component.ts
@@ -5,15 +5,20 @@ import { SideMenuItemService } from '../../../shared/side-menu/side-menu-item.se
 import { AttributesManagerService, User, UsersManagerService } from '@perun-web-apps/perun/openapi';
 import { getDefaultDialogConfig } from '@perun-web-apps/perun/utils';
 import { MatDialog } from '@angular/material/dialog';
-import { EditUserDialogComponent } from '../../../shared/components/dialogs/edit-user-dialog/edit-user-dialog.component';
+import {
+  EditUserDialogComponent,
+  EditUserDialogData,
+} from '../../../shared/components/dialogs/edit-user-dialog/edit-user-dialog.component';
 import {
   EntityStorageService,
   GuiAuthResolver,
   StoreService,
 } from '@perun-web-apps/perun/services';
 import {
   AnonymizeUserDialogComponent,
+  AnonymizeUserDialogComponentData,
   DeleteUserDialogComponent,
+  DeleteUserDialogComponentData,
 } from '@perun-web-apps/perun/dialogs';
 import { ComponentType } from '@angular/cdk/overlay';
 
@@ -76,7 +81,7 @@ export class AdminUserDetailPageComponent implements OnInit {
   }
 
   editUser(): void {
-    const config = getDefaultDialogConfig();
+    const config = getDefaultDialogConfig<EditUserDialogData>();
     config.width = '450px';
     config.data = {
       theme: 'admin-theme',
@@ -112,7 +117,9 @@ export class AdminUserDetailPageComponent implements OnInit {
   private openDialog(
     dialogComponent: ComponentType<AnonymizeUserDialogComponent | DeleteUserDialogComponent>
   ): void {
-    const config = getDefaultDialogConfig();
+    const config = getDefaultDialogConfig<
+      AnonymizeUserDialogComponentData | DeleteUserDialogComponentData
+    >();
     config.width = '550px';
     config.data = {
       theme: 'admin-theme',
diff --git a/apps/admin-gui/src/app/app.component.ts b/apps/admin-gui/src/app/app.component.ts
@@ -178,7 +178,7 @@ export class AppComponent implements OnInit, AfterViewInit {
         const recentVersion: string = result['version'] as string;
         if (recentVersion) {
           if (this.version && recentVersion !== 'SNAPSHOT' && this.version !== recentVersion) {
-            const config = getDefaultDialogConfig();
+            const config = getDefaultDialogConfig<never>();
             this.dialog.open(NewVersionDialogComponent, config);
           } else {
             this.version = recentVersion;
diff --git a/apps/admin-gui/src/app/core/services/common/admin-gui-config.service.ts b/apps/admin-gui/src/app/core/services/common/admin-gui-config.service.ts
@@ -10,6 +10,7 @@ import { MatDialog } from '@angular/material/dialog';
 import { Location } from '@angular/common';
 import {
   PreventProxyOverloadDialogComponent,
+  PreventProxyOverloadDialogData,
   ServerDownDialogComponent,
 } from '@perun-web-apps/general';
 import { getDefaultDialogConfig } from '@perun-web-apps/perun/utils';
@@ -159,7 +160,7 @@ export class AdminGuiConfigService {
   }
 
   private handleErr(err: string & HttpErrorResponse): void {
-    const config = getDefaultDialogConfig();
+    const config = getDefaultDialogConfig<PreventProxyOverloadDialogData>();
     // FIXME: during initialization phase, it might happen that the translations are not loaded.
     if (err === 'Invalid path') {
       config.data = {
diff --git a/libs/perun/dialogs/src/lib/universal-confirmation-items-dialog/universal-confirmation-items-dialog.component.ts b/libs/perun/dialogs/src/lib/universal-confirmation-items-dialog/universal-confirmation-items-dialog.component.ts
@@ -7,7 +7,7 @@ export interface UniversalConfirmationItemsDialogData {
   title: string;
   description: string;
   items: string[];
-  alert: string;
+  alert?: string;
   type: 'remove' | 'confirmation';
   showAsk: boolean;
 }
diff --git a/libs/perun/utils/src/lib/perun-utils.ts b/libs/perun/utils/src/lib/perun-utils.ts
@@ -600,8 +600,8 @@ export function createNewApplicationMail(langs = ['en', 'cs']): ApplicationMail
   return mail;
 }
 
-export function getDefaultDialogConfig(): MatDialogConfig {
-  const config = new MatDialogConfig();
+export function getDefaultDialogConfig<T>(): MatDialogConfig<T> {
+  const config = new MatDialogConfig<T>();
   config.disableClose = true;
   config.autoFocus = false;
   return config;

Original file line number	Diff line number	Diff line change
`@@ -7,7 +7,7 @@ export interface UniversalConfirmationItemsDialogData {`
`7`	`7`	`title: string;`
`8`	`8`	`description: string;`
`9`	`9`	`items: string[];`
`10`		`- alert: string;`
	`10`	`+ alert?: string;`
`11`	`11`	`type: 'remove' \| 'confirmation';`
`12`	`12`	`showAsk: boolean;`
`13`	`13`	`}`