From 942d2f7a4ec87ba212beeb21a73a5ceda91a231e Mon Sep 17 00:00:00 2001
From: Ammar Ahmed <40239442+ammarahm-ed@users.noreply.github.com>
Date: Tue, 24 Oct 2023 12:44:41 +0500
Subject: [PATCH] mobile: fix system bar colors (#3611)

---
 apps/mobile/app/navigation/tabs-holder.js | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/apps/mobile/app/navigation/tabs-holder.js b/apps/mobile/app/navigation/tabs-holder.js
index ce76326a9..aaa9d864b 100644
--- a/apps/mobile/app/navigation/tabs-holder.js
+++ b/apps/mobile/app/navigation/tabs-holder.js
@@ -384,7 +384,16 @@ const _TabsHolder = () => {
   }, []);
 
   useEffect(() => {
-    changeNavigationBarColor(colors.primary.background, isDark, true);
+    function updateSystemBars() {
+      changeNavigationBarColor(colors.primary.background, isDark, true);
+      StatusBar.setBackgroundColor("transparent");
+      StatusBar.setTranslucent(true);
+      StatusBar.setBarStyle(isDark ? "light-content" : "dark-content");
+    }
+    updateSystemBars();
+    setTimeout(() => {
+      updateSystemBars();
+    }, 1000);
   }, [colors.primary.background, isDark]);
 
   return (
@@ -406,11 +415,7 @@ const _TabsHolder = () => {
             : 0
       }}
     >
-      <StatusBar
-        barStyle={isDark ? "light-content" : "dark-content"}
-        translucent={true}
-        backgroundColor="transparent"
-      />
+      <StatusBar translucent={true} backgroundColor="transparent" />
 
       {!introCompleted ? (
         <NavigationStack />