fix(mobile): adjust status bar color to match current theme (#1624)

* feat: sync page theme color metadata with active theme bg

* fix: lint

* refactor: extract to method

* feat: recieve theme scheme change on mobile

* fix: handle issue where status bar color changes when keyboard appears on iOS

* fix: disable bouncing on web view

packages/mobile/src/Lib/Interface.ts

@@ -11,7 +11,7 @@ import {
   removeFromArray,
   TransferPayload,
 } from '@standardnotes/snjs'
-import { Alert, Linking, Platform } from 'react-native'
+import { Alert, Linking, Platform, StatusBar } from 'react-native'
 import FingerprintScanner from 'react-native-fingerprint-scanner'
 import FlagSecure from 'react-native-flag-secure-android'
 import { hide, show } from 'react-native-privacy-snapshot'
@@ -65,6 +65,7 @@ const showLoadFailForItemIds = (failedItemIds: string[]) => {
 export class MobileDevice implements MobileDeviceInterface {
   environment: Environment.Mobile = Environment.Mobile
   private eventObservers: MobileDeviceEventHandler[] = []
+  public isDarkMode = false
 
   constructor(private stateObserverService?: AppStateObserverService) {}
 
@@ -432,6 +433,16 @@ export class MobileDevice implements MobileDeviceInterface {
     }
   }
 
+  handleThemeSchemeChange(isDark: boolean): void {
+    this.isDarkMode = isDark
+
+    this.reloadStatusBarStyle()
+  }
+
+  reloadStatusBarStyle(animated = true) {
+    StatusBar.setBarStyle(this.isDarkMode ? 'light-content' : 'dark-content', animated)
+  }
+
   private notifyEvent(event: MobileDeviceEvent): void {
     for (const handler of this.eventObservers) {
       handler(event)