Skip to content

Commit

Permalink
Fix bottom divider at bottom sheet shell
Browse files Browse the repository at this point in the history
  • Loading branch information
Siddharth Agarwal committed Jun 12, 2024
1 parent d8929bd commit 0c587d3
Show file tree
Hide file tree
Showing 3 changed files with 134 additions and 12 deletions.
139 changes: 132 additions & 7 deletions ...c/commonMain/kotlin/org/hisp/dhis/common/screens/bottomSheets/OrgTreeBottomSheetScreen.kt
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,15 @@
package org.hisp.dhis.common.screens.bottomSheets

import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.size
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import kotlinx.coroutines.CoroutineScope
import kotlinx.coroutines.Dispatchers
import kotlinx.coroutines.flow.MutableStateFlow
Expand All @@ -16,25 +19,93 @@ import kotlinx.coroutines.flow.stateIn
import kotlinx.coroutines.launch
import org.hisp.dhis.common.screens.previews.lorem
import org.hisp.dhis.common.screens.previews.lorem_medium
import org.hisp.dhis.common.screens.previews.lorem_short
import org.hisp.dhis.mobile.ui.designsystem.component.Button
import org.hisp.dhis.mobile.ui.designsystem.component.ButtonStyle
import org.hisp.dhis.mobile.ui.designsystem.component.ColumnComponentContainer
import org.hisp.dhis.mobile.ui.designsystem.component.OrgBottomSheet
import org.hisp.dhis.mobile.ui.designsystem.component.OrgTreeItem
import org.hisp.dhis.mobile.ui.designsystem.component.SubTitle
import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing

@Composable
fun OrgTreeBottomSheetScreen() {
var showOrgTreeBottomSheet by rememberSaveable { mutableStateOf(false) }
var showOneOrgTreeBottomSheet by rememberSaveable { mutableStateOf(false) }
var showTwoOrgTreeBottomSheet by rememberSaveable { mutableStateOf(false) }
var showMediumOrgTreeBottomSheet by rememberSaveable { mutableStateOf(false) }
var showLargeOrgTreeBottomSheet by rememberSaveable { mutableStateOf(false) }

if (showOrgTreeBottomSheet) {
if (showOneOrgTreeBottomSheet) {
val orgTreeItemsRepo = remember { OrgTreeItemsFakeRepo() }
val orgTreeItems by orgTreeItemsRepo.state.collectAsState(emptyList())
val oneOrgTreeItem by orgTreeItemsRepo.state.collectAsState(emptyList())

OrgBottomSheet(
orgTreeItems = orgTreeItems,
orgTreeItems = oneOrgTreeItem.take(1),
onDismiss = {
showOrgTreeBottomSheet = false
showOneOrgTreeBottomSheet = false
},
onSearch = orgTreeItemsRepo::search,
onItemClick = orgTreeItemsRepo::toggleItemExpansion,
onItemSelected = { uid, checked ->
orgTreeItemsRepo.toggleItemSelection(uid, checked)
},
onClearAll = { orgTreeItemsRepo.clearItemSelections() },
onDone = {
// no-op
},
)
}

if (showTwoOrgTreeBottomSheet) {
val orgTreeItemsRepo = remember { OrgTreeItemsFakeRepo() }
val oneOrgTreeItem by orgTreeItemsRepo.state.collectAsState(emptyList())

OrgBottomSheet(
orgTreeItems = oneOrgTreeItem.take(4),
onDismiss = {
showTwoOrgTreeBottomSheet = false
},
onSearch = orgTreeItemsRepo::search,
onItemClick = orgTreeItemsRepo::toggleItemExpansion,
onItemSelected = { uid, checked ->
orgTreeItemsRepo.toggleItemSelection(uid, checked)
},
onClearAll = { orgTreeItemsRepo.clearItemSelections() },
onDone = {
// no-op
},
)
}

if (showMediumOrgTreeBottomSheet) {
val orgTreeItemsRepo = remember { OrgTreeItemsFakeRepo() }
val oneOrgTreeItem by orgTreeItemsRepo.state.collectAsState(emptyList())

OrgBottomSheet(
orgTreeItems = oneOrgTreeItem.take(8),
onDismiss = {
showMediumOrgTreeBottomSheet = false
},
onSearch = orgTreeItemsRepo::search,
onItemClick = orgTreeItemsRepo::toggleItemExpansion,
onItemSelected = { uid, checked ->
orgTreeItemsRepo.toggleItemSelection(uid, checked)
},
onClearAll = { orgTreeItemsRepo.clearItemSelections() },
onDone = {
// no-op
},
)
}

if (showLargeOrgTreeBottomSheet) {
val orgTreeItemsRepo = remember { OrgTreeItemsFakeRepo() }
val oneOrgTreeItem by orgTreeItemsRepo.state.collectAsState(emptyList())

OrgBottomSheet(
orgTreeItems = oneOrgTreeItem,
onDismiss = {
showLargeOrgTreeBottomSheet = false
},
onSearch = orgTreeItemsRepo::search,
onItemClick = orgTreeItemsRepo::toggleItemExpansion,
Expand All @@ -49,13 +120,43 @@ fun OrgTreeBottomSheetScreen() {
}

ColumnComponentContainer {
SubTitle("Org Tree Bottom Sheet")
Button(
enabled = true,
ButtonStyle.FILLED,
text = "Show One Org Tree Bottom Sheet",
) {
showOneOrgTreeBottomSheet = !showOneOrgTreeBottomSheet
}
Spacer(modifier = Modifier.size(Spacing.Spacing10))

SubTitle("Org Tree Bottom Sheet")
Button(
enabled = true,
ButtonStyle.FILLED,
text = "Show Two Org Tree Bottom Sheet",
) {
showTwoOrgTreeBottomSheet = !showTwoOrgTreeBottomSheet
}
Spacer(modifier = Modifier.size(Spacing.Spacing10))

SubTitle("Org Tree Bottom Sheet")
Button(
enabled = true,
ButtonStyle.FILLED,
text = "Show Org Tree Bottom Sheet",
) {
showOrgTreeBottomSheet = !showOrgTreeBottomSheet
showMediumOrgTreeBottomSheet = !showMediumOrgTreeBottomSheet
}
Spacer(modifier = Modifier.size(Spacing.Spacing10))

SubTitle("Org Tree Bottom Sheet")
Button(
enabled = true,
ButtonStyle.FILLED,
text = "Show Large Org Tree Bottom Sheet",
) {
showLargeOrgTreeBottomSheet = !showLargeOrgTreeBottomSheet
}
}
}
Expand Down Expand Up @@ -87,7 +188,30 @@ private class OrgTreeItemsFakeRepo {
isOpen = false,
hasChildren = false,
),

OrgTreeItem(
uid = "51",
label = "UHC Alphabet",
isOpen = false,
hasChildren = false,
),
OrgTreeItem(
uid = "61",
label = lorem_short,
isOpen = false,
hasChildren = false,
),
OrgTreeItem(
uid = "71",
label = "UHC TEST 1",
isOpen = false,
hasChildren = false,
),
OrgTreeItem(
uid = "81",
label = "UHC TEST 2",
isOpen = false,
hasChildren = false,
),
)

private val childrenOrgItems = listOf(
Expand Down Expand Up @@ -173,6 +297,7 @@ private class OrgTreeItemsFakeRepo {
val selectedChildrenCount = getSelectedChildrenCount(selectionToggledList, it)
it.copy(selectedChildrenCount = selectedChildrenCount)
}

else -> {
it.copy(selectedChildrenCount = 0)
}
Expand Down
1 change: 1 addition & 0 deletions ...ystem/src/commonMain/kotlin/org/hisp/dhis/mobile/ui/designsystem/component/BottomSheet.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -277,6 +277,7 @@ fun BottomSheetShell(
horizontalAlignment = Alignment.CenterHorizontally,
) {
content.invoke()
Spacer(modifier = Modifier.weight(1f))
if (showSectionDivider) {
HorizontalDivider(
modifier = Modifier.fillMaxWidth().padding(top = Spacing8),
Expand Down
6 changes: 1 addition & 5 deletions ...em/src/commonMain/kotlin/org/hisp/dhis/mobile/ui/designsystem/component/OrgBottomSheet.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,10 +11,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.requiredWidth
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.LazyListState
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.rememberScrollState
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.filled.KeyboardArrowRight
Expand Down Expand Up @@ -123,7 +119,7 @@ fun OrgBottomSheet(
if (treeHeight > orgTreeHeight) {
orgTreeHeight = treeHeight
}
}
},
)
},
buttonBlock = {
Expand Down

0 comments on commit 0c587d3

Please sign in to comment.