From 004ecc62bba8d35a503de95730d0997d199c5164 Mon Sep 17 00:00:00 2001
From: "Tran M. Cuong" <cuongtran.tm@gmail.com>
Date: Mon, 24 Jun 2024 12:35:34 +0700
Subject: [PATCH] feat: SourcesFilterScreen: add sticky header & show language
 in SourceFiler's items

sticky header without language name

This reverts commit a676891d98964eaf9288199630cf0289830f0212.

show language in SourceFiler's items
correct padding to fix scrollbar overlaping
---
 .../browse/SourcesFilterScreen.kt             | 64 ++++++++++++++-----
 1 file changed, 48 insertions(+), 16 deletions(-)

diff --git a/app/src/main/java/eu/kanade/presentation/browse/SourcesFilterScreen.kt b/app/src/main/java/eu/kanade/presentation/browse/SourcesFilterScreen.kt
index 49765a836..c7f69b37c 100644
--- a/app/src/main/java/eu/kanade/presentation/browse/SourcesFilterScreen.kt
+++ b/app/src/main/java/eu/kanade/presentation/browse/SourcesFilterScreen.kt
@@ -1,13 +1,17 @@
 package eu.kanade.presentation.browse
 
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.items
 import androidx.compose.material3.Checkbox
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.unit.Dp
 import eu.kanade.presentation.browse.components.BaseSourceItem
 import eu.kanade.presentation.components.AppBar
 import eu.kanade.presentation.more.settings.widget.SwitchPreferenceWidget
@@ -17,7 +21,9 @@ import tachiyomi.domain.source.model.Source
 import tachiyomi.i18n.MR
 import tachiyomi.i18n.sy.SYMR
 import tachiyomi.presentation.core.components.FastScrollLazyColumn
+import tachiyomi.presentation.core.components.Scroller.STICKY_HEADER_KEY_PREFIX
 import tachiyomi.presentation.core.components.material.Scaffold
+import tachiyomi.presentation.core.components.material.padding
 import tachiyomi.presentation.core.i18n.stringResource
 import tachiyomi.presentation.core.screens.EmptyScreen
 
@@ -47,15 +53,22 @@ fun SourcesFilterScreen(
             )
             return@Scaffold
         }
-        SourcesFilterContent(
-            contentPadding = contentPadding,
-            state = state,
-            onClickLanguage = onClickLanguage,
-            onClickSource = onClickSource,
-            // SY -->
-            onClickSources = onClickSources,
-            // SY <--
-        )
+        // KMK -->
+        // Wrap around so we can use sticky header
+        Column(
+            modifier = Modifier.padding(contentPadding)
+        ) {
+            // KMK <--
+            SourcesFilterContent(
+                contentPadding = PaddingValues(Dp.Hairline),
+                state = state,
+                onClickLanguage = onClickLanguage,
+                onClickSource = onClickSource,
+                // SY -->
+                onClickSources = onClickSources,
+                // SY <--
+            )
+        }
     }
 }
 
@@ -74,12 +87,18 @@ private fun SourcesFilterContent(
     ) {
         state.items.forEach { (language, sources) ->
             val enabled = language in state.enabledLanguages
-            item(
+            // KMK -->
+            stickyHeader(
+                // KMK <--
                 key = language,
                 contentType = "source-filter-header",
             ) {
                 SourcesFilterHeader(
-                    modifier = Modifier.animateItemPlacement(),
+                    modifier = Modifier
+                        // KMK -->
+                        .padding(end = MaterialTheme.padding.small)
+                        // KMK <--
+                        .animateItemPlacement(),
                     language = language,
                     enabled = enabled,
                     onClickItem = onClickLanguage,
@@ -87,15 +106,22 @@ private fun SourcesFilterContent(
             }
             if (enabled) {
                 // SY -->
-                item(
-                    key = "toggle-$language",
+                // KMK -->
+                stickyHeader(
+                    // KMK <--
+                    key = "$STICKY_HEADER_KEY_PREFIX-toggle-$language",
                     contentType = "source-filter-toggle",
                 ) {
                     val toggleEnabled = remember(state.disabledSources) {
                         sources.none { it.id.toString() in state.disabledSources }
                     }
                     SourcesFilterToggle(
-                        modifier = Modifier.animateItemPlacement(),
+                        modifier = Modifier
+                            // KMK -->
+                            .background(MaterialTheme.colorScheme.background)
+                            .padding(end = MaterialTheme.padding.small)
+                            // KMK <--
+                            .animateItemPlacement(),
                         isEnabled = toggleEnabled,
                         onClickItem = {
                             onClickSources(!toggleEnabled, sources)
@@ -109,7 +135,11 @@ private fun SourcesFilterContent(
                     contentType = { "source-filter-item" },
                 ) { source ->
                     SourcesFilterItem(
-                        modifier = Modifier.animateItemPlacement(),
+                        modifier = Modifier
+                            // KMK -->
+                            .padding(end = MaterialTheme.padding.small)
+                            // KMK <--
+                            .animateItemPlacement(),
                         source = source,
                         enabled = "${source.id}" !in state.disabledSources,
                         onClickItem = onClickSource,
@@ -162,7 +192,9 @@ private fun SourcesFilterItem(
     BaseSourceItem(
         modifier = modifier,
         source = source,
-        showLanguageInContent = false,
+        // KMK -->
+        // showLanguageInContent = false,
+        // KMK <--
         onClickItem = { onClickItem(source) },
         action = {
             Checkbox(checked = enabled, onCheckedChange = null)