Dark Theme background color (#151)

ShiftHackZ · web-flow · commit 15df32c20665 · 2024-03-10T14:19:36.000+02:00
diff --git a/app/build.gradle b/app/build.gradle
@@ -54,6 +54,12 @@ android {
 
     flavorDimensions = ["type"]
     productFlavors {
+        dev {
+            dimension "type"
+            applicationIdSuffix = ".dev"
+            resValue "string", "app_name", "SDAI Dev"
+            buildConfigField "String", "BUILD_FLAVOR_TYPE", "\"FOSS\""
+        }
         foss {
             dimension "type"
             applicationIdSuffix = ".foss"
diff --git a/data/src/main/java/com/shifthackz/aisdv1/data/preference/PreferenceManagerImpl.kt b/data/src/main/java/com/shifthackz/aisdv1/data/preference/PreferenceManagerImpl.kt
@@ -4,6 +4,7 @@ import android.content.SharedPreferences
 import com.shifthackz.aisdv1.core.common.extensions.fixUrlSlashes
 import com.shifthackz.aisdv1.core.common.extensions.shouldUseNewMediaStore
 import com.shifthackz.aisdv1.domain.entity.ColorToken
+import com.shifthackz.aisdv1.domain.entity.DarkThemeToken
 import com.shifthackz.aisdv1.domain.entity.HuggingFaceModel
 import com.shifthackz.aisdv1.domain.entity.ServerSource
 import com.shifthackz.aisdv1.domain.entity.Settings
@@ -150,13 +151,21 @@ class PreferenceManagerImpl(
             .putBoolean(KEY_DESIGN_DARK_THEME, value)
             .apply()
             .also { onPreferencesChanged() }
+
     override var designColorToken: String
         get() = preferences.getString(KEY_DESIGN_COLOR_TOKEN, "${ColorToken.MAUVE}") ?: "${ColorToken.MAUVE}"
         set(value) = preferences.edit()
             .putString(KEY_DESIGN_COLOR_TOKEN, value)
             .apply()
             .also { onPreferencesChanged() }
 
+    override var designDarkThemeToken: String
+        get() =  preferences.getString(KEY_DESIGN_DARK_TOKEN, "${DarkThemeToken.FRAPPE}") ?: "${DarkThemeToken.FRAPPE}"
+        set(value) = preferences.edit()
+            .putString(KEY_DESIGN_DARK_TOKEN, value)
+            .apply()
+            .also { onPreferencesChanged() }
+
     override fun observe(): Flowable<Settings> = preferencesChangedSubject
         .toFlowable(BackpressureStrategy.LATEST)
         .map {
@@ -175,6 +184,7 @@ class PreferenceManagerImpl(
                 designUseSystemDarkTheme = designUseSystemDarkTheme,
                 designDarkTheme = designDarkTheme,
                 designColorToken = designColorToken,
+                designDarkThemeToken = designDarkThemeToken,
             )
         }
 
@@ -199,6 +209,7 @@ class PreferenceManagerImpl(
         private const val KEY_DESIGN_SYSTEM_DARK_THEME = "key_design_system_dark_theme"
         private const val KEY_DESIGN_DARK_THEME = "key_design_dark_theme"
         private const val KEY_DESIGN_COLOR_TOKEN = "key_design_color_token_theme"
+        private const val KEY_DESIGN_DARK_TOKEN = "key_design_dark_color_token_theme"
         private const val KEY_FORCE_SETUP_AFTER_UPDATE = "force_upd_setup_v0.x.x-v0.5.8"
     }
 }
diff --git a/domain/src/main/java/com/shifthackz/aisdv1/domain/entity/DarkThemeToken.kt b/domain/src/main/java/com/shifthackz/aisdv1/domain/entity/DarkThemeToken.kt
@@ -0,0 +1,9 @@
+package com.shifthackz.aisdv1.domain.entity
+
+enum class DarkThemeToken {
+    FRAPPE, MACCHIATO, MOCHA;
+
+    companion object {
+        fun parse(value: String) = entries.find { "$it" == value } ?: FRAPPE
+    }
+}
diff --git a/domain/src/main/java/com/shifthackz/aisdv1/domain/entity/Settings.kt b/domain/src/main/java/com/shifthackz/aisdv1/domain/entity/Settings.kt
@@ -15,4 +15,5 @@ data class Settings(
     val designUseSystemDarkTheme: Boolean,
     val designDarkTheme: Boolean,
     val designColorToken: String,
+    val designDarkThemeToken: String,
 )
diff --git a/domain/src/main/java/com/shifthackz/aisdv1/domain/preference/PreferenceManager.kt b/domain/src/main/java/com/shifthackz/aisdv1/domain/preference/PreferenceManager.kt
@@ -24,6 +24,7 @@ interface PreferenceManager {
     var designUseSystemDarkTheme: Boolean
     var designDarkTheme: Boolean
     var designColorToken: String
+    var designDarkThemeToken: String
 
     fun observe(): Flowable<Settings>
 }
diff --git a/presentation/src/main/java/com/shifthackz/aisdv1/presentation/screen/settings/SettingsIntent.kt b/presentation/src/main/java/com/shifthackz/aisdv1/presentation/screen/settings/SettingsIntent.kt
@@ -2,6 +2,7 @@ package com.shifthackz.aisdv1.presentation.screen.settings
 
 import com.shifthackz.aisdv1.core.common.links.LinksProvider
 import com.shifthackz.aisdv1.domain.entity.ColorToken
+import com.shifthackz.aisdv1.domain.entity.DarkThemeToken
 import com.shifthackz.android.core.mvi.MviIntent
 import org.koin.core.component.KoinComponent
 import org.koin.core.component.inject
@@ -79,6 +80,8 @@ sealed interface SettingsIntent : MviIntent {
 
     data class NewColorToken(val token: ColorToken) : SettingsIntent
 
+    data class NewDarkThemeToken(val token: DarkThemeToken) : SettingsIntent
+
     data object StoragePermissionGranted : SettingsIntent
 
     data object DismissDialog : SettingsIntent
diff --git a/presentation/src/main/java/com/shifthackz/aisdv1/presentation/screen/settings/SettingsScreen.kt b/presentation/src/main/java/com/shifthackz/aisdv1/presentation/screen/settings/SettingsScreen.kt
@@ -28,6 +28,7 @@ import androidx.compose.material.icons.filled.DarkMode
 import androidx.compose.material.icons.filled.DeleteForever
 import androidx.compose.material.icons.filled.DynamicForm
 import androidx.compose.material.icons.filled.Folder
+import androidx.compose.material.icons.filled.FormatColorFill
 import androidx.compose.material.icons.filled.Gavel
 import androidx.compose.material.icons.filled.InvertColors
 import androidx.compose.material.icons.filled.MonetizationOn
@@ -64,6 +65,7 @@ import com.shifthackz.aisdv1.presentation.theme.isSdAppInDarkTheme
 import com.shifthackz.aisdv1.presentation.utils.PermissionUtil
 import com.shifthackz.aisdv1.presentation.utils.ReportProblemEmailComposer
 import com.shifthackz.aisdv1.presentation.widget.color.AccentColorSelector
+import com.shifthackz.aisdv1.presentation.widget.color.DarkThemeColorSelector
 import com.shifthackz.aisdv1.presentation.widget.item.SettingsHeader
 import com.shifthackz.aisdv1.presentation.widget.item.SettingsItem
 import com.shifthackz.aisdv1.presentation.widget.item.SettingsItemContent
@@ -144,11 +146,17 @@ private fun ContentSettingsState(
     state: SettingsState,
     processIntent: (SettingsIntent) -> Unit = {},
 ) {
+    val isDark = isSdAppInDarkTheme()
+    val palette = colorTokenPalette(
+        isDark = isDark,
+        darkThemeToken = state.darkThemeToken,
+    )
     val systemUiController = rememberSystemUiController()
     val navBarColor = MaterialTheme.colorScheme.surface
     LaunchedEffect(
-        state.useSystemDarkTheme,
+        isDark,
         state.darkTheme,
+        state.darkThemeToken,
     ) {
         systemUiController.setNavigationBarColor(navBarColor)
     }
@@ -389,9 +397,31 @@ private fun ContentSettingsState(
                 },
             )
         }
+        AnimatedVisibility(visible = !state.loading && isDark) {
+            Column(
+                modifier = itemModifier
+                    .clip(RoundedCornerShape(16.dp))
+                    .background(MaterialTheme.colorScheme.surfaceTint.copy(alpha = 0.8f))
+                    .defaultMinSize(minHeight = 50.dp),
+            ) {
+                Spacer(modifier = Modifier.height(16.dp))
+                SettingsItemContent(
+                    text = R.string.settings_item_lf_dark_theme_color.asUiText(),
+                    icon = Icons.Default.FormatColorFill,
+                )
+                Spacer(modifier = Modifier.height(16.dp))
+                DarkThemeColorSelector(
+                    modifier = Modifier.padding(horizontal = 10.dp),
+                    selectedToken = state.darkThemeToken,
+                    colorToken = state.colorToken,
+                    onSelected = { _, token ->
+                        processIntent(SettingsIntent.NewDarkThemeToken(token))
+                    }
+                )
+                Spacer(modifier = Modifier.height(14.dp))
+            }
+        }
         AnimatedVisibility(visible = !state.loading) {
-            val isDark = isSdAppInDarkTheme()
-            val palette = colorTokenPalette(isDark = isDark)
             Column(
                 modifier = itemModifier
                     .clip(RoundedCornerShape(16.dp))
diff --git a/presentation/src/main/java/com/shifthackz/aisdv1/presentation/screen/settings/SettingsState.kt b/presentation/src/main/java/com/shifthackz/aisdv1/presentation/screen/settings/SettingsState.kt
@@ -2,6 +2,7 @@ package com.shifthackz.aisdv1.presentation.screen.settings
 
 import androidx.compose.runtime.Immutable
 import com.shifthackz.aisdv1.domain.entity.ColorToken
+import com.shifthackz.aisdv1.domain.entity.DarkThemeToken
 import com.shifthackz.aisdv1.domain.entity.ServerSource
 import com.shifthackz.aisdv1.presentation.model.Modal
 import com.shifthackz.android.core.mvi.MviState
@@ -23,6 +24,7 @@ data class SettingsState(
     val useSystemDarkTheme: Boolean = false,
     val darkTheme: Boolean = false,
     val colorToken: ColorToken = ColorToken.MAUVE,
+    val darkThemeToken: DarkThemeToken = DarkThemeToken.FRAPPE,
     val appVersion: String = "",
     val showLocalUseNNAPI: Boolean = false,
     val showSdModelSelector: Boolean = false,
diff --git a/presentation/src/main/java/com/shifthackz/aisdv1/presentation/screen/settings/SettingsViewModel.kt b/presentation/src/main/java/com/shifthackz/aisdv1/presentation/screen/settings/SettingsViewModel.kt
@@ -8,6 +8,7 @@ import com.shifthackz.aisdv1.core.common.schedulers.SchedulersProvider
 import com.shifthackz.aisdv1.core.common.schedulers.subscribeOnMainThread
 import com.shifthackz.aisdv1.core.viewmodel.MviRxViewModel
 import com.shifthackz.aisdv1.domain.entity.ColorToken
+import com.shifthackz.aisdv1.domain.entity.DarkThemeToken
 import com.shifthackz.aisdv1.domain.entity.ServerSource
 import com.shifthackz.aisdv1.domain.preference.PreferenceManager
 import com.shifthackz.aisdv1.domain.usecase.caching.ClearAppCacheUseCase
@@ -62,6 +63,7 @@ class SettingsViewModel(
                         useSystemDarkTheme = settings.designUseSystemDarkTheme,
                         darkTheme = settings.designDarkTheme,
                         colorToken = ColorToken.parse(settings.designColorToken),
+                        darkThemeToken = DarkThemeToken.parse(settings.designDarkThemeToken),
                         appVersion = version,
                         showLocalUseNNAPI = settings.source == ServerSource.LOCAL,
                         showSdModelSelector = settings.source == ServerSource.AUTOMATIC1111,
@@ -148,6 +150,10 @@ class SettingsViewModel(
                 preferenceManager.designColorToken = "${intent.token}"
             }
 
+            is SettingsIntent.NewDarkThemeToken -> {
+                preferenceManager.designDarkThemeToken = "${intent.token}"
+            }
+
             SettingsIntent.Action.PickLanguage -> updateState {
                 it.copy(screenModal = Modal.Language)
             }
diff --git a/presentation/src/main/java/com/shifthackz/aisdv1/presentation/theme/ColorTheme.kt b/presentation/src/main/java/com/shifthackz/aisdv1/presentation/theme/ColorTheme.kt
@@ -4,6 +4,7 @@ import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.graphics.Color
 import com.shifthackz.aisdv1.domain.entity.ColorToken
+import com.shifthackz.aisdv1.domain.entity.DarkThemeToken
 import com.shifthackz.aisdv1.domain.preference.PreferenceManager
 import com.shifthackz.catppuccin.compose.CatppuccinMaterial
 import com.shifthackz.catppuccin.palette.Catppuccin
@@ -31,14 +32,27 @@ fun isSdAppInDarkTheme(): Boolean {
 @Composable
 fun colorTokenPalette(
     token: ColorToken = ColorToken.MAUVE,
+    darkThemeToken: DarkThemeToken = DarkThemeToken.FRAPPE,
     isDark: Boolean,
 ): CatppuccinPalette {
     return if (isDark) {
-        CatppuccinMaterial.Frappe(
-            primary = token.toColor(Catppuccin.Frappe),
-            secondary = token.toColor(Catppuccin.Frappe).copy(alpha = 0.5f),
-            tertiary = token.toColor(Catppuccin.Frappe).copy(alpha = 0.5f),
-        )
+        when (darkThemeToken) {
+            DarkThemeToken.FRAPPE -> CatppuccinMaterial.Frappe(
+                primary = token.toColor(Catppuccin.Frappe),
+                secondary = token.toColor(Catppuccin.Frappe).copy(alpha = 0.5f),
+                tertiary = token.toColor(Catppuccin.Frappe).copy(alpha = 0.5f),
+            )
+            DarkThemeToken.MACCHIATO -> CatppuccinMaterial.Macchiato(
+                primary = token.toColor(Catppuccin.Macchiato),
+                secondary = token.toColor(Catppuccin.Macchiato).copy(alpha = 0.5f),
+                tertiary = token.toColor(Catppuccin.Macchiato).copy(alpha = 0.5f),
+            )
+            DarkThemeToken.MOCHA -> CatppuccinMaterial.Mocha(
+                primary = token.toColor(Catppuccin.Mocha),
+                secondary = token.toColor(Catppuccin.Mocha).copy(alpha = 0.5f),
+                tertiary = token.toColor(Catppuccin.Mocha).copy(alpha = 0.5f),
+            )
+        }
     } else {
         CatppuccinMaterial.Latte(
             primary = token.toColor(Catppuccin.Latte),
diff --git a/presentation/src/main/java/com/shifthackz/aisdv1/presentation/theme/global/AiSdAppTheme.kt b/presentation/src/main/java/com/shifthackz/aisdv1/presentation/theme/global/AiSdAppTheme.kt
@@ -39,6 +39,7 @@ fun AiSdAppTheme(
             CatppuccinTheme.Palette(
                 palette = colorTokenPalette(
                     token = state.colorToken,
+                    darkThemeToken = state.darkThemeToken,
                     isDark = isDark
                 ),
                 content = content,
diff --git a/presentation/src/main/java/com/shifthackz/aisdv1/presentation/theme/global/AiSdAppThemeState.kt b/presentation/src/main/java/com/shifthackz/aisdv1/presentation/theme/global/AiSdAppThemeState.kt
@@ -2,6 +2,7 @@ package com.shifthackz.aisdv1.presentation.theme.global
 
 import androidx.compose.runtime.Immutable
 import com.shifthackz.aisdv1.domain.entity.ColorToken
+import com.shifthackz.aisdv1.domain.entity.DarkThemeToken
 import com.shifthackz.android.core.mvi.MviState
 
 @Immutable
@@ -10,4 +11,5 @@ data class AiSdAppThemeState(
     val systemDarkTheme: Boolean = true,
     val darkTheme: Boolean = true,
     val colorToken: ColorToken = ColorToken.MAUVE,
+    val darkThemeToken: DarkThemeToken = DarkThemeToken.FRAPPE,
 ) : MviState
diff --git a/presentation/src/main/java/com/shifthackz/aisdv1/presentation/theme/global/AiSdAppThemeViewModel.kt b/presentation/src/main/java/com/shifthackz/aisdv1/presentation/theme/global/AiSdAppThemeViewModel.kt
@@ -6,6 +6,7 @@ import com.shifthackz.aisdv1.core.common.schedulers.SchedulersProvider
 import com.shifthackz.aisdv1.core.common.schedulers.subscribeOnMainThread
 import com.shifthackz.aisdv1.core.viewmodel.MviRxViewModel
 import com.shifthackz.aisdv1.domain.entity.ColorToken
+import com.shifthackz.aisdv1.domain.entity.DarkThemeToken
 import com.shifthackz.aisdv1.domain.preference.PreferenceManager
 import com.shifthackz.android.core.mvi.EmptyEffect
 import com.shifthackz.android.core.mvi.EmptyIntent
@@ -28,6 +29,7 @@ class AiSdAppThemeViewModel(
                         systemDarkTheme = settings.designUseSystemDarkTheme,
                         darkTheme = settings.designDarkTheme,
                         colorToken = ColorToken.parse(settings.designColorToken),
+                        darkThemeToken = DarkThemeToken.parse(settings.designDarkThemeToken),
                     )
                 }
             }
diff --git a/presentation/src/main/java/com/shifthackz/aisdv1/presentation/widget/color/AccentColorSelector.kt b/presentation/src/main/java/com/shifthackz/aisdv1/presentation/widget/color/AccentColorSelector.kt
@@ -1,21 +1,13 @@
 package com.shifthackz.aisdv1.presentation.widget.color
 
-import androidx.compose.foundation.background
-import androidx.compose.foundation.clickable
-import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Check
-import androidx.compose.material3.Icon
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
@@ -162,40 +154,3 @@ fun AccentColorSelector(
         }
     }
 }
-
-@Composable
-fun ColorComposable(
-    modifier: Modifier = Modifier,
-    palette: CatppuccinPalette,
-    selectedToken: ColorToken,
-    token: ColorToken,
-    color: Color,
-    onClick: (Color, ColorToken) -> Unit,
-) {
-    val selected = token == selectedToken
-    Box(
-        modifier = modifier
-            .background(
-                color = if (selected) color.copy(alpha = 0.4f) else Color.Transparent,
-                shape = CircleShape,
-            )
-            .clip(CircleShape)
-            .clickable { onClick(color, token) },
-        contentAlignment = Alignment.Center,
-    ) {
-        Box(
-            modifier = Modifier
-                .padding(4.dp)
-                .size(100.dp)
-                .background(color = color, shape = CircleShape)
-                .clip(CircleShape)
-        )
-        if (selected) {
-            Icon(
-                imageVector = Icons.Default.Check,
-                contentDescription = null,
-                tint = palette.Base,
-            )
-        }
-    }
-}
diff --git a/presentation/src/main/java/com/shifthackz/aisdv1/presentation/widget/color/ColorComposable.kt b/presentation/src/main/java/com/shifthackz/aisdv1/presentation/widget/color/ColorComposable.kt
diff --git a/presentation/src/main/java/com/shifthackz/aisdv1/presentation/widget/color/DarkThemeColorSelector.kt b/presentation/src/main/java/com/shifthackz/aisdv1/presentation/widget/color/DarkThemeColorSelector.kt
diff --git a/presentation/src/main/res/values-ru/strings.xml b/presentation/src/main/res/values-ru/strings.xml
diff --git a/presentation/src/main/res/values-tr/strings.xml b/presentation/src/main/res/values-tr/strings.xml
diff --git a/presentation/src/main/res/values-uk/strings.xml b/presentation/src/main/res/values-uk/strings.xml
diff --git a/presentation/src/main/res/values/strings.xml b/presentation/src/main/res/values/strings.xml

Original file line number	Diff line number	Diff line change
`@@ -15,4 +15,5 @@ data class Settings(`
`15`	`15`	`val designUseSystemDarkTheme: Boolean,`
`16`	`16`	`val designDarkTheme: Boolean,`
`17`	`17`	`val designColorToken: String,`
	`18`	`+ val designDarkThemeToken: String,`
`18`	`19`	`)`
Original file line number	Diff line number	Diff line change
`@@ -24,6 +24,7 @@ interface PreferenceManager {`
`24`	`24`	`var designUseSystemDarkTheme: Boolean`
`25`	`25`	`var designDarkTheme: Boolean`
`26`	`26`	`var designColorToken: String`
	`27`	`+ var designDarkThemeToken: String`
`27`	`28`
`28`	`29`	`fun observe(): Flowable<Settings>`
`29`	`30`	`}`