Merge pull request #91 from luongvo/release/0.6.0

Release 0.6.0

android/build.gradle.kts

@@ -125,6 +125,7 @@ dependencies {
         implementation(ACCOMPANIST_PLACEHOLDER)
         implementation(COIL_COMPOSE)
         implementation(CONSTRAINT_LAYOUT)
+        implementation(LOTTIE)
         implementation(NUMBERPICKER)
     }
     with(Dependencies.Firebase) {

android/src/main/java/vn/luongvo/kmm/survey/android/ui/common/ConfirmationDialog.kt

@@ -0,0 +1,61 @@
+package vn.luongvo.kmm.survey.android.ui.common
+
+import androidx.compose.material.*
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.graphics.Color.Companion.White
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.tooling.preview.Preview
+import vn.luongvo.kmm.survey.android.R
+import vn.luongvo.kmm.survey.android.ui.theme.Nero90
+
+@Composable
+fun ConfirmationDialog(
+    title: String,
+    message: String,
+    onDismissRequest: () -> Unit,
+    onConfirmButtonClick: () -> Unit = onDismissRequest,
+    onDismissButtonClick: () -> Unit = onDismissRequest
+) {
+    AlertDialog(
+        title = { Text(text = title) },
+        text = { Text(text = message) },
+        backgroundColor = White,
+        confirmButton = {
+            Button(
+                onClick = { onConfirmButtonClick() },
+                colors = ButtonDefaults.buttonColors(
+                    backgroundColor = Nero90
+                ),
+            ) {
+                Text(
+                    text = stringResource(id = R.string.generic_yes),
+                    color = White
+                )
+            }
+        },
+        dismissButton = {
+            Button(
+                onClick = { onDismissButtonClick() },
+                colors = ButtonDefaults.buttonColors(
+                    backgroundColor = Nero90
+                ),
+            ) {
+                Text(
+                    text = stringResource(id = R.string.generic_no),
+                    color = White
+                )
+            }
+        },
+        onDismissRequest = { onDismissRequest() }
+    )
+}
+
+@Preview(showBackground = true)
+@Composable
+fun ConfirmationDialogPreview() {
+    ConfirmationDialog(
+        title = "Title",
+        message = "Message",
+        onDismissRequest = {}
+    )
+}

android/src/main/java/vn/luongvo/kmm/survey/android/ui/navigation/AppNavigation.kt

@@ -35,7 +35,9 @@ fun AppNavigation(
             )
         }
         composable(AppDestination.Completion) {
-            CompletionScreen()
+            CompletionScreen(
+                navigator = { destination -> navController.navigate(destination) }
+            )
         }
     }
 }

android/src/main/java/vn/luongvo/kmm/survey/android/ui/screens/completion/CompletionScreen.kt

@@ -1,22 +1,66 @@
 package vn.luongvo.kmm.survey.android.ui.screens.completion
 
-import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.*
 import androidx.compose.material.Text
-import androidx.compose.runtime.Composable
+import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color.Companion.White
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.airbnb.lottie.compose.*
+import kotlinx.coroutines.delay
+import vn.luongvo.kmm.survey.android.R
+import vn.luongvo.kmm.survey.android.ui.navigation.AppDestination
+import vn.luongvo.kmm.survey.android.ui.theme.AppTheme
+import vn.luongvo.kmm.survey.android.ui.theme.AppTheme.typography
 import vn.luongvo.kmm.survey.android.ui.theme.ComposeTheme
 
+private const val ANIMATION_PROGRESS_COMPLETED = 1.0f
+private const val ANIMATION_DELAY_FOR_NAVIGATION = 1000L
+
+@Composable
+fun CompletionScreen(
+    navigator: (destination: AppDestination) -> Unit
+) {
+    CompletionScreenContent {
+        navigator(AppDestination.Up)
+    }
+}
+
 @Composable
-fun CompletionScreen() {
-    //  TODO https://github.com/luongvo/kmm-survey/issues/35
-    Box {
+private fun CompletionScreenContent(
+    onAnimationCompleted: () -> Unit
+) {
+    val composition by rememberLottieComposition(LottieCompositionSpec.RawRes(R.raw.completion_success))
+    val progress by animateLottieCompositionAsState(composition)
+
+    LaunchedEffect(progress) {
+        if (progress == ANIMATION_PROGRESS_COMPLETED) {
+            delay(ANIMATION_DELAY_FOR_NAVIGATION)
+            onAnimationCompleted()
+        }
+    }
+
+    Column(
+        verticalArrangement = Arrangement.Center,
+        modifier = Modifier
+            .fillMaxSize()
+            .padding(horizontal = AppTheme.dimensions.paddingLarge)
+    ) {
+        LottieAnimation(
+            composition = composition,
+            modifier = Modifier
+                .size(200.dp)
+                .align(Alignment.CenterHorizontally)
+        )
         Text(
-            text = "Completion Page",
+            text = stringResource(R.string.completion_thanks_message),
             color = White,
-            modifier = Modifier.align(Alignment.Center)
+            style = typography.h5,
+            textAlign = TextAlign.Center
         )
     }
 }
@@ -25,6 +69,6 @@ fun CompletionScreen() {
 @Composable
 fun CompletionScreenPreview() {
     ComposeTheme {
-        CompletionScreen()
+        CompletionScreenContent {}
     }
 }

android/src/main/java/vn/luongvo/kmm/survey/android/ui/screens/home/HomeScreen.kt

@@ -1,7 +1,9 @@
 package vn.luongvo.kmm.survey.android.ui.screens.home
 
 import androidx.compose.foundation.layout.*
+import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.material.*
+import androidx.compose.material.pullrefresh.*
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -18,6 +20,7 @@ import vn.luongvo.kmm.survey.android.ui.common.RtlModalDrawer
 import vn.luongvo.kmm.survey.android.ui.navigation.AppDestination
 import vn.luongvo.kmm.survey.android.ui.preview.*
 import vn.luongvo.kmm.survey.android.ui.screens.home.views.*
+import vn.luongvo.kmm.survey.android.ui.theme.AppTheme.colors
 import vn.luongvo.kmm.survey.android.ui.theme.AppTheme.dimensions
 import vn.luongvo.kmm.survey.android.ui.theme.ComposeTheme
 import vn.luongvo.kmm.survey.android.util.userReadableMessage
@@ -32,6 +35,7 @@ fun HomeScreen(
     navigator: (destination: AppDestination) -> Unit
 ) {
     val isLoading by viewModel.isLoading.collectAsStateWithLifecycle()
+    val isRefreshing by viewModel.isRefreshing.collectAsStateWithLifecycle()
     val error by viewModel.error.collectAsStateWithLifecycle()
     val currentDate by viewModel.currentDate.collectAsStateWithLifecycle()
     val user by viewModel.user.collectAsStateWithLifecycle()
@@ -60,10 +64,12 @@ fun HomeScreen(
         appVersion = appVersion,
         scaffoldState = scaffoldState,
         isLoading = isLoading,
+        isRefreshing = isRefreshing,
         currentDate = currentDate,
         user = user,
         surveys = surveys,
         onSurveyClick = { survey -> viewModel.navigateToSurvey(survey?.id.orEmpty()) },
+        onRefresh = { viewModel.loadData(isRefresh = true) },
         onMenuLogoutClick = { viewModel.logOut() }
     )
 }
@@ -74,10 +80,12 @@ private fun HomeScreenWithDrawer(
     initialDrawerState: DrawerValue = DrawerValue.Closed,
     scaffoldState: ScaffoldState,
     isLoading: Boolean,
+    isRefreshing: Boolean,
     currentDate: String,
     user: UserUiModel?,
     surveys: List<SurveyUiModel>,
     onSurveyClick: (SurveyUiModel?) -> Unit,
+    onRefresh: () -> Unit,
     onMenuLogoutClick: () -> Unit
 ) {
     val drawerState = rememberDrawerState(initialDrawerState)
@@ -100,28 +108,36 @@ private fun HomeScreenWithDrawer(
         HomeScreenContent(
             scaffoldState = scaffoldState,
             isLoading = isLoading,
+            isRefreshing = isRefreshing,
             currentDate = currentDate,
             user = user,
             surveys = surveys,
             onSurveyClick = onSurveyClick,
             onUserAvatarClick = {
                 scope.launch { drawerState.open() }
-            }
+            },
+            onRefresh = onRefresh
         )
     }
 }
 
-@OptIn(ExperimentalPagerApi::class)
+@OptIn(ExperimentalPagerApi::class, ExperimentalMaterialApi::class)
 @Composable
 private fun HomeScreenContent(
     scaffoldState: ScaffoldState,
     isLoading: Boolean,
+    isRefreshing: Boolean,
     currentDate: String,
     user: UserUiModel?,
     surveys: List<SurveyUiModel>,
     onSurveyClick: (SurveyUiModel?) -> Unit,
-    onUserAvatarClick: () -> Unit
+    onUserAvatarClick: () -> Unit,
+    onRefresh: () -> Unit
 ) {
+    val refreshingState = rememberPullRefreshState(
+        refreshing = isRefreshing,
+        onRefresh = onRefresh
+    )
     val pagerState = rememberPagerState()
     var survey by remember { mutableStateOf<SurveyUiModel?>(null) }
 
@@ -135,37 +151,53 @@ private fun HomeScreenContent(
         Box(
             modifier = Modifier
                 .fillMaxSize()
+                .pullRefresh(refreshingState)
                 .padding(padding)
         ) {
-            HorizontalPager(
-                count = surveys.size,
-                state = pagerState,
-                modifier = Modifier.fillMaxSize()
-            ) { index ->
-                DimmedImageBackground(
-                    imageUrl = surveys[index].coverImageUrl
-                )
-            }
+            // pullRefresh needs a vertical scroll component to work
+            LazyColumn(modifier = Modifier.fillMaxSize()) {
+                item {
+                    Box(modifier = Modifier.fillParentMaxHeight()) {
+                        HorizontalPager(
+                            count = surveys.size,
+                            state = pagerState,
+                            modifier = Modifier.fillMaxSize()
+                        ) { index ->
+                            DimmedImageBackground(
+                                imageUrl = surveys[index].coverImageUrl
+                            )
+                        }
 
-            HomeHeader(
-                isLoading = isLoading,
-                dateTime = currentDate,
-                user = user,
-                onUserAvatarClick = onUserAvatarClick,
-                modifier = Modifier
-                    .statusBarsPadding()
-                    .padding(top = dimensions.paddingSmall)
-            )
+                        HomeHeader(
+                            isLoading = isLoading,
+                            dateTime = currentDate,
+                            user = user,
+                            onUserAvatarClick = onUserAvatarClick,
+                            modifier = Modifier
+                                .statusBarsPadding()
+                                .padding(top = dimensions.paddingSmall)
+                        )
 
-            HomeFooter(
-                pagerState = pagerState,
-                isLoading = isLoading,
-                survey = survey,
-                modifier = Modifier
-                    .navigationBarsPadding()
-                    .align(Alignment.BottomCenter)
-                    .padding(bottom = dimensions.paddingHuge),
-                onSurveyClick = onSurveyClick
+                        HomeFooter(
+                            pagerState = pagerState,
+                            isLoading = isLoading,
+                            survey = survey,
+                            modifier = Modifier
+                                .navigationBarsPadding()
+                                .align(Alignment.BottomCenter)
+                                .padding(bottom = dimensions.paddingHuge),
+                            onSurveyClick = onSurveyClick
+                        )
+                    }
+                }
+            }
+
+            PullRefreshIndicator(
+                refreshing = isRefreshing,
+                state = refreshingState,
+                backgroundColor = colors.pullRefreshBackground,
+                contentColor = colors.pullRefreshContent,
+                modifier = Modifier.align(alignment = Alignment.TopCenter)
             )
         }
     }
@@ -183,10 +215,12 @@ fun HomeScreenPreview(
                 initialDrawerState = drawerState,
                 scaffoldState = rememberScaffoldState(),
                 isLoading = isLoading,
+                isRefreshing = isLoading,
                 currentDate = currentDate,
                 user = user,
                 surveys = surveys,
                 onSurveyClick = {},
+                onRefresh = {},
                 onMenuLogoutClick = {}
             )
         }