Issue 220 Fix inverse mode card when system is in dark mode (#223)

* Issue 220 - Fix dark mode Inverse mode string * fix comment: default light mode * remove wildcard imports Co-authored-by: Android Team <[email protected]> Co-authored-by: Vinay Gaba <[email protected]>
airbnb · Apr 19, 2022 · 2b8efb3 · 2b8efb3
1 parent 5474c06
commit 2b8efb3
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 22 deletions.
diff --git a/showkase/src/main/java/com/airbnb/android/showkase/ui/ShowkaseBrowserApp.kt b/showkase/src/main/java/com/airbnb/android/showkase/ui/ShowkaseBrowserApp.kt
@@ -1,5 +1,6 @@
 package com.airbnb.android.showkase.ui
 
+import android.content.res.Configuration
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
@@ -17,12 +18,14 @@ import androidx.compose.material.TextFieldDefaults
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Search
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.MutableState
 import androidx.compose.runtime.getValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.graphicsLayer
+import androidx.compose.ui.platform.LocalConfiguration
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.platform.testTag
 import androidx.compose.ui.text.TextStyle
@@ -51,26 +54,31 @@ internal fun ShowkaseBrowserApp(
     groupedTypographyMap: Map<String, List<ShowkaseBrowserTypography>>,
     showkaseBrowserScreenMetadata: MutableState<ShowkaseBrowserScreenMetadata>
 ) {
-    val navController = rememberNavController()
-    Scaffold(
-        drawerContent = null,
-        topBar = {
-            ShowkaseAppBar(navController, showkaseBrowserScreenMetadata)
-        },
-        content = {
-            Column(
-                modifier = Modifier.fillMaxSize().background(color = SHOWKASE_COLOR_BACKGROUND),
-            ) {
-                ShowkaseBodyContent(
-                    navController,
-                    groupedComponentMap,
-                    groupedColorsMap,
-                    groupedTypographyMap,
-                    showkaseBrowserScreenMetadata
-                )
+    val lightModeConfiguration = Configuration(LocalConfiguration.current).apply {
+        uiMode = Configuration.UI_MODE_NIGHT_NO
+    }
+    CompositionLocalProvider(LocalConfiguration provides lightModeConfiguration) {
+        val navController = rememberNavController()
+        Scaffold(
+            drawerContent = null,
+            topBar = {
+                ShowkaseAppBar(navController, showkaseBrowserScreenMetadata)
+            },
+            content = {
+                Column(
+                    modifier = Modifier.fillMaxSize().background(color = SHOWKASE_COLOR_BACKGROUND),
+                ) {
+                    ShowkaseBodyContent(
+                        navController,
+                        groupedComponentMap,
+                        groupedColorsMap,
+                        groupedTypographyMap,
+                        showkaseBrowserScreenMetadata
+                    )
+                }
             }
-        }
-    )
+        )
+    }
 }
 
 @Composable

diff --git a/showkase/src/main/java/com/airbnb/android/showkase/ui/ShowkaseComponentDetailScreen.kt b/showkase/src/main/java/com/airbnb/android/showkase/ui/ShowkaseComponentDetailScreen.kt
@@ -181,12 +181,11 @@ private fun RTLComponentCard(metadata: ShowkaseBrowserComponent) {
 
 @Composable
 private fun DarkModeComponentCard(metadata: ShowkaseBrowserComponent) {
-    val customConfiguration = Configuration(LocalConfiguration.current).apply {
+    val darkModeConfiguration = Configuration(LocalConfiguration.current).apply {
         uiMode = Configuration.UI_MODE_NIGHT_YES
     }
-
     ComponentCardTitle("${metadata.componentName} [Dark Mode]")
-    CompositionLocalProvider(LocalConfiguration provides customConfiguration) {
+    CompositionLocalProvider(LocalConfiguration provides darkModeConfiguration) {
         ComponentCard(metadata)
     }
 }