🐛 MainScreen is now holding a shared bottom sheet state for all MainS…

…creens
schachi5000 · Nov 26, 2024 · 2b406c0 · 2b406c0
1 parent c75835a
commit 2b406c0
Show file tree

Hide file tree

Showing 8 changed files with 154 additions and 141 deletions.
diff --git a/shared/src/commonMain/kotlin/net/schacher/mcc/shared/design/compose/CardRow.kt b/shared/src/commonMain/kotlin/net/schacher/mcc/shared/design/compose/CardRow.kt
@@ -5,20 +5,13 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.foundation.layout.sizeIn
 import androidx.compose.foundation.layout.wrapContentHeight
 import androidx.compose.foundation.lazy.LazyRow
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.font.FontWeight
-import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import net.schacher.mcc.shared.design.theme.ContentPadding
 import net.schacher.mcc.shared.model.Card
 
@@ -30,7 +23,7 @@ fun CardRow(modifier: Modifier, cardRowEntry: CardRowEntry, onCardSelected: (Car
             verticalAlignment = Alignment.Bottom,
             horizontalArrangement = Arrangement.SpaceBetween
         ) {
-            Header(
+            HeaderSmall(
                 title = cardRowEntry.title,
                 subTitle = cardRowEntry.cards.size.toString()
             )

diff --git a/shared/src/commonMain/kotlin/net/schacher/mcc/shared/design/compose/Header.kt b/shared/src/commonMain/kotlin/net/schacher/mcc/shared/design/compose/Header.kt
@@ -7,11 +7,24 @@ import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 
 @Composable
-fun Header(
+fun Header(title: String) {
+    Row(
+        modifier = Modifier.padding(vertical = 16.dp),
+        verticalAlignment = Alignment.CenterVertically
+    ) {
+        Text(
+            modifier = Modifier.alignByBaseline(),
+            text = title,
+            style = MaterialTheme.typography.h4
+        )
+    }
+}
+
+@Composable
+fun HeaderSmall(
     title: String,
     subTitle: String? = null
 ) {
@@ -30,18 +43,4 @@ fun Header(
             )
         }
     }
-}
-
-@Composable
-fun MainHeader(title: String) {
-    Row(
-        modifier = Modifier.padding(vertical = 16.dp),
-        verticalAlignment = Alignment.CenterVertically
-    ) {
-        Text(
-            modifier = Modifier.alignByBaseline(),
-            text = title,
-            style = MaterialTheme.typography.h4
-        )
-    }
-}
+}
diff --git a/shared/src/commonMain/kotlin/net/schacher/mcc/shared/design/theme/Dimensions.kt b/shared/src/commonMain/kotlin/net/schacher/mcc/shared/design/theme/Dimensions.kt
@@ -25,3 +25,5 @@ val CardShape = RoundedCornerShape(Card)
 val DeckShape = RoundedCornerShape(Deck)
 
 val DefaultShape = RoundedCornerShape(Default)
+
+val BottomSheetShape = RoundedCornerShape(topStart = Default, topEnd = Default)
diff --git a/shared/src/commonMain/kotlin/net/schacher/mcc/shared/screens/collection/CollectionScreen.kt b/shared/src/commonMain/kotlin/net/schacher/mcc/shared/screens/collection/CollectionScreen.kt
@@ -1,6 +1,5 @@
 package net.schacher.mcc.shared.screens.collection
 
-import androidx.compose.animation.AnimatedVisibility
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
@@ -11,19 +10,16 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.sizeIn
 import androidx.compose.foundation.layout.statusBarsPadding
 import androidx.compose.foundation.layout.wrapContentHeight
 import androidx.compose.foundation.lazy.grid.GridCells
 import androidx.compose.foundation.lazy.grid.GridItemSpan
 import androidx.compose.foundation.lazy.grid.LazyGridItemScope
 import androidx.compose.foundation.lazy.grid.LazyGridScope
 import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
-import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.ExperimentalMaterialApi
 import androidx.compose.material.Icon
 import androidx.compose.material.MaterialTheme
-import androidx.compose.material.ModalBottomSheetLayout
 import androidx.compose.material.ModalBottomSheetValue
 import androidx.compose.material.Switch
 import androidx.compose.material.Text
@@ -45,32 +41,25 @@ import androidx.compose.ui.geometry.Offset
 import androidx.compose.ui.input.nestedscroll.NestedScrollConnection
 import androidx.compose.ui.input.nestedscroll.NestedScrollSource
 import androidx.compose.ui.input.nestedscroll.nestedScroll
-import androidx.compose.ui.text.font.FontWeight
-import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import androidx.navigation.NavController
 import kotlinx.coroutines.launch
 import marvelchampionscompanion.shared.generated.resources.Res
 import marvelchampionscompanion.shared.generated.resources.collection
-import marvelchampionscompanion.shared.generated.resources.my_decks
 import net.schacher.mcc.shared.design.compose.BackHandler
-import net.schacher.mcc.shared.design.compose.BottomSheetContainer
 import net.schacher.mcc.shared.design.compose.BottomSpacer
-import net.schacher.mcc.shared.design.compose.Card
 import net.schacher.mcc.shared.design.compose.ExpandingButton
 import net.schacher.mcc.shared.design.compose.FilterFlowRow
 import net.schacher.mcc.shared.design.compose.LabeledCard
-import net.schacher.mcc.shared.design.compose.MainHeader
+import net.schacher.mcc.shared.design.compose.Header
 import net.schacher.mcc.shared.design.theme.ContentPadding
 import net.schacher.mcc.shared.model.Card
 import net.schacher.mcc.shared.screens.AppRoute
 import net.schacher.mcc.shared.screens.navigate
 import net.schacher.mcc.shared.screens.search.Filter
 import net.schacher.mcc.shared.screens.search.Filter.Type.OWNED
 import net.schacher.mcc.shared.utils.replace
-import org.jetbrains.compose.resources.getString
 import org.jetbrains.compose.resources.stringResource
 import org.koin.compose.koinInject
 import org.koin.compose.viewmodel.koinViewModel
@@ -80,6 +69,7 @@ fun CollectionScreen(
     viewModel: CollectionViewModel = koinViewModel(),
     navController: NavController = koinInject(),
     topInset: Dp = ContentPadding,
+    onShowBottomSheet: (@Composable () -> Unit) -> Unit,
     onCardClicked: (Card) -> Unit
 ) {
     val state by viewModel.state.collectAsState()
@@ -89,6 +79,7 @@ fun CollectionScreen(
         navController = navController,
         topInset = topInset,
         onCardClicked = onCardClicked,
+        onShowBottomSheet = onShowBottomSheet,
         onApplyFilerClick = viewModel::onApplyFilterClicked
     )
 }
@@ -99,104 +90,81 @@ fun CollectionScreen(
     state: UiState,
     navController: NavController,
     topInset: Dp,
+    onShowBottomSheet: (@Composable () -> Unit) -> Unit,
     onCardClicked: (Card) -> Unit,
     onApplyFilerClick: (Set<Filter>) -> Unit
 ) {
-    val scope = rememberCoroutineScope()
-    val sheetState = rememberModalBottomSheetState(
-        initialValue = ModalBottomSheetValue.Hidden,
-        skipHalfExpanded = true
-    )
-
-    BackHandler(sheetState.isVisible) {
-        scope.launch { sheetState.hide() }
-    }
+    Box(modifier = Modifier.fillMaxSize()) {
+        var expanded by remember { mutableStateOf(false) }
+        val nestedScrollConnection = remember {
+            object : NestedScrollConnection {
+                override fun onPreScroll(
+                    available: Offset,
+                    source: NestedScrollSource
+                ): Offset {
+                    expanded = if (expanded) {
+                        available.y > -65
+                    } else {
+                        available.y > 30
+                    }
 
-    ModalBottomSheetLayout(
-        sheetState = sheetState,
-        sheetShape = RoundedCornerShape(topEnd = 16.dp, topStart = 16.dp),
-        sheetContent = {
-            BottomSheetContainer {
-                FilterContent(
-                    state = state,
-                    onSelectPacksClicked = { navController.navigate(AppRoute.Packs) },
-                    onApplyFilerClick = { onApplyFilerClick(it) }
-                )
+                    return Offset.Zero
+                }
             }
         }
-    ) {
-        Box(modifier = Modifier.fillMaxSize()) {
-            var expanded by remember { mutableStateOf(false) }
-            val nestedScrollConnection = remember {
-                object : NestedScrollConnection {
-                    override fun onPreScroll(
-                        available: Offset,
-                        source: NestedScrollSource
-                    ): Offset {
-                        expanded = if (expanded) {
-                            available.y > -65
-                        } else {
-                            available.y > 30
-                        }
 
-                        return Offset.Zero
-                    }
+        LazyVerticalGrid(
+            columns = GridCells.Fixed(3),
+            verticalArrangement = Arrangement.spacedBy(12.dp),
+            horizontalArrangement = Arrangement.spacedBy(12.dp),
+            modifier = Modifier.fillMaxSize()
+                .padding(horizontal = ContentPadding)
+                .nestedScroll(nestedScrollConnection),
+        ) {
+            header {
+                Row(modifier = Modifier.statusBarsPadding().padding(top = topInset)) {
+                    Header(stringResource(Res.string.collection))
                 }
             }
 
-            LazyVerticalGrid(
-                columns = GridCells.Fixed(3),
-                verticalArrangement = Arrangement.spacedBy(12.dp),
-                horizontalArrangement = Arrangement.spacedBy(12.dp),
-                modifier = Modifier.fillMaxSize()
-                    .padding(horizontal = ContentPadding)
-                    .nestedScroll(nestedScrollConnection),
-            ) {
-                header {
-                    Row(modifier = Modifier.statusBarsPadding().padding(top = topInset)) {
-                        MainHeader(stringResource(Res.string.collection))
-                    }
-                }
-
-                items(count = state.cardsInCollection.size) { index ->
-                    val card = state.cardsInCollection[index]
-                    Column {
-                        LabeledCard(
-                            card = card,
-                            label = card.name,
-                            showLabel = expanded,
-                            modifier = Modifier.wrapContentHeight()
-                        ) {
-                            onCardClicked(card)
-                        }
+            items(count = state.cardsInCollection.size) { index ->
+                val card = state.cardsInCollection[index]
+                Column {
+                    LabeledCard(
+                        card = card,
+                        label = card.name,
+                        showLabel = expanded,
+                        modifier = Modifier.wrapContentHeight()
+                    ) {
+                        onCardClicked(card)
                     }
                 }
+            }
 
-                items(count = 3) {
-                    BottomSpacer()
-                }
+            items(count = 3) {
+                BottomSpacer()
             }
+        }
 
-            ExpandingButton(
-                label = "Filter Collection",
-                icon = {
-                    Icon(
-                        Icons.AutoMirrored.Rounded.List,
-                        contentDescription = "Filter Collection"
+        ExpandingButton(
+            label = "Filter Collection",
+            icon = {
+                Icon(
+                    Icons.AutoMirrored.Rounded.List,
+                    contentDescription = "Filter Collection"
+                )
+            },
+            expanded = expanded,
+            onClick = {
+                onShowBottomSheet {
+                    FilterContent(
+                        state = state,
+                        onSelectPacksClicked = { navController.navigate(AppRoute.Packs) },
+                        onApplyFilerClick = { onApplyFilerClick(it) }
                     )
-                },
-                expanded = expanded,
-                onClick = {
-                    scope.launch {
-                        if (sheetState.isVisible) {
-                            sheetState.hide()
-                        } else {
-                            sheetState.show()
-                        }
-                    }
                 }
-            )
-        }
+            }
+        )
     }
 }
 

diff --git a/shared/src/commonMain/kotlin/net/schacher/mcc/shared/screens/deck/DeckScreen.kt b/shared/src/commonMain/kotlin/net/schacher/mcc/shared/screens/deck/DeckScreen.kt
@@ -47,7 +47,7 @@ import net.schacher.mcc.shared.design.compose.Card
 import net.schacher.mcc.shared.design.compose.CardBackgroundBox
 import net.schacher.mcc.shared.design.compose.CardRow
 import net.schacher.mcc.shared.design.compose.CardRowEntry
-import net.schacher.mcc.shared.design.compose.Header
+import net.schacher.mcc.shared.design.compose.HeaderSmall
 import net.schacher.mcc.shared.design.compose.LabeledCard
 import net.schacher.mcc.shared.design.compose.Tag
 import net.schacher.mcc.shared.design.theme.ContentPadding
@@ -217,7 +217,7 @@ private fun Content(
                         verticalAlignment = Alignment.Bottom,
                         horizontalArrangement = Arrangement.SpaceBetween
                     ) {
-                        Header(
+                        HeaderSmall(
                             title = "Other Cards",
                             subTitle = otherCards.size.toString()
                         )
Original file line number	Diff line number	Diff line change
Expand Up		@@ -25,3 +25,5 @@ val CardShape = RoundedCornerShape(Card)
		val DeckShape = RoundedCornerShape(Deck)

		val DefaultShape = RoundedCornerShape(Default)

		val BottomSheetShape = RoundedCornerShape(topStart = Default, topEnd = Default)