Add theme toggle in settings

msasikanth · Sep 18, 2024 · 9180b09 · 9180b09
1 parent 8d66b29
commit 9180b09
Show file tree

Hide file tree

Showing 8 changed files with 69 additions and 0 deletions.
diff --git a/...trings/src/commonMain/kotlin/dev/sasikanth/rss/reader/resources/strings/DeTwineStrings.kt b/...trings/src/commonMain/kotlin/dev/sasikanth/rss/reader/resources/strings/DeTwineStrings.kt
@@ -55,6 +55,7 @@ val DeTwineStrings =
     settingsHeaderBehaviour = "Verhalten",
     settingsHeaderFeedback = "Feedback und Fehlerberichte",
     settingsHeaderOpml = "OPML",
+    settingsHeaderTheme = "Theme",
     settingsBrowserTypeTitle = "Verwende den In-App-Browser",
     settingsBrowserTypeSubtitle =
       "Wenn diese Option deaktiviert ist, werden Links in Ihrem Standardbrowser geöffnet.",
@@ -82,6 +83,9 @@ val DeTwineStrings =
     settingsShowReaderViewTitle = "Aktiviere Leseansicht",
     settingsShowReaderViewSubtitle =
       "Artikel werden in einer vereinfachten, leicht lesbaren Ansicht angezeigt.",
+    settingsThemeAuto = "Auto",
+    settingsThemeLight = "Light",
+    settingsThemeDark = "Dark",
     feeds = "Feeds",
     editFeeds = "Feeds bearbeiten",
     comments = "Kommentare",

diff --git a/...trings/src/commonMain/kotlin/dev/sasikanth/rss/reader/resources/strings/EnTwineStrings.kt b/...trings/src/commonMain/kotlin/dev/sasikanth/rss/reader/resources/strings/EnTwineStrings.kt
@@ -66,6 +66,7 @@ val EnTwineStrings =
     settingsHeaderBehaviour = "Behavior",
     settingsHeaderFeedback = "Feedback & bug reports",
     settingsHeaderOpml = "OPML",
+    settingsHeaderTheme = "Theme",
     settingsBrowserTypeTitle = "Use in-app browser",
     settingsBrowserTypeSubtitle = "When turned off, links will open in your default browser.",
     settingsEnableBlurTitle = "Enable blur in homepage",
@@ -90,6 +91,9 @@ val EnTwineStrings =
     settingsPostsDeletionPeriodOneYear = "1 year",
     settingsShowReaderViewTitle = "Enable reader view",
     settingsShowReaderViewSubtitle = "Articles will be shown in a simplified, easy-to-read view",
+    settingsThemeAuto = "Auto",
+    settingsThemeLight = "Light",
+    settingsThemeDark = "Dark",
     feeds = "Feeds",
     editFeeds = "Edit feeds",
     comments = "Comments",

diff --git a/...trings/src/commonMain/kotlin/dev/sasikanth/rss/reader/resources/strings/TrTwineStrings.kt b/...trings/src/commonMain/kotlin/dev/sasikanth/rss/reader/resources/strings/TrTwineStrings.kt
@@ -52,6 +52,7 @@ val TrTwineStrings =
     settingsHeaderBehaviour = "Davranış",
     settingsHeaderFeedback = "Geri bildirim & Hata raporları",
     settingsHeaderOpml = "OPML",
+    settingsHeaderTheme = "Theme",
     settingsBrowserTypeTitle = "Uygulama içi tarayıcıyı kullan",
     settingsBrowserTypeSubtitle =
       "Kapatıldığında, bağlantılar varsayılan tarayıcınızda açılacaktır.",
@@ -78,6 +79,9 @@ val TrTwineStrings =
     settingsShowReaderViewTitle = "Okuyucu görünümünü etkinleştir",
     settingsShowReaderViewSubtitle =
       "Gönderiler basitleştirilmiş, okunması kolay bir görünümde gösterilecek.",
+    settingsThemeAuto = "Auto",
+    settingsThemeLight = "Light",
+    settingsThemeDark = "Dark",
     feeds = "İçerikler",
     editFeeds = "İçerikleri düzenle",
     comments = "Yorumlar",

diff --git a/.../strings/src/commonMain/kotlin/dev/sasikanth/rss/reader/resources/strings/TwineStrings.kt b/.../strings/src/commonMain/kotlin/dev/sasikanth/rss/reader/resources/strings/TwineStrings.kt
@@ -55,6 +55,7 @@ data class TwineStrings(
   val settingsHeaderBehaviour: String,
   val settingsHeaderOpml: String,
   val settingsHeaderFeedback: String,
+  val settingsHeaderTheme: String,
   val settingsBrowserTypeTitle: String,
   val settingsBrowserTypeSubtitle: String,
   val settingsEnableBlurTitle: String,
@@ -78,6 +79,9 @@ data class TwineStrings(
   val settingsPostsDeletionPeriodOneYear: String,
   val settingsShowReaderViewTitle: String,
   val settingsShowReaderViewSubtitle: String,
+  val settingsThemeAuto: String,
+  val settingsThemeLight: String,
+  val settingsThemeDark: String,
   val feeds: String,
   val editFeeds: String,
   val comments: String,

diff --git a/...trings/src/commonMain/kotlin/dev/sasikanth/rss/reader/resources/strings/ZhTwineStrings.kt b/...trings/src/commonMain/kotlin/dev/sasikanth/rss/reader/resources/strings/ZhTwineStrings.kt
@@ -49,6 +49,7 @@ val ZhTwineStrings =
     settingsHeaderBehaviour = "行为",
     settingsHeaderFeedback = "反馈与错误报告",
     settingsHeaderOpml = "OPML",
+    settingsHeaderTheme = "Theme",
     settingsBrowserTypeTitle = "使用内置浏览器",
     settingsBrowserTypeSubtitle = "如果禁用，链接将在默认浏览器中打开。",
     settingsEnableBlurTitle = "在主页启用模糊效果",
@@ -72,6 +73,9 @@ val ZhTwineStrings =
     settingsPostsDeletionPeriodOneYear = "一年",
     settingsShowReaderViewTitle = "启用阅读视图",
     settingsShowReaderViewSubtitle = "文章将以简化、易读的视图显示",
+    settingsThemeAuto = "Auto",
+    settingsThemeLight = "Light",
+    settingsThemeDark = "Dark",
     feeds = "订阅",
     editFeeds = "编辑订阅",
     comments = "评论",

diff --git a/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/settings/SettingsEvent.kt b/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/settings/SettingsEvent.kt
@@ -15,6 +15,7 @@
  */
 package dev.sasikanth.rss.reader.settings
 
+import dev.sasikanth.rss.reader.data.repository.AppThemeMode
 import dev.sasikanth.rss.reader.data.repository.BrowserType
 import dev.sasikanth.rss.reader.data.repository.Period
 
@@ -39,4 +40,6 @@ sealed interface SettingsEvent {
   data object CancelOpmlImportOrExport : SettingsEvent
 
   data class PostsDeletionPeriodChanged(val newPeriod: Period) : SettingsEvent
+
+  data class OnAppThemeModeChanged(val appThemeMode: AppThemeMode) : SettingsEvent
 }
diff --git a/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/settings/SettingsPresenter.kt b/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/settings/SettingsPresenter.kt
@@ -166,9 +166,14 @@ class SettingsPresenter(
         SettingsEvent.ExportOpmlClicked -> exportOpmlClicked()
         SettingsEvent.CancelOpmlImportOrExport -> cancelOpmlImportOrExport()
         is SettingsEvent.PostsDeletionPeriodChanged -> postsDeletionPeriodChanged(event.newPeriod)
+        is SettingsEvent.OnAppThemeModeChanged -> onAppThemeModeChanged(event.appThemeMode)
       }
     }
 
+    private fun onAppThemeModeChanged(appThemeMode: AppThemeMode) {
+      coroutineScope.launch { settingsRepository.updateAppTheme(appThemeMode) }
+    }
+
     private fun toggleShowReaderView(value: Boolean) {
       coroutineScope.launch { settingsRepository.toggleShowReaderView(value) }
     }

diff --git a/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/settings/ui/SettingsScreen.kt b/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/settings/ui/SettingsScreen.kt
@@ -69,6 +69,8 @@ import dev.sasikanth.rss.reader.components.DropdownMenuItem
 import dev.sasikanth.rss.reader.components.OutlinedButton
 import dev.sasikanth.rss.reader.components.SubHeader
 import dev.sasikanth.rss.reader.components.Switch
+import dev.sasikanth.rss.reader.components.ToggleableButtonGroup
+import dev.sasikanth.rss.reader.components.ToggleableButtonItem
 import dev.sasikanth.rss.reader.components.image.AsyncImage
 import dev.sasikanth.rss.reader.data.repository.AppThemeMode
 import dev.sasikanth.rss.reader.data.repository.BrowserType
@@ -142,6 +144,45 @@ internal fun SettingsScreen(
               bottom = padding.calculateBottomPadding() + 80.dp
             ),
         ) {
+          item {
+            SubHeader(
+              text = LocalStrings.current.settingsHeaderTheme,
+            )
+          }
+
+          item {
+            val appThemeMode = state.appThemeMode
+            ToggleableButtonGroup(
+              modifier =
+                Modifier.fillMaxWidth().padding(horizontal = 24.dp).padding(bottom = 24.dp),
+              items =
+                listOf(
+                  ToggleableButtonItem(
+                    label = LocalStrings.current.settingsThemeAuto,
+                    isSelected = appThemeMode == AppThemeMode.Auto,
+                    identifier = AppThemeMode.Auto,
+                  ),
+                  ToggleableButtonItem(
+                    label = LocalStrings.current.settingsThemeLight,
+                    isSelected = appThemeMode == AppThemeMode.Light,
+                    identifier = AppThemeMode.Light
+                  ),
+                  ToggleableButtonItem(
+                    label = LocalStrings.current.settingsThemeDark,
+                    isSelected = appThemeMode == AppThemeMode.Dark,
+                    identifier = AppThemeMode.Dark
+                  )
+                ),
+              onItemSelected = {
+                settingsPresenter.dispatch(
+                  SettingsEvent.OnAppThemeModeChanged(it.identifier as AppThemeMode)
+                )
+              }
+            )
+          }
+
+          item { Divider() }
+
           item {
             SubHeader(
               text = LocalStrings.current.settingsHeaderBehaviour,