[ BUG ] App does not actively listen to system theme changes
Describe the bug When the app is set to follow the system theme mode, changing the theme via the iPhone Control Center does not instantly update the app's theme. Instead, the app only detects the theme change after closing the Control Center. This behavior is inconsistent with the expected behavior of React Native's built-in useColorScheme hook, which should trigger theme changes immediately, even while the Control Center is open.
To Reproduce Steps to reproduce the behavior:
- Set the app to follow the system theme mode.
- Open the iPhone Control Center.
- Change the theme (e.g., from light to dark or vice versa).
- Observe that the app's theme does not update until the Control Center is closed.
Expected behavior The app should instantly update the theme in response to system theme changes, even when the Control Center is open.
Screenshots If applicable, add screenshots to help explain your problem.
https://github.com/user-attachments/assets/3cdfd6a6-4f89-47a1-9743-60a85a903306
https://github.com/user-attachments/assets/51243747-2685-424f-85d2-80b2fb997af0
Platform (please complete the following information):
- Type: [ iphone 15 pro]
- OS: [ios 18]
- Expo Go
Additional context
- The useColorScheme hook from React Native is known to detect theme changes immediately, even when the Control Center is open.
- It seems the app's current implementation may not be leveraging useColorScheme effectively to detect system theme changes in real time.
Hey @JeremyXXXuuu, I believe this is how NativeWind is set up: https://github.com/nativewind/nativewind/blob/main/packages/react-native-css-interop/src/runtime/native/appearance-observables.ts#L101
NativeWind seems to have an event listener on the appearance change but it only updates the color scheme when the app state is active.
Can you create this issue for NativeWind's repo?