Add dark mode toggle

src/App.native.tsx

@@ -5,12 +5,13 @@ import {RootSiblingParent} from 'react-native-root-siblings'
 import {GestureHandlerRootView} from 'react-native-gesture-handler'
 import SplashScreen from 'react-native-splash-screen'
 import {SafeAreaProvider} from 'react-native-safe-area-context'
+import {observer} from 'mobx-react-lite'
 import {ThemeProvider} from './view/lib/ThemeContext'
 import * as view from './view/index'
 import {RootStoreModel, setupState, RootStoreProvider} from './state'
 import {MobileShell} from './view/shell/mobile'
 
-function App() {
+const App = observer(() => {
   const [rootStore, setRootStore] = useState<RootStoreModel | undefined>(
     undefined,
   )
@@ -41,7 +42,7 @@ function App() {
     <GestureHandlerRootView style={{flex: 1}}>
       <RootSiblingParent>
         <RootStoreProvider value={rootStore}>
-          <ThemeProvider>
+          <ThemeProvider theme={rootStore.shell.darkMode ? 'dark' : 'light'}>
             <SafeAreaProvider>
               <MobileShell />
             </SafeAreaProvider>
@@ -50,6 +51,6 @@ function App() {
       </RootSiblingParent>
     </GestureHandlerRootView>
   )
-}
+})
 
 export default App