Handle system bar style when the theme changed (#1689)

chrisbanes · Jan 5, 2024 · bf0e32f · bf0e32f
1 parent abd545e
commit bf0e32f
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 0 deletions.
diff --git a/android-app/app/src/main/kotlin/app/tivi/home/MainActivity.kt b/android-app/app/src/main/kotlin/app/tivi/home/MainActivity.kt
@@ -4,10 +4,19 @@
 package app.tivi.home
 
 import android.content.Context
+import android.graphics.Color
 import android.net.Uri
 import android.os.Bundle
+import androidx.activity.SystemBarStyle
 import androidx.activity.compose.setContent
+import androidx.activity.enableEdgeToEdge
 import androidx.browser.customtabs.CustomTabsIntent
+import androidx.compose.foundation.isSystemInDarkTheme
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.collectAsState
+import androidx.compose.runtime.derivedStateOf
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.remember
 import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.semantics.semantics
@@ -21,6 +30,7 @@ import app.tivi.inject.AndroidActivityComponent
 import app.tivi.inject.AndroidApplicationComponent
 import app.tivi.inject.create
 import app.tivi.screens.DiscoverScreen
+import app.tivi.settings.TiviPreferences
 import com.slack.circuit.backstack.rememberSaveableBackStack
 import com.slack.circuit.foundation.rememberCircuitNavigator
 
@@ -37,6 +47,33 @@ class MainActivity : TiviActivity() {
       val backstack = rememberSaveableBackStack { push(DiscoverScreen) }
       val navigator = rememberCircuitNavigator(backstack)
 
+      val isSystemInDarkTheme = isSystemInDarkTheme()
+      val theme by component.applicationComponent.preferences.observeTheme()
+        .collectAsState(TiviPreferences.Theme.SYSTEM)
+      val isDarkTheme by remember {
+        derivedStateOf {
+          when (theme) {
+            TiviPreferences.Theme.SYSTEM -> isSystemInDarkTheme
+            TiviPreferences.Theme.LIGHT -> false
+            TiviPreferences.Theme.DARK -> true
+          }
+        }
+      }
+      LaunchedEffect(isDarkTheme) {
+        enableEdgeToEdge(
+          statusBarStyle = SystemBarStyle.auto(
+            lightScrim = Color.TRANSPARENT,
+            darkScrim = Color.TRANSPARENT,
+            detectDarkMode = { isDarkTheme },
+          ),
+          navigationBarStyle = SystemBarStyle.auto(
+            lightScrim = Color.TRANSPARENT,
+            darkScrim = Color.TRANSPARENT,
+            detectDarkMode = { isDarkTheme },
+          ),
+        )
+      }
+
       component.tiviContent(
         backstack,
         navigator,

diff --git a/core/preferences/src/commonMain/kotlin/app/tivi/settings/PreferencesComponent.kt b/core/preferences/src/commonMain/kotlin/app/tivi/settings/PreferencesComponent.kt
@@ -9,6 +9,8 @@ import me.tatarka.inject.annotations.Provides
 expect interface PreferencesPlatformComponent
 
 interface PreferencesComponent : PreferencesPlatformComponent {
+  val preferences: TiviPreferences
+
   @ApplicationScope
   @Provides
   fun providePreferences(bind: TiviPreferencesImpl): TiviPreferences = bind