feat(filter): adds filtering for set (#4)

kikin81 · web-flow · commit 0c4eca780b67 · 2024-12-22T19:57:56.000-08:00
diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml
diff --git a/app/build.gradle.kts b/app/build.gradle.kts
@@ -55,6 +55,7 @@ dependencies {
     implementation(libs.androidx.compose.google.fonts)
     implementation(libs.androidx.compose.navigation)
     implementation(libs.androidx.core.ktx)
+    implementation(libs.androidx.material.icons)
     implementation(libs.androidx.material3)
     implementation(libs.androidx.ui)
     implementation(libs.androidx.ui.graphics)
diff --git a/app/src/main/java/us/kikin/android/ptp/cards/CardsFilterType.kt b/app/src/main/java/us/kikin/android/ptp/cards/CardsFilterType.kt
@@ -16,6 +16,15 @@
 
 package us.kikin.android.ptp.cards
 
-enum class CardsFilterType {
-    ALL_CARDS,
+import androidx.annotation.StringRes
+import us.kikin.android.ptp.R
+
+enum class CardsFilterType(
+    val setId: String,
+    @StringRes val titleResId: Int,
+) {
+    All("All", R.string.card_list_filter_all),
+    GeneticApex("Genetic Apex  (A1)", R.string.card_list_filter_genetic_apex),
+    PromoA("Promo-A", R.string.card_list_filter_promo_a),
+    MythicalIslands("Mythical Island  (A1a)", R.string.card_list_filter_mythical_islands),
 }
diff --git a/app/src/main/java/us/kikin/android/ptp/cards/CardsScreen.kt b/app/src/main/java/us/kikin/android/ptp/cards/CardsScreen.kt
@@ -27,24 +27,37 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.grid.GridCells
 import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
 import androidx.compose.foundation.lazy.grid.items
+import androidx.compose.foundation.text.input.TextFieldLineLimits
+import androidx.compose.foundation.text.input.rememberTextFieldState
+import androidx.compose.foundation.text.input.setTextAndPlaceCursorAtEnd
 import androidx.compose.material3.Card as MaterialCard
 import androidx.compose.material3.CenterAlignedTopAppBar
 import androidx.compose.material3.CircularProgressIndicator
+import androidx.compose.material3.DropdownMenuItem
 import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.ExposedDropdownMenuAnchorType
+import androidx.compose.material3.ExposedDropdownMenuBox
+import androidx.compose.material3.ExposedDropdownMenuDefaults
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.ModalBottomSheet
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.SnackbarHost
 import androidx.compose.material3.SnackbarHostState
 import androidx.compose.material3.Text
+import androidx.compose.material3.TextField
 import androidx.compose.material3.TopAppBarDefaults
+import androidx.compose.material3.rememberModalBottomSheetState
 import androidx.compose.material3.rememberTopAppBarState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.input.nestedscroll.nestedScroll
@@ -78,6 +91,9 @@ fun CardsScreen(
     snackbarHostState: SnackbarHostState = remember { SnackbarHostState() },
 ) {
     val scaffoldBehavior = TopAppBarDefaults.pinnedScrollBehavior(rememberTopAppBarState())
+    val sheetState = rememberModalBottomSheetState()
+    val scope = rememberCoroutineScope()
+    var showBottomSheet by remember { mutableStateOf(false) }
     AppTheme {
         Scaffold(
             modifier = modifier
@@ -94,7 +110,7 @@ fun CardsScreen(
                         )
                     },
                     actions = {
-                        IconButton(onClick = { /*TODO*/ }) {
+                        IconButton(onClick = { showBottomSheet = true }) {
                             Icon(
                                 imageVector = PtpIcons.Rounded.FilterList,
                                 contentDescription = stringResource(R.string.card_list_filters),
@@ -123,6 +139,20 @@ fun CardsScreen(
                     viewModel.snackbarMessageShown()
                 }
             }
+
+            if (showBottomSheet) {
+                ModalBottomSheet(
+                    onDismissRequest = {
+                        showBottomSheet = false
+                    },
+                    sheetState = sheetState,
+                ) {
+                    FilterContent(
+                        currentFilter = uiState.filter,
+                        viewModel::setFiltering,
+                    )
+                }
+            }
         }
     }
 }
@@ -149,6 +179,59 @@ private fun CardsContent(
     }
 }
 
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+fun FilterContent(
+    currentFilter: CardsFilterType,
+    onFilterChange: (CardsFilterType) -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    Column(
+        modifier = modifier
+            .fillMaxWidth()
+            .padding(horizontal = 16.dp, vertical = 24.dp),
+    ) {
+        // dropdown for set?
+        val options = CardsFilterType.entries
+        var expanded by remember { mutableStateOf(false) }
+        val textFieldState = rememberTextFieldState(currentFilter.name)
+        ExposedDropdownMenuBox(
+            expanded = expanded,
+            onExpandedChange = { expanded = it },
+            modifier = Modifier.fillMaxWidth(),
+        ) {
+            TextField(
+                modifier = Modifier
+                    .menuAnchor(ExposedDropdownMenuAnchorType.PrimaryNotEditable)
+                    .fillMaxWidth(),
+                state = textFieldState,
+                readOnly = true,
+                lineLimits = TextFieldLineLimits.SingleLine,
+                label = {
+                    Text("Set")
+                },
+            )
+            ExposedDropdownMenu(
+                expanded = expanded,
+                onDismissRequest = { expanded = false },
+            ) {
+                options.forEach { option ->
+                    val label = stringResource(option.titleResId)
+                    DropdownMenuItem(
+                        text = { Text(label, style = MaterialTheme.typography.bodyLarge) },
+                        onClick = {
+                            textFieldState.setTextAndPlaceCursorAtEnd(label)
+                            expanded = false
+                            onFilterChange(option)
+                        },
+                        contentPadding = ExposedDropdownMenuDefaults.ItemContentPadding,
+                    )
+                }
+            }
+        }
+    }
+}
+
 @Composable
 private fun CardsList(
     cards: ImmutableList<Card>,
diff --git a/app/src/main/java/us/kikin/android/ptp/cards/CardsViewModel.kt b/app/src/main/java/us/kikin/android/ptp/cards/CardsViewModel.kt
@@ -19,7 +19,6 @@ package us.kikin.android.ptp.cards
 import androidx.lifecycle.SavedStateHandle
 import androidx.lifecycle.ViewModel
 import androidx.lifecycle.viewModelScope
-import androidx.navigation.toRoute
 import dagger.hilt.android.lifecycle.HiltViewModel
 import javax.inject.Inject
 import kotlinx.coroutines.flow.MutableStateFlow
@@ -31,13 +30,13 @@ import kotlinx.coroutines.flow.stateIn
 import us.kikin.android.ptp.R
 import us.kikin.android.ptp.data.Card
 import us.kikin.android.ptp.data.CardRepository
-import us.kikin.android.ptp.navigation.CardListDestination
 import us.kikin.android.ptp.util.Async
 import us.kikin.android.ptp.util.WhileUiSubscribed
 
 data class CardsUiState(
     val cards: List<Card> = emptyList(),
     val isLoading: Boolean = false,
+    val filter: CardsFilterType = CardsFilterType.All,
     val userMessage: Int? = null,
 )
 
@@ -49,7 +48,8 @@ constructor(
     private val savedStateHandle: SavedStateHandle,
 ) : ViewModel() {
     private val _savedFilterType =
-        MutableStateFlow(savedStateHandle.toRoute<CardListDestination>().filterType)
+        savedStateHandle.getStateFlow(CARDS_FILTER_SAVED_STATE_KEY, CardsFilterType.All)
+    private val _filterUiInfo = _savedFilterType
     private val _isLoading = MutableStateFlow(false)
     private val _userMessage: MutableStateFlow<Int?> = MutableStateFlow(null)
     private val _filteredCardsAsync =
@@ -61,10 +61,11 @@ constructor(
 
     val uiState: StateFlow<CardsUiState> =
         combine(
+            _filterUiInfo,
             _isLoading,
             _userMessage,
             _filteredCardsAsync,
-        ) { isLoading, userMessage, cardsAsync ->
+        ) { filterUiInfo, isLoading, userMessage, cardsAsync ->
             when (cardsAsync) {
                 Async.Loading -> {
                     CardsUiState(isLoading = true)
@@ -77,6 +78,7 @@ constructor(
                 is Async.Success -> {
                     CardsUiState(
                         cards = cardsAsync.data,
+                        filter = filterUiInfo,
                         isLoading = isLoading,
                         userMessage = userMessage,
                     )
@@ -91,11 +93,26 @@ constructor(
 
     private fun filterCards(cards: List<Card>, type: CardsFilterType): List<Card> {
         return when (type) {
-            CardsFilterType.ALL_CARDS -> cards
+            CardsFilterType.All -> cards
+            CardsFilterType.GeneticApex -> cards.filter {
+                it.setDetails == CardsFilterType.GeneticApex.setId
+            }
+            CardsFilterType.PromoA -> cards.filter {
+                it.setDetails == CardsFilterType.PromoA.setId
+            }
+            CardsFilterType.MythicalIslands -> cards.filter {
+                it.setDetails == CardsFilterType.MythicalIslands.setId
+            }
         }
     }
 
     fun snackbarMessageShown() {
         _userMessage.value = null
     }
+
+    fun setFiltering(requestType: CardsFilterType) {
+        savedStateHandle[CARDS_FILTER_SAVED_STATE_KEY] = requestType
+    }
 }
+
+const val CARDS_FILTER_SAVED_STATE_KEY = "CARDS_FILTER_SAVED_STATE_KEY"
diff --git a/app/src/main/java/us/kikin/android/ptp/navigation/AppNavigation.kt b/app/src/main/java/us/kikin/android/ptp/navigation/AppNavigation.kt
@@ -21,7 +21,7 @@ import us.kikin.android.ptp.cards.CardsFilterType
 
 @Serializable
 data class CardListDestination(
-    val filterType: CardsFilterType = CardsFilterType.ALL_CARDS,
+    val filterType: CardsFilterType = CardsFilterType.All,
     val userMessage: Int? = null,
 )
 
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
@@ -5,4 +5,8 @@
     <string name="loading_card_detail_error">Error while loading card detail</string>
     <string name="card_detail_not_found">Card not found</string>
     <string name="card_list_filters">Filters</string>
+    <string name="card_list_filter_all">All</string>
+    <string name="card_list_filter_genetic_apex">Genetic Apex</string>
+    <string name="card_list_filter_promo_a">Promo-A</string>
+    <string name="card_list_filter_mythical_islands">Mythical Islands</string>
 </resources>
diff --git a/gradle/libs.versions.toml b/gradle/libs.versions.toml
@@ -13,6 +13,7 @@ junitVersion = "1.2.1"
 kotlin = "2.1.0"
 ksp = "2.1.0-1.0.29"
 lifecycle = "2.8.7"
+material3 = "1.4.0-alpha05"
 paging = "3.3.5"
 room = "2.6.1"
 timber = "5.0.1"
@@ -26,7 +27,8 @@ androidx-compose-google-fonts = { group = "androidx.compose.ui", name = "ui-text
 androidx-core-ktx = { group = "androidx.core", name = "core-ktx", version.ref = "coreKtx" }
 androidx-espresso-core = { group = "androidx.test.espresso", name = "espresso-core", version.ref = "espressoCore" }
 androidx-junit = { group = "androidx.test.ext", name = "junit", version.ref = "junitVersion" }
-androidx-material3 = { group = "androidx.compose.material3", name = "material3" }
+androidx-material3 = { group = "androidx.compose.material3", name = "material3", version.ref = "material3" }
+androidx-material-icons = { group = "androidx.compose.material", name = "material-icons-core" }
 androidx-ui = { group = "androidx.compose.ui", name = "ui" }
 androidx-ui-graphics = { group = "androidx.compose.ui", name = "ui-graphics" }
 androidx-ui-test-junit4 = { group = "androidx.compose.ui", name = "ui-test-junit4" }
@@ -58,7 +60,7 @@ room = ["room-runtime", "room-ktx", "room-paging"]
 
 [plugins]
 android-application = { id = "com.android.application", version.ref = "agp" }
-dependency-sorter = { id = "com.squareup.sort-dependencies", version = "0.13"}
+dependency-sorter = { id = "com.squareup.sort-dependencies", version = "0.13" }
 hilt = { id = "com.google.dagger.hilt.android", version.ref = "hilt" }
 kotlin-android = { id = "org.jetbrains.kotlin.android", version.ref = "kotlin" }
 kotlin-compose = { id = "org.jetbrains.kotlin.plugin.compose", version.ref = "kotlin" }

Original file line number	Diff line number	Diff line change
`@@ -21,7 +21,7 @@ import us.kikin.android.ptp.cards.CardsFilterType`
`21`	`21`
`22`	`22`	`@Serializable`
`23`	`23`	`data class CardListDestination(`
`24`		`- val filterType: CardsFilterType = CardsFilterType.ALL_CARDS,`
	`24`	`+ val filterType: CardsFilterType = CardsFilterType.All,`
`25`	`25`	`val userMessage: Int? = null,`
`26`	`26`	`)`
`27`	`27`