fix: make keyboard dismissable on mobile devices

src/app/app.component.ts

@@ -22,6 +22,7 @@ import {environment} from '../environments/environment';
 import {StatusBar, Style} from '@capacitor/status-bar';
 import {Capacitor} from '@capacitor/core';
 import {ScheduleSyncService} from './modules/background/schedule/schedule-sync.service';
+import {Keyboard, KeyboardResize} from '@capacitor/keyboard';
 
 /**
  * TODO
@@ -45,6 +46,11 @@ export class AppComponent implements AfterContentInit {
     title: string;
   }>;
 
+  /**
+   * Angular component selectors that should not infulence keyboard state
+   */
+  ommitedEventSources = ['ion-input', 'ion-searchbar'];
+
   /**
    *
    * @param platform TODO
@@ -104,6 +110,11 @@ export class AppComponent implements AfterContentInit {
         'others',
       ]);
     });
+
+    window.addEventListener('touchmove', this.touchMoveEvent, true);
+    if (Capacitor.isNativePlatform()) {
+      Keyboard.setResizeMode({mode: KeyboardResize.None});
+    }
   }
 
   private async authNotificationsInit() {
@@ -129,4 +140,30 @@ export class AppComponent implements AfterContentInit {
     });
     await toast.present();
   }
+
+  /**
+   * Checks if keyboard should be dissmissed
+   */
+  touchMoveEvent = (event: Event): void => {
+    if (
+      this.ommitedEventSources.includes(
+        (event?.target as unknown as Record<string, string>)?.[
+          's-hn'
+        ]?.toLowerCase(),
+      )
+    ) {
+      return;
+    }
+    this.unfocusActiveElement();
+  };
+
+  /**
+   * Loses focus on the currently active element (meant for input fields).
+   * Results in virtual keyboard being dissmissed on native and web plattforms.
+   */
+  unfocusActiveElement() {
+    const activeElement = document.activeElement;
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (activeElement as any)?.blur();
+  }
 }