refactor: refactor Individual collection sheet to compose (#2106)

* refactor: refactor Individual collection sheet to compose

* refactor: refactor Individual collection sheet to compose

core/designsystem/src/main/java/com/mifos/core/designsystem/component/MifosBottomSheet.kt

@@ -0,0 +1,69 @@
+@file:OptIn(ExperimentalMaterial3Api::class)
+
+package com.mifos.core.designsystem.component
+
+import androidx.activity.compose.BackHandler
+import androidx.compose.animation.AnimatedVisibility
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.height
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.ModalBottomSheet
+import androidx.compose.material3.rememberModalBottomSheetState
+import androidx.compose.runtime.Composable
+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.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import kotlinx.coroutines.launch
+
+@Composable
+fun MifosBottomSheet(
+    content: @Composable () -> Unit,
+    onDismiss: () -> Unit
+) {
+    val coroutineScope = rememberCoroutineScope()
+    val modalSheetState = rememberModalBottomSheetState(skipPartiallyExpanded = true)
+    var showBottomSheet by remember { mutableStateOf(true) }
+
+
+    fun dismissSheet() {
+        coroutineScope.launch { modalSheetState.hide() }.invokeOnCompletion {
+            if (!modalSheetState.isVisible) {
+                showBottomSheet = false
+            }
+        }
+        onDismiss.invoke()
+    }
+
+    BackHandler(modalSheetState.isVisible) {
+        dismissSheet()
+    }
+
+    AnimatedVisibility(visible = showBottomSheet) {
+        ModalBottomSheet(
+            containerColor = Color.White,
+            onDismissRequest = {
+                showBottomSheet = false
+                dismissSheet()
+            },
+            sheetState = modalSheetState
+        ) {
+            content()
+        }
+    }
+}
+
+@Preview
+@Composable
+fun MifosBottomSheetPreview() {
+    MifosBottomSheet({
+        Box {
+            Modifier.height(100.dp)
+        }
+    }, {})
+}

core/designsystem/src/main/java/com/mifos/core/designsystem/component/MifosScaffold.kt

@@ -14,7 +14,7 @@ import com.mifos.core.designsystem.theme.White
 fun MifosScaffold(
     topBar: @Composable () -> Unit,
     snackbarHostState: SnackbarHostState?,
-    bottomBar: @Composable () -> Unit,
+    bottomBar: @Composable () -> Unit = {},
     content: @Composable (PaddingValues) -> Unit
 ) {
 

core/designsystem/src/main/java/com/mifos/core/designsystem/component/MifosTabRow.kt

@@ -0,0 +1,57 @@
+@file:OptIn(ExperimentalFoundationApi::class)
+
+package com.mifos.core.designsystem.component
+
+import androidx.compose.foundation.ExperimentalFoundationApi
+import androidx.compose.foundation.pager.HorizontalPager
+import androidx.compose.foundation.pager.PagerState
+import androidx.compose.material3.Tab
+import androidx.compose.material3.TabRow
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import com.mifos.core.designsystem.theme.BluePrimary
+import com.mifos.core.designsystem.utility.TabContent
+import kotlinx.coroutines.launch
+
+@Composable
+fun MifosTabRow(
+    tabContents: List<TabContent>,
+    pagerState: PagerState,
+    modifier: Modifier = Modifier,
+    containerColor: Color = Color.White,
+    selectedContentColor: Color = BluePrimary,
+    unselectedContentColor: Color = Color.LightGray
+) {
+    val scope = rememberCoroutineScope()
+
+    TabRow(
+        containerColor = containerColor,
+        selectedTabIndex = pagerState.currentPage,
+        indicator = {},
+        divider = {},
+    ) {
+        tabContents.forEachIndexed { index, currentTab ->
+            Tab(
+                text = { Text(text = currentTab.tabName) },
+                selected = pagerState.currentPage == index,
+                selectedContentColor = selectedContentColor,
+                unselectedContentColor = unselectedContentColor,
+                onClick = {
+                    scope.launch {
+                        pagerState.animateScrollToPage(index)
+                    }
+                }
+            )
+        }
+    }
+
+    HorizontalPager(
+        state = pagerState,
+        modifier = modifier
+    ) { page ->
+        tabContents.getOrNull(page)?.content?.invoke() ?: Text("Page $page")
+    }
+}

core/designsystem/src/main/java/com/mifos/core/designsystem/utility/TabContent.kt

@@ -0,0 +1,10 @@
+package com.mifos.core.designsystem.utility
+
+import androidx.compose.runtime.Composable
+
+data class TabContent(
+
+    val tabName: String,
+
+    val content: @Composable () -> Unit
+)

feature/collection-sheet/src/main/java/com/mifos/feature/individual_collection_sheet/individual_collection_sheet/ui/IndividualCollectionSheetScreen.kt

@@ -0,0 +1,110 @@
+@file:OptIn(ExperimentalFoundationApi::class, ExperimentalMaterial3Api::class)
+
+package com.mifos.feature.individual_collection_sheet.individual_collection_sheet.ui
+
+import androidx.compose.foundation.ExperimentalFoundationApi
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.pager.rememberPagerState
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.rounded.ArrowBackIosNew
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.SnackbarHostState
+import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar
+import androidx.compose.material3.TopAppBarDefaults
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.font.FontStyle
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.sp
+import com.mifos.core.designsystem.component.MifosScaffold
+import com.mifos.core.designsystem.component.MifosTabRow
+import com.mifos.core.designsystem.theme.Black
+import com.mifos.core.designsystem.theme.White
+import com.mifos.core.designsystem.utility.TabContent
+import com.mifos.core.objects.collectionsheet.IndividualCollectionSheet
+import com.mifos.feature.collection_sheet.R
+import com.mifos.feature.individual_collection_sheet.new_individual_collection_sheet.ui.NewIndividualCollectionSheetScreen
+import com.mifos.feature.individual_collection_sheet.saved_individual_collection_sheet.ui.SavedIndividualCollectionSheetCompose
+
+@Composable
+fun IndividualCollectionSheetScreen(
+    onBackPressed: () -> Unit,
+    onDetail: (String, IndividualCollectionSheet) -> Unit,
+) {
+
+    val snackbarHostState = remember { SnackbarHostState() }
+
+    val pagerState = rememberPagerState(
+        pageCount = { IndividualCollectionSheetScreenContents.entries.size }
+    )
+
+    val tabContents = listOf(
+        TabContent(IndividualCollectionSheetScreenContents.NEW.name) {
+            NewIndividualCollectionSheetScreen(onDetail = onDetail)
+        },
+        TabContent(IndividualCollectionSheetScreenContents.SAVED.name) {
+            SavedIndividualCollectionSheetCompose()
+        }
+    )
+
+    MifosScaffold(
+        topBar = {
+            TopAppBar(
+                colors = TopAppBarDefaults.mediumTopAppBarColors(containerColor = White),
+                navigationIcon = {
+                    IconButton(
+                        onClick = { onBackPressed() },
+                    ) {
+                        Icon(
+                            imageVector = Icons.Rounded.ArrowBackIosNew,
+                            contentDescription = null,
+                            tint = Black,
+                        )
+                    }
+
+                },
+                title = {
+                    Text(
+                        text = stringResource(id = R.string.feature_collection_sheet_individual_collection_sheet),
+                        style = TextStyle(
+                            fontSize = 24.sp,
+                            fontWeight = FontWeight.Medium,
+                            fontStyle = FontStyle.Normal
+                        ),
+                        color = Black,
+                        textAlign = TextAlign.Start
+                    )
+
+                }
+            )
+        },
+        snackbarHostState = snackbarHostState,
+        bottomBar = { }
+    ) { paddingValues ->
+        Column(
+            modifier = Modifier.padding(paddingValues)
+        ) {
+            MifosTabRow(tabContents = tabContents, pagerState = pagerState)
+        }
+    }
+}
+
+enum class IndividualCollectionSheetScreenContents {
+    NEW,
+    SAVED
+}
+
+@Preview(showBackground = true)
+@Composable
+private fun IndividualCollectionSheetScreenPreview() {
+    IndividualCollectionSheetScreen(onBackPressed = {}, onDetail = { _, _ -> })
+}