refactor: modal dialog improvements

intershop · Dec 9, 2024 · 77ea3d4 · 77ea3d4
1 parent d7174c2
commit 77ea3d4
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 11 deletions.
diff --git a/...-management/src/app/pages/organization-settings/organization-settings-page.component.html b/...-management/src/app/pages/organization-settings/organization-settings-page.component.html
@@ -58,8 +58,8 @@ <h3>{{ 'account.organization.org_settings.preferences.subtitle' | translate }}</
     confirmText: 'account.update.button.label' | translate,
     rejectText: 'account.cancel.button.label' | translate,
     titleText: 'account.organization.budget_price_type.notification_modal.header' | translate,
-    faIconClass: 'text-warning pr-2',
-    faIcon: ['fas', 'triangle-exclamation']
+    icon: ['fas', 'triangle-exclamation'],
+    iconClass: 'text-warning pr-2'
   }"
   (confirmed)="submit()"
   (closed)="resetValue()"

diff --git a/src/app/shared/components/common/modal-dialog/modal-dialog.component.html b/src/app/shared/components/common/modal-dialog/modal-dialog.component.html
@@ -1,9 +1,7 @@
 <ng-template #template>
   <div class="modal-header">
-    <h2 *ngIf="options?.titleText" class="modal-title">
-      <fa-icon *ngIf="options?.faIcon" class="{{ options.faIconClass }}" [icon]="options.faIcon" />{{
-        options.titleText
-      }}
+    <h2 *ngIf="options.titleText" class="modal-title">
+      <fa-icon *ngIf="options.icon" [icon]="options.icon" class="{{ options.iconClass }} " />{{ options.titleText }}
     </h2>
     <button type="button" class="close" [title]="'dialog.close.text' | translate" (click)="hide()">
       <span aria-hidden="true">&times;</span>

diff --git a/src/app/shared/components/common/modal-dialog/modal-dialog.component.ts b/src/app/shared/components/common/modal-dialog/modal-dialog.component.ts
@@ -35,13 +35,13 @@ export interface ModalOptions extends NgbModalOptions {
    */
   rejectText?: string;
   /**
-   * Optional fa icon styling classes.
+   * Optional icon properties to display an icon in front of the title, e.g. ['fas', 'triangle-exclamation'],
    */
-  faIconClass?: string;
+  icon?: IconProp;
   /**
-   * Optional icon parameters.
+   * Optional icon styling classes, e.g. faIconClass: 'text-warning pr-2'
    */
-  faIcon?: IconProp;
+  iconClass?: string;
 }
 
 /**
@@ -63,7 +63,7 @@ export interface ModalOptions extends NgbModalOptions {
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ModalDialogComponent<T> implements OnDestroy {
-  @Input() options: ModalOptions;
+  @Input({ required: true }) options: ModalOptions;
 
   @Output() confirmed = new EventEmitter<T>();