Cleanup element call and UI (#4641)

* Use ElementTheme.colors.bgCanvasDefault instead of MaterialTheme.colorScheme.background

Even if the value is the same, we should use color from ElementTheme.

* Remove background management of ElementCallActivity. It does not work as expected and also changing theme during a call would require to load the url again with the new theme.

* Do not use isSystemInDarkTheme() directly.

* Use bgSubtleSecondary for background color of Preview.

* Use default colors for Preview.

* Fix copy paste issue.

* Update screenshots

---------

Co-authored-by: ElementBot <android@element.io>

features/call/impl/src/main/kotlin/io/element/android/features/call/impl/ui/ElementCallActivity.kt

@@ -10,7 +10,6 @@ package io.element.android.features.call.impl.ui
 import android.Manifest
 import android.app.PictureInPictureParams
 import android.content.Intent
-import android.content.res.Configuration
 import android.media.AudioAttributes
 import android.media.AudioFocusRequest
 import android.media.AudioManager
@@ -78,7 +77,6 @@ class ElementCallActivity :
 
     private val requestPermissionsLauncher = registerPermissionResultLauncher()
 
-    private var isDarkMode = false
     private val webViewTarget = mutableStateOf<CallType?>(null)
 
     private var eventSink: ((CallScreenEvents) -> Unit)? = null
@@ -102,10 +100,6 @@ class ElementCallActivity :
             return
         }
 
-        if (savedInstanceState == null) {
-            updateUiMode(resources.configuration)
-        }
-
         pictureInPicturePresenter.setPipView(this)
 
         audioManager = getSystemService(AUDIO_SERVICE) as AudioManager
@@ -174,11 +168,6 @@ class ElementCallActivity :
         }
     }
 
-    override fun onConfigurationChanged(newConfig: Configuration) {
-        super.onConfigurationChanged(newConfig)
-        updateUiMode(newConfig)
-    }
-
     override fun onNewIntent(intent: Intent) {
         super.onNewIntent(intent)
         setCallType(intent)
@@ -283,19 +272,6 @@ class ElementCallActivity :
         }
     }
 
-    private fun updateUiMode(configuration: Configuration) {
-        val prevDarkMode = isDarkMode
-        val currentNightMode = configuration.uiMode and Configuration.UI_MODE_NIGHT_YES
-        isDarkMode = currentNightMode != 0
-        if (prevDarkMode != isDarkMode) {
-            if (isDarkMode) {
-                window.setBackgroundDrawableResource(android.R.drawable.screen_background_dark)
-            } else {
-                window.setBackgroundDrawableResource(android.R.drawable.screen_background_light)
-            }
-        }
-    }
-
     @RequiresApi(Build.VERSION_CODES.O)
     override fun setPipParams() {
         setPictureInPictureParams(getPictureInPictureParams())

features/preferences/impl/src/main/kotlin/io/element/android/features/preferences/impl/advanced/AdvancedSettingsView.kt

@@ -49,8 +49,8 @@ fun AdvancedSettingsView(
             title = stringResource(id = CommonStrings.common_appearance),
             selectedOption = state.theme,
             options = ThemeOption.entries.toPersistentList(),
-            onSelectOption = { logLevel ->
-                state.eventSink(AdvancedSettingsEvents.SetTheme(logLevel))
+            onSelectOption = { themeOption ->
+                state.eventSink(AdvancedSettingsEvents.SetTheme(themeOption))
             }
         )
         ListItem(

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/atoms/ElementLogoAtom.kt

@@ -10,7 +10,6 @@ package io.element.android.libraries.designsystem.atomic.atoms
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.border
-import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.CircleShape
@@ -38,7 +37,7 @@ fun ElementLogoAtom(
     size: ElementLogoAtomSize,
     modifier: Modifier = Modifier,
     useBlurredShadow: Boolean = canUseBlurMaskFilter(),
-    darkTheme: Boolean = isSystemInDarkTheme(),
+    darkTheme: Boolean = ElementTheme.isLightTheme.not(),
 ) {
     val blur = if (darkTheme) 160.dp else 24.dp
     val shadowColor = if (darkTheme) size.shadowColorDark else size.shadowColorLight

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/molecules/InfoListItemMolecule.kt

@@ -8,7 +8,6 @@
 package io.element.android.libraries.designsystem.atomic.molecules
 
 import androidx.compose.foundation.background
-import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
@@ -20,6 +19,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
+import io.element.android.compound.theme.ElementTheme
 import io.element.android.compound.tokens.generated.CompoundIcons
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.preview.PreviewsDayNight
@@ -62,7 +62,7 @@ fun InfoListItemMolecule(
 @Composable
 internal fun InfoListItemMoleculePreview() {
     ElementPreview {
-        val color = if (isSystemInDarkTheme()) Color.DarkGray else Color.LightGray
+        val color = ElementTheme.colors.bgSubtleSecondary
         Column(
             modifier = Modifier.padding(10.dp),
             verticalArrangement = Arrangement.spacedBy(8.dp),

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/organisms/InfoListOrganism.kt

@@ -111,7 +111,6 @@ internal fun InfoListOrganismPreview() = ElementPreview {
         InfoListItem(message = "A bottom item"),
     )
     InfoListOrganism(
-        items,
-        backgroundColor = ElementTheme.materialColors.surfaceVariant,
+        items = items,
     )
 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/Scaffold.kt

@@ -10,12 +10,12 @@ package io.element.android.libraries.designsystem.theme.components
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.material3.FabPosition
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.ScaffoldDefaults
 import androidx.compose.material3.contentColorFor
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import io.element.android.compound.theme.ElementTheme
 
 @Composable
 fun Scaffold(
@@ -25,7 +25,7 @@ fun Scaffold(
     snackbarHost: @Composable () -> Unit = {},
     floatingActionButton: @Composable () -> Unit = {},
     floatingActionButtonPosition: FabPosition = FabPosition.End,
-    containerColor: Color = MaterialTheme.colorScheme.background,
+    containerColor: Color = ElementTheme.colors.bgCanvasDefault,
     contentColor: Color = contentColorFor(containerColor),
     contentWindowInsets: WindowInsets = ScaffoldDefaults.contentWindowInsets,
     content: @Composable (PaddingValues) -> Unit