refactor: change modal presenation mode on iOS

src/app/modules/dashboard/sections/navigation-section/navigation-section.component.ts

@@ -13,7 +13,7 @@
  * this program. If not, see <https://www.gnu.org/licenses/>.
  */
 import {Component, OnInit, ViewEncapsulation} from '@angular/core';
-import {IonRouterOutlet, ModalController} from '@ionic/angular';
+import {ModalController} from '@ionic/angular';
 import {EditModalComponent} from '../../edit-modal/edit-modal.component';
 import {DEFAULT_ACTIVE_MENU_ITEMS, MENU_ITEMS} from './menu-items.config';
 import {MenuItemKey} from './menu-item.interface';
@@ -56,7 +56,6 @@ export class NavigationSectionComponent implements OnInit {
     public modalController: ModalController,
     private storageProvider: StorageProvider,
     private translatePipe: TranslatePipe,
-    private routerOutlet: IonRouterOutlet,
   ) {}
 
   ngOnInit() {
@@ -101,7 +100,6 @@ export class NavigationSectionComponent implements OnInit {
     const modal = await this.modalController.create({
       component: EditModalComponent,
       canDismiss: true,
-      presentingElement: this.routerOutlet.nativeEl,
       componentProps: {
         items: Object.entries(this.menuItems).map(([id, item]) => ({
           id,

src/app/modules/data/chips/data/add-event-action-chip.component.ts

@@ -126,7 +126,6 @@ export class AddEventActionChipComponent implements OnDestroy {
       component: AddEventReviewModalComponent,
       canDismiss: true,
       cssClass: 'add-modal',
-      presentingElement: await this.modalController.getTop(),
       componentProps: {
         dismissAction: () => {
           modal.dismiss();

src/app/modules/map/page/map-page.html

@@ -133,11 +133,7 @@
     </ion-button>
   </div>
 
-  <ion-modal
+  <ion-modal [canDismiss]="true" #mapListModal>
-    [canDismiss]="true"
-    [presentingElement]="routerOutlet.nativeEl"
-    #mapListModal
-  >
     <ng-template>
       <map-list-modal
         style="height: 100%"

src/app/modules/schedule/page/modal/modal-event-creator.component.ts

@@ -45,7 +45,6 @@ export class ModalEventCreatorComponent implements OnInit, OnDestroy {
             inputItem: item,
           },
           canDismiss: true,
-          presentingElement: await this.modalController.getTop(),
         });
         return modal.present();
       }),

src/app/modules/schedule/page/schedule-page.html

@@ -82,7 +82,6 @@
 
   <ion-modal
     canDismiss="true"
-    [presentingElement]="routerOutlet.nativeEl"
     [isOpen]="isModalOpen"
     (ionModalWillDismiss)="onModalDismiss()"
   >

src/app/util/edit-modal.component.ts

@@ -18,7 +18,6 @@ import {
   ContentChild,
   EventEmitter,
   Input,
-  OnInit,
   Output,
   TemplateRef,
   ViewChild,
@@ -41,7 +40,7 @@ import {TranslatePipe} from '@ngx-translate/core';
   selector: 'stapps-edit-modal',
   templateUrl: 'edit-modal.html',
 })
-export class EditModalComponent implements OnInit {
+export class EditModalComponent {
   @ContentChild(TemplateRef) content: TemplateRef<unknown>;
 
   @ViewChild('modal') modal: IonModal;
@@ -50,8 +49,6 @@ export class EditModalComponent implements OnInit {
 
   @Output() save = new EventEmitter();
 
-  presentingElement: HTMLElement;
-
   constructor(
     readonly modalController: ModalController,
     readonly routerOutlet: IonRouterOutlet,
@@ -61,11 +58,6 @@ export class EditModalComponent implements OnInit {
     readonly config: Config,
   ) {}
 
-  async ngOnInit() {
-    this.presentingElement =
-      (await this.modalController.getTop()) || this.routerOutlet.nativeEl;
-  }
-
   present() {
     this.modal.present();
     this.pendingChanges = false;

src/app/util/edit-modal.html

@@ -13,11 +13,7 @@
   ~ this program. If not, see <https://www.gnu.org/licenses/>.
   -->
 
-<ion-modal
+<ion-modal #modal [canDismiss]="!pendingChanges || canDismissModal">
-  #modal
-  [presentingElement]="presentingElement"
-  [canDismiss]="!pendingChanges || canDismissModal"
->
   <ng-template>
     <ion-header mode="ios">
       <ion-toolbar>