fix for status bar dark mode issue

src/services/navigation/options.ts

@@ -1,7 +1,12 @@
+import {StatusBar} from 'react-native';
 import {Options, OptionsTopBar} from 'react-native-navigation';
 import {Colors} from 'react-native-ui-lib';
 import Ionicons from 'react-native-vector-icons/Ionicons';
-import {getThemeColor, getThemeStatusBarStyle} from '../../utils/designSystem';
+import {
+  getThemeColor,
+  getThemeRNStatusBarStyle,
+  getThemeStatusBarStyle,
+} from '../../utils/designSystem';
 import {NavButton, navButtons} from './buttons';
 
 const ICON_SIZE = 25;
@@ -53,6 +58,10 @@ export const tabsDefaultOptions = (): Options => {
 };
 
 export const navDefaultOptions = (): Options => {
+  // quick-fix: it seems like RNN options ignore status bar style,
+  // so StatusBar from react-native is used
+  StatusBar.setBarStyle(getThemeRNStatusBarStyle());
+
   return {
     layout: {
       orientation: ['portrait'],

src/utils/designSystem.tsx

@@ -1,3 +1,4 @@
+import {StatusBarStyle as RNStatusBarStyle} from 'react-native';
 import {Color} from 'react-native-navigation';
 import {Colors, Typography} from 'react-native-ui-lib';
 import {stores} from '../stores';
@@ -80,3 +81,20 @@ export const getThemeStatusBarStyle = (): StatusBarStyle => {
     }
   }
 };
+
+export const getThemeRNStatusBarStyle = (): RNStatusBarStyle => {
+  const {ui} = stores;
+
+  if (ui.isAppearanceSystem) {
+    return 'default';
+  } else {
+    switch (ui.appearance) {
+      case 'dark':
+        return 'light-content';
+      case 'light':
+        return 'dark-content';
+      default:
+        return 'default';
+    }
+  }
+};