From b957513cc65b66ab0288db3fba5ccf9232f7c1fc Mon Sep 17 00:00:00 2001
From: filip131311 <filip.kaminski@swmansiom.com>
Date: Fri, 7 Jun 2024 01:03:29 -0700
Subject: [PATCH] Fix Application always in light mode on initial load.
 (#44335)

Summary:
Hi, I'm Filip from software mansion.  This PR solves a problem I stumbled upon.

On iOS, applications are always in light mode on initial load. Even if the device is turned to dark mode.

### Cause of the problem:

The initial appearance is taken from `RCTKeyWindow()`, but at the time of initialization of `RCTAppearance` it does not exist yet.

### Solution:

This PR moves repeats initialization of the appearance the first time `getColorScheme()` is called if it was not initialized properly before.

## Changelog:

[IOS] [FIXED] - Fix dark mode on initial load.

Pull Request resolved: https://github.com/facebook/react-native/pull/44335

Test Plan:
- Create new React native app with `npx react-native@latest init AwesomeProjec`
- Run the application on iphone using simulator
- turn on dark mode using `cmd+shift+A`
- close application and run it again

### without changes:
  The application will turn on in light mode despite the simulator being set to dark mode.
  When you reload the application it works as expected (is in dark mode)

### with changes:
  Works as expected

#### note:
any change to device ui settings will trigger a listener that will set appearance to correct state, so testing of this problem should happen in as isolated conditions as possible.

Reviewed By: cortinico

Differential Revision: D58189058

Pulled By: cipolleschi

fbshipit-source-id: 9a864f3d045e966bc88601f661d221c4796c5c95
---
 .../react-native/React/CoreModules/RCTAppearance.mm  | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/packages/react-native/React/CoreModules/RCTAppearance.mm b/packages/react-native/React/CoreModules/RCTAppearance.mm
index 4f7350faad7..457a1d8b966 100644
--- a/packages/react-native/React/CoreModules/RCTAppearance.mm
+++ b/packages/react-native/React/CoreModules/RCTAppearance.mm
@@ -19,6 +19,8 @@ using namespace facebook::react;
 NSString *const RCTAppearanceColorSchemeLight = @"light";
 NSString *const RCTAppearanceColorSchemeDark = @"dark";
 
+static BOOL sIsAppearancePreferenceSet = NO;
+
 static BOOL sAppearancePreferenceEnabled = YES;
 void RCTEnableAppearancePreference(BOOL enabled)
 {
@@ -62,6 +64,12 @@ NSString *RCTColorSchemePreference(UITraitCollection *traitCollection)
     // Return the default if the app doesn't allow different color schemes.
     return RCTAppearanceColorSchemeLight;
   }
+
+  if (appearances[@(traitCollection.userInterfaceStyle)]) {
+    sIsAppearancePreferenceSet = YES;
+    return appearances[@(traitCollection.userInterfaceStyle)];
+  }
+
   UIUserInterfaceStyle systemStyle = sUseKeyWindowForSystemStyle ? RCTKeyWindow().traitCollection.userInterfaceStyle
                                                                  : traitCollection.userInterfaceStyle;
   return appearances[@(systemStyle)] ?: RCTAppearanceColorSchemeLight;
@@ -116,6 +124,10 @@ RCT_EXPORT_METHOD(setColorScheme : (NSString *)style)
 
 RCT_EXPORT_SYNCHRONOUS_TYPED_METHOD(NSString *, getColorScheme)
 {
+  if (!sIsAppearancePreferenceSet) {
+    UITraitCollection *traitCollection = RCTKeyWindow().traitCollection;
+    _currentColorScheme = RCTColorSchemePreference(traitCollection);
+  }
   return _currentColorScheme;
 }