fix: make formatting closer to design

Author: RyanCheung555

app/src/main/java/com/cornellappdev/transit/ui/components/home/EcosystemBottomSheetContent.kt

@@ -16,6 +16,7 @@ import androidx.compose.foundation.lazy.items
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.HorizontalDivider
 import androidx.compose.material3.ModalBottomSheet
+import androidx.compose.material3.OutlinedTextFieldDefaults.contentPadding
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
@@ -148,19 +149,21 @@ private fun BottomSheetFilteredContent(
     onAddFavoritesClick: () -> Unit,
     onFilterButtonClick: () -> Unit
 ) {
+    val appliedFilters by homeViewModel.appliedFavoritesFilters.collectAsStateWithLifecycle()
     Column() {
         if (currentFilter == FilterState.FAVORITES) {
             Column(modifier = Modifier.padding(horizontal = 12.dp)) {
                 HorizontalDivider(modifier = Modifier.padding(vertical = 8.dp))
                 FilterRow(
-                    selectedFilters = homeViewModel.appliedFavoritesFilters.collectAsStateWithLifecycle().value,
+                    selectedFilters = appliedFilters,
                     onFilterClick = onFilterButtonClick,
                     onRemoveFilter = { filter -> homeViewModel.removeAppliedFilter(filter) }
                 )
             }
         }
+        val showLessPadding = currentFilter == FilterState.FAVORITES && appliedFilters.isEmpty()
         LazyColumn(
-            contentPadding = PaddingValues(start = 12.dp, end = 12.dp, top = if (currentFilter == FilterState.FAVORITES) 0.dp else 8.dp, bottom = 90.dp),
+            contentPadding = PaddingValues(start = 12.dp, end = 12.dp, top = if (showLessPadding) 0.dp else 8.dp, bottom = 90.dp),
             modifier = Modifier.fillMaxSize(),
             verticalArrangement = Arrangement.spacedBy(20.dp)
         ) {

app/src/main/java/com/cornellappdev/transit/ui/components/home/FilterRow.kt

@@ -43,23 +43,20 @@ fun FilterRow(
     onRemoveFilter: (FavoritesFilterSheetState) -> Unit,
     modifier: Modifier = Modifier
 ) {
-    Row(modifier = modifier) {
-        FilterButton(onFilterClick = onFilterClick)
+    FlowRow(modifier = modifier,
+        horizontalArrangement = Arrangement.spacedBy(8.dp),
+        verticalArrangement = Arrangement.spacedBy(8.dp),
+    ) {
+        FilterButton(onFilterClick = onFilterClick, modifier = Modifier.align(Alignment.CenterVertically))
 
         // Selected filter labels
         if (selectedFilters.isNotEmpty()) {
-            Spacer(modifier = Modifier.width(8.dp))
-            FlowRow(
-                modifier = Modifier.fillMaxWidth(),
-                horizontalArrangement = Arrangement.spacedBy(8.dp),
-                verticalArrangement = Arrangement.spacedBy(8.dp)
-            ) {
-                selectedFilters.forEach { filter ->
-                    FilterLabel(
-                        text = filter.label,
-                        onRemove = { onRemoveFilter(filter) }
-                    )
-                }
+            selectedFilters.forEach { filter ->
+                FilterLabel(
+                    text = filter.label,
+                    onRemove = { onRemoveFilter(filter) },
+                    modifier = Modifier.align(Alignment.CenterVertically)
+                )
             }
         }
     }
@@ -104,6 +101,18 @@ private fun FilterLabel(
     }
 }
 
+@Preview
+@Composable
+private fun FilterRowPreview() {
+    FilterRow(
+        selectedFilters = setOf(FavoritesFilterSheetState.EATERIES),
+        onFilterClick = {},
+        onRemoveFilter = {}
+    )
+
+
+}
+
 @Preview
 @Composable
 private fun FilterLabelPreview(){