refactor: update to ionic v6

src/app/modules/schedule/page/schedule-page.component.ts

@@ -21,12 +21,10 @@ import {
 } from '@angular/core';
 import {Location} from '@angular/common';
 import {ActivatedRoute, Router} from '@angular/router';
-import {AnimationController, ModalController} from '@ionic/angular';
+import {IonRouterOutlet} from '@ionic/angular';
 import {SharedAxisChoreographer} from '../../../animation/animation-choreographer';
 import {materialSharedAxisX} from '../../../animation/material-motion';
-import {ModalEventCreatorComponent} from './modal/modal-event-creator.component';
 import {ScheduleResponsiveBreakpoint} from './schema/schema';
-import {animate, style, transition, trigger} from '@angular/animations';
 
 /**
  * This needs to be sorted by break point low -> high
@@ -51,23 +49,6 @@ const responsiveConfig: ScheduleResponsiveBreakpoint[] = [
   },
 ];
 
-const fabAnimations = trigger('fabAnimation', [
-  transition(':leave', [
-    style({opacity: 1, transform: 'translate(0vw, 0vh) scale(100%)'}),
-    animate(
-      '100ms ease-in',
-      style({opacity: 0, transform: 'translate(-5vw, -5vh) scale(200%)'}),
-    ),
-  ]),
-  transition(':enter', [
-    style({opacity: 0, transform: 'translate(-5vw, -5vh) scale(200%)'}),
-    animate(
-      '200ms ease-out',
-      style({opacity: 1, transform: 'translate(0vw, 0vh) scale(100%)'}),
-    ),
-  ]),
-]);
-
 /**
  * Component that displays the schedule
  */
@@ -75,7 +56,7 @@ const fabAnimations = trigger('fabAnimation', [
   selector: 'stapps-schedule-page',
   templateUrl: 'schedule-page.html',
   styleUrls: ['schedule-page.scss'],
-  animations: [materialSharedAxisX, fabAnimations],
+  animations: [materialSharedAxisX],
 })
 export class SchedulePageComponent implements OnInit, AfterViewInit {
   /**
@@ -88,8 +69,6 @@ export class SchedulePageComponent implements OnInit, AfterViewInit {
    */
   actualSegmentValue?: string | null;
 
-  fabVisible = true;
-
   /**
    * Layout
    */
@@ -124,9 +103,8 @@ export class SchedulePageComponent implements OnInit, AfterViewInit {
   }
 
   constructor(
-    private readonly modalController: ModalController,
     private readonly activatedRoute: ActivatedRoute,
-    private readonly animationController: AnimationController,
+    readonly routerOutlet: IonRouterOutlet,
     private router: Router,
     private location: Location,
   ) {}
@@ -171,63 +149,4 @@ export class SchedulePageComponent implements OnInit, AfterViewInit {
     this.location.go(url);
     this.tabChoreographer.changeViewForState(this.segmentView.value);
   }
-
-  /**
-   * Add event modal sheet
-   */
-  async showCreateEventModal() {
-    this.fabVisible = false;
-
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any,unicorn/consistent-function-scoping
-    const enterAnimation = (baseElement: any) => {
-      const backdropAnimation = this.animationController
-        .create()
-        .addElement(baseElement.querySelector('.modal-wrapper'))
-        .fromTo('opacity', '0', 'var(--backdrop-opacity)');
-
-      const wrapperAnimation = this.animationController
-        .create()
-        .addElement(baseElement.querySelector('.modal-wrapper'))
-        .keyframes([
-          {
-            opacity: '0',
-            transform: 'translate(30vw, 30vh) scale(0.5)',
-          },
-          {
-            opacity: '1',
-            transform: 'translate(0vw, 0vh) scale(1)',
-          },
-        ]);
-
-      return this.animationController
-        .create()
-        .addElement(baseElement)
-        .easing('ease-out')
-        .duration(150)
-        .addAnimation([backdropAnimation, wrapperAnimation]);
-    };
-
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any,unicorn/consistent-function-scoping
-    const leaveAnimation = (baseElement: any) => {
-      return enterAnimation(baseElement).direction('reverse');
-    };
-
-    const modal = await this.modalController.create({
-      component: ModalEventCreatorComponent,
-      swipeToClose: true,
-      cssClass: 'add-modal',
-      componentProps: {
-        dismissAction: () => {
-          modal.dismiss();
-        },
-      },
-      enterAnimation,
-      leaveAnimation,
-    });
-
-    await modal.present();
-    await modal.onWillDismiss();
-
-    this.fabVisible = true;
-  }
 }