make the composables previewable again and also fix some ui glitches

app/src/main/kotlin/com/simplemobiletools/calculator/activities/SettingsActivity.kt

@@ -15,6 +15,7 @@ import com.simplemobiletools.calculator.compose.theme.getAppIconIds
 import com.simplemobiletools.calculator.compose.theme.getAppLauncherName
 import com.simplemobiletools.calculator.extensions.*
 import com.simplemobiletools.commons.activities.CustomizationActivity
+import com.simplemobiletools.commons.extensions.getCustomizeColorsString
 import com.simplemobiletools.commons.extensions.isOrWasThankYouInstalled
 import com.simplemobiletools.commons.extensions.launchPurchaseThankYouIntent
 import com.simplemobiletools.commons.helpers.*
@@ -44,7 +45,7 @@ class SettingsActivity : AppCompatActivity() {
                 var isOrWasThankYouInstalled by remember { mutableStateOf(false) }
 
                 OnLifecycleEvent { event ->
-                    if (event == androidx.lifecycle.Lifecycle.Event.ON_RESUME) {
+                    if (event == androidx.lifecycle.Lifecycle.Event.ON_START) {
                         isOrWasThankYouInstalled = context.isOrWasThankYouInstalled()
                     }
                 }
@@ -73,6 +74,7 @@ class SettingsActivity : AppCompatActivity() {
                             applicationContext.calculatorDB.deleteHistory()
                         }
                     },
+                    lockedCustomizeColorText = if (isOrWasThankYouInstalled) null else getCustomizeColorsString()
                 )
             }
         }

app/src/main/kotlin/com/simplemobiletools/calculator/compose/screens/SettingsScreen.kt

@@ -1,5 +1,6 @@
 package com.simplemobiletools.calculator.compose.screens
 
+import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.rememberScrollState
@@ -14,6 +15,7 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.lerp
 import androidx.compose.ui.input.nestedscroll.nestedScroll
 import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.platform.LocalView
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.dp
 import com.simplemobiletools.calculator.compose.extensions.MyDevices
@@ -27,7 +29,6 @@ import com.simplemobiletools.commons.R
 import com.simplemobiletools.commons.extensions.getCustomizeColorsString
 import com.simplemobiletools.commons.helpers.isTiramisuPlus
 import java.util.Locale
-import kotlin.reflect.KFunction1
 
 @Composable
 fun SettingsScreen(
@@ -49,9 +50,8 @@ fun SettingsScreen(
     onSetupLanguagePress: () -> Unit,
     useCommaAsDecimalMarkFlow: Boolean,
     onUseCommaAsDecimalMarkFlow: (Boolean) -> Unit,
+    lockedCustomizeColorText: String?
 ) {
-    val context = LocalContext.current
-    val lockedCustomizeColorText =  if (isOrWasThankYouInstalled) null else context.getCustomizeColorsString()
     val displayLanguage = remember { Locale.getDefault().displayLanguage }
     val scrollBehavior = TopAppBarDefaults.pinnedScrollBehavior(rememberTopAppBarState())
     val colorTransitionFraction = scrollBehavior.state.overlappedFraction
@@ -63,8 +63,8 @@ fun SettingsScreen(
     )
     Scaffold(
         modifier = Modifier
-            .fillMaxSize()
-            .nestedScroll(scrollBehavior.nestedScrollConnection),
+            .nestedScroll(scrollBehavior.nestedScrollConnection)
+            .fillMaxSize(),
         topBar = {
             TopAppBar(
                 title = {
@@ -92,62 +92,69 @@ fun SettingsScreen(
             )
         }
     ) { paddingValues ->
-        Column(
-            Modifier
+        Box(
+            modifier = Modifier
+                .fillMaxSize()
                 .padding(paddingValues)
-                .verticalScroll(rememberScrollState())
+                .background(MaterialTheme.colorScheme.surface)
         ) {
-            SettingsGroup(title = {
-                SettingsTitleTextComponent(text = stringResource(id = R.string.color_customization))
-            }) {
-                SettingsPreferenceComponent(
-                    preferenceTitle = stringResource(id = R.string.customize_colors),
-                    doOnPreferenceClick = customizeColors,
-                    isPreferenceEnabled = isOrWasThankYouInstalled,
-                    preferenceSummary = lockedCustomizeColorText
-                )
-                SettingsPreferenceComponent(
-                    preferenceTitle = stringResource(id = R.string.customize_widget_colors),
-                    doOnPreferenceClick = customizeWidgetColors
-                )
-                Spacer(modifier = Modifier.padding(bottom = 16.dp))
-            }
-            Divider()
-            SettingsGroup(title = {
-                SettingsTitleTextComponent(text = stringResource(id = R.string.general_settings))
-            }) {
-                if (!isOrWasThankYouInstalled) {
-                    SettingsPreferenceComponent(preferenceTitle = stringResource(id = R.string.purchase_simple_thank_you), doOnPreferenceClick = onThankYou)
-                }
-                if (isUseEnglishEnabled) {
-                    SettingsCheckBoxComponent(
-                        title = stringResource(id = R.string.use_english_language),
-                        initialValue = isUseEnglishChecked,
-                        onChange = onUseEnglishPress
-                    )
-                }
-                if (isTiramisuPlus()) {
+            Column(
+                Modifier
+                    .matchParentSize()
+                    .verticalScroll(rememberScrollState())
+            ) {
+                SettingsGroup(title = {
+                    SettingsTitleTextComponent(text = stringResource(id = R.string.color_customization))
+                }) {
                     SettingsPreferenceComponent(
-                        preferenceTitle = stringResource(id = R.string.language),
-                        preferenceSummary = displayLanguage,
-                        doOnPreferenceClick = onSetupLanguagePress
+                        preferenceTitle = stringResource(id = R.string.customize_colors),
+                        doOnPreferenceClick = customizeColors,
+                        isPreferenceEnabled = isOrWasThankYouInstalled,
+                        preferenceSummary = lockedCustomizeColorText
+                    )
+                    SettingsPreferenceComponent(
+                        preferenceTitle = stringResource(id = R.string.customize_widget_colors),
+                        doOnPreferenceClick = customizeWidgetColors
+                    )
+                    Spacer(modifier = Modifier.padding(bottom = 16.dp))
+                }
+                Divider()
+                SettingsGroup(title = {
+                    SettingsTitleTextComponent(text = stringResource(id = R.string.general_settings))
+                }) {
+                    if (!isOrWasThankYouInstalled) {
+                        SettingsPreferenceComponent(preferenceTitle = stringResource(id = R.string.purchase_simple_thank_you), doOnPreferenceClick = onThankYou)
+                    }
+                    if (isUseEnglishEnabled) {
+                        SettingsCheckBoxComponent(
+                            title = stringResource(id = R.string.use_english_language),
+                            initialValue = isUseEnglishChecked,
+                            onChange = onUseEnglishPress
+                        )
+                    }
+                    if (isTiramisuPlus()) {
+                        SettingsPreferenceComponent(
+                            preferenceTitle = stringResource(id = R.string.language),
+                            preferenceSummary = displayLanguage,
+                            doOnPreferenceClick = onSetupLanguagePress
+                        )
+                    }
+                    SettingsCheckBoxComponent(
+                        title = stringResource(id = R.string.vibrate_on_button_press),
+                        initialValue = vibrateOnButtonPressFlow,
+                        onChange = onVibrateOnButtonPressFlow
+                    )
+                    SettingsCheckBoxComponent(
+                        title = stringResource(id = R.string.prevent_phone_from_sleeping),
+                        initialValue = preventPhoneFromSleeping,
+                        onChange = onPreventPhoneFromSleeping
+                    )
+                    SettingsCheckBoxComponent(
+                        title = stringResource(id = com.simplemobiletools.calculator.R.string.use_comma_as_decimal_mark),
+                        initialValue = useCommaAsDecimalMarkFlow,
+                        onChange = onUseCommaAsDecimalMarkFlow
                     )
                 }
-                SettingsCheckBoxComponent(
-                    title = stringResource(id = R.string.vibrate_on_button_press),
-                    initialValue = vibrateOnButtonPressFlow,
-                    onChange = onVibrateOnButtonPressFlow
-                )
-                SettingsCheckBoxComponent(
-                    title = stringResource(id = R.string.prevent_phone_from_sleeping),
-                    initialValue = preventPhoneFromSleeping,
-                    onChange = onPreventPhoneFromSleeping
-                )
-                SettingsCheckBoxComponent(
-                    title = stringResource(id = com.simplemobiletools.calculator.R.string.use_comma_as_decimal_mark),
-                    initialValue = useCommaAsDecimalMarkFlow,
-                    onChange = onUseCommaAsDecimalMarkFlow
-                )
             }
         }
     }
@@ -173,7 +180,8 @@ private fun SettingsScreenPreview() {
             isUseEnglishEnabled = false,
             isUseEnglishChecked = false,
             onUseEnglishPress = {},
-            onSetupLanguagePress = {}, useCommaAsDecimalMarkFlow = false, onUseCommaAsDecimalMarkFlow = {}
+            onSetupLanguagePress = {}, useCommaAsDecimalMarkFlow = false, onUseCommaAsDecimalMarkFlow = {},
+            lockedCustomizeColorText = null
         )
     }
 }

app/src/main/kotlin/com/simplemobiletools/calculator/compose/settings/SettingsCheckBoxComponent.kt

@@ -1,6 +1,8 @@
 package com.simplemobiletools.calculator.compose.settings
 
 import androidx.compose.animation.AnimatedVisibility
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
@@ -8,6 +10,7 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.Checkbox
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
@@ -26,10 +29,12 @@ fun SettingsCheckBoxComponent(
     isPreferenceEnabled: Boolean = true,
     onChange: ((Boolean) -> Unit)? = null,
 ) {
+    val interactionSource = remember { MutableInteractionSource() }
     Row(
         verticalAlignment = Alignment.CenterVertically,
         modifier = modifier
             .fillMaxWidth()
+            .clickable(indication = null, interactionSource = interactionSource, onClick = { onChange?.invoke(!initialValue) })
             .padding(vertical = 14.dp, horizontal = 16.dp),
     ) {
         Column(
@@ -40,7 +45,6 @@ fun SettingsCheckBoxComponent(
                     .fillMaxWidth()
                     .padding(end = 16.dp),
                 text = title,
-                fontSize = 16.sp,
                 color = preferenceTitleColor(isEnabled = isPreferenceEnabled),
             )
             AnimatedVisibility(visible = !summary.isNullOrBlank()) {
@@ -50,7 +54,6 @@ fun SettingsCheckBoxComponent(
                         .fillMaxWidth()
                         .padding(vertical = 4.dp)
                         .padding(end = 16.dp),
-                    fontSize = 14.sp,
                     color = preferenceSummaryColor(isEnabled = isPreferenceEnabled),
                 )
             }

app/src/main/kotlin/com/simplemobiletools/calculator/compose/settings/SettingsPreferenceComponent.kt

@@ -39,7 +39,6 @@ fun SettingsPreferenceComponent(
         Text(
             text = preferenceTitle,
             modifier = Modifier.fillMaxWidth(),
-            fontSize = 16.sp,
             color = preferenceTitleColor(isEnabled = isPreferenceEnabled),
         )
         AnimatedVisibility(visible = !preferenceSummary.isNullOrBlank()) {
@@ -48,7 +47,6 @@ fun SettingsPreferenceComponent(
                 modifier = Modifier
                     .fillMaxWidth()
                     .padding(vertical = 4.dp),
-                fontSize = 14.sp,
                 color = preferenceSummaryColor(isEnabled = isPreferenceEnabled),
             )
         }

app/src/main/kotlin/com/simplemobiletools/calculator/compose/theme/Theme.kt

@@ -17,6 +17,7 @@ import androidx.compose.ui.graphics.luminance
 import androidx.compose.ui.graphics.toArgb
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.platform.LocalLifecycleOwner
+import androidx.compose.ui.platform.LocalView
 import androidx.lifecycle.Lifecycle
 import androidx.lifecycle.LifecycleEventObserver
 import androidx.lifecycle.LifecycleOwner
@@ -148,52 +149,55 @@ fun Color.isNotLitWell() = luminance() < LUMINANCE_THRESHOLD
 
 
 @Composable
-fun Theme(
+private fun Theme(
     useTransparentNavigation: Boolean = true,
-    theme: Theme,
+    theme: Theme = systemDefaultMaterialYou(),
     content: @Composable () -> Unit,
 ) {
+    val view = LocalView.current
     val context = LocalContext.current
     val systemUiController = rememberSystemUiController()
-    val window = context.getActivity().window
-    val baseConfig = remember { context.config }
 
-    val colorScheme = when {
-        theme is Theme.SystemDefaultMaterialYou && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {
-            if (isSystemInDarkTheme()) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
+    val colorScheme = if (!view.isInEditMode){
+        val baseConfig = remember { context.config }
+
+        val colorScheme = when {
+            theme is Theme.SystemDefaultMaterialYou && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {
+                if (isSystemInDarkTheme()) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
+            }
+
+            theme is Theme.Custom || theme is Theme.Dark -> darkColorScheme(
+                primary = theme.primaryColor, surface = theme.backgroundColor,
+                onSurface = theme.textColor
+            )
+
+            theme is Theme.White -> darkColorScheme(
+                primary = Color(theme.accentColor),
+                surface = theme.backgroundColor,
+                tertiary = theme.primaryColor,
+                onSurface = theme.textColor
+            )
+
+            theme is Theme.BlackAndWhite -> darkColorScheme(
+                primary = Color(theme.accentColor),
+                surface = theme.backgroundColor,
+                tertiary = theme.primaryColor,
+                onSurface = theme.textColor
+            )
+
+            else -> darkColorScheme
         }
 
-        theme is Theme.Custom || theme is Theme.Dark -> darkColorScheme(
-            primary = theme.primaryColor, surface = theme.backgroundColor,
-            onSurface = theme.textColor
-        )
+        LaunchedEffect(Unit) {
+            /* if (context.navigationBarHeight > 0 || context.isUsingGestureNavigation() && useTransparentNavigation) {
+                 systemUiController.isNavigationBarVisible = false
+             } else {
+                 systemUiController.isNavigationBarVisible = true
+             }*/
 
-        theme is Theme.White -> darkColorScheme(
-            primary = Color(theme.accentColor),
-            surface = theme.backgroundColor,
-            tertiary = theme.primaryColor,
-            onSurface = theme.textColor
-        )
-
-        theme is Theme.BlackAndWhite -> darkColorScheme(
-            primary = Color(theme.accentColor),
-            surface = theme.backgroundColor,
-            tertiary = theme.primaryColor,
-            onSurface = theme.textColor
-        )
-
-        else -> darkColorScheme
-    }
-    LaunchedEffect(Unit) {
-        /* if (context.navigationBarHeight > 0 || context.isUsingGestureNavigation() && useTransparentNavigation) {
-             systemUiController.isNavigationBarVisible = false
-         } else {
-             systemUiController.isNavigationBarVisible = true
-         }*/
-
-        /* if (context.navigationBarHeight > 0 || context.isUsingGestureNavigation()) {
-             window.decorView.systemUiVisibility = window.decorView.systemUiVisibility.addBit(View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION)
-             *//* updateTopBottomInsets(statusBarHeight, navigationBarHeight)
+            /* if (context.navigationBarHeight > 0 || context.isUsingGestureNavigation()) {
+                 window.decorView.systemUiVisibility = window.decorView.systemUiVisibility.addBit(View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION)
+                 *//* updateTopBottomInsets(statusBarHeight, navigationBarHeight)
              // Don't touch this. Window Inset API often has a domino effect and things will most likely break.
              onApplyWindowInsets {
                  val insets = it.getInsets(WindowInsetsCompat.Type.systemBars() or WindowInsetsCompat.Type.ime())
@@ -203,25 +207,26 @@ fun Theme(
             window.decorView.systemUiVisibility = window.decorView.systemUiVisibility.removeBit(View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION)
             //updateTopBottomInsets(0, 0)
         }*/
-        systemUiController.setStatusBarColor(
-            color = colorScheme.surface
-        )
-        context.getActivity().setTaskDescription(ActivityManager.TaskDescription(null, null, colorScheme.surface.toArgb()))
-        systemUiController.setNavigationBarColor(Color(theme.backgroundColor.toArgb().adjustAlpha(HIGHER_ALPHA)))
-    }
+            systemUiController.setStatusBarColor(
+                color = colorScheme.surface
+            )
+            context.getActivity().setTaskDescription(ActivityManager.TaskDescription(null, null, colorScheme.surface.toArgb()))
+            systemUiController.setNavigationBarColor(Color(theme.backgroundColor.toArgb().adjustAlpha(HIGHER_ALPHA)))
+        }
 
-    SideEffect {
-        updateRecentsAppIcon(baseConfig, context)
-    }
+        SideEffect {
+            updateRecentsAppIcon(baseConfig, context)
+        }
 
-    CompositionLocalProvider(
-        LocalOverscrollConfiguration provides null,
-    ) {
-        MaterialTheme(
-            colorScheme = colorScheme,
-            content = content,
-        )
-    }
+        colorScheme
+
+    } else darkColorScheme
+
+
+    MaterialTheme(
+        colorScheme = colorScheme,
+        content = content,
+    )
 }
 
 private fun Context.getAppIconIds(): List<Int> = getActivity().getAppIconIds()
@@ -262,11 +267,20 @@ fun AppThemeSurface(
     modifier: Modifier = Modifier,
     content: @Composable () -> Unit,
 ) {
+    val view = LocalView.current
+
     val context = LocalContext.current
     val materialYouTheme = systemDefaultMaterialYou()
-    var currentTheme by remember { mutableStateOf(getTheme(context = context, materialYouTheme = materialYouTheme)) }
+    var currentTheme by remember {
+        mutableStateOf(
+            if (view.isInEditMode) materialYouTheme else getTheme(
+                context = context,
+                materialYouTheme = materialYouTheme
+            )
+        )
+    }
     OnLifecycleEvent { event ->
-        if (event == Lifecycle.Event.ON_RESUME) {
+        if (event == Lifecycle.Event.ON_START && !view.isInEditMode) {
             currentTheme = getTheme(context = context, materialYouTheme = materialYouTheme)
         }
     }