feat: 기본 스낵바 구현

WithPeace · Jul 3, 2024 · aea42b0 · aea42b0
1 parent 863f18f
commit aea42b0
Show file tree

Hide file tree

Showing 3 changed files with 77 additions and 23 deletions.
diff --git a/app/src/main/java/com/withpeace/withpeace/WithpeaceApp.kt b/app/src/main/java/com/withpeace/withpeace/WithpeaceApp.kt
@@ -1,24 +1,34 @@
 package com.withpeace.withpeace
 
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.consumeWindowInsets
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.imePadding
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.SnackbarHost
 import androidx.compose.material3.SnackbarHostState
+import androidx.compose.material3.SnackbarResult
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
-import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
 import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.semantics.testTagsAsResourceId
+import androidx.compose.ui.unit.dp
 import androidx.navigation.NavHostController
 import androidx.navigation.compose.currentBackStackEntryAsState
 import androidx.navigation.compose.rememberNavController
 import com.withpeace.withpeace.core.designsystem.theme.WithpeaceTheme
+import com.withpeace.withpeace.core.designsystem.ui.snackbar.SnackbarState
+import com.withpeace.withpeace.core.designsystem.ui.snackbar.SnackbarType
 import com.withpeace.withpeace.navigation.WithpeaceNavHost
 import kotlinx.coroutines.launch
 
@@ -29,9 +39,18 @@ fun WithpeaceApp(
     navController: NavHostController = rememberNavController(),
 ) {
     val snackBarHostState = remember { SnackbarHostState() }
+    var snackBarState: SnackbarState =
+        remember { SnackbarState("", SnackbarType.Normal) }
     val coroutineScope = rememberCoroutineScope()
-    fun showSnackBar(message: String) = coroutineScope.launch {
-        snackBarHostState.showSnackbar(message)
+    fun showSnackBar(snackbarState: SnackbarState) = coroutineScope.launch {
+        snackBarState = snackbarState
+        snackBarHostState.currentSnackbarData?.dismiss()
+        val snackbarResult = snackBarHostState.showSnackbar(snackbarState.message)
+        when (snackbarResult) {
+            SnackbarResult.Dismissed -> Unit
+            SnackbarResult.ActionPerformed ->
+                (snackbarState.snackbarType as SnackbarType.Navigator).action()
+        }
     }
 
     val navBackStackEntry by navController.currentBackStackEntryAsState()
@@ -51,10 +70,37 @@ fun WithpeaceApp(
                 )
             }
         },
-        modifier = Modifier.fillMaxSize().semantics {
-            testTagsAsResourceId = true
+        modifier = Modifier
+            .fillMaxSize()
+            .semantics {
+                testTagsAsResourceId = true
+            },
+        snackbarHost = {
+            SnackbarHost(snackBarHostState)
+            {
+                when (snackBarState.snackbarType) {
+                    is SnackbarType.Navigator -> {}
+                    is SnackbarType.Normal -> {
+                        Row(
+                            modifier = Modifier
+                                .padding(horizontal = 24.dp)
+                                .padding(bottom = 16.dp)
+                                .imePadding()
+                                .fillMaxWidth()
+                                .clip(RoundedCornerShape(4.dp))
+                                .background(WithpeaceTheme.colors.SnackbarBlack),
+                        ) {
+                            Text(
+                                modifier = Modifier.padding(vertical = 16.dp, horizontal = 24.dp),
+                                style = WithpeaceTheme.typography.caption,
+                                text = it.visuals.message,
+                                color = WithpeaceTheme.colors.SystemWhite,
+                            )
+                        }
+                    }
+                }
+            }
         },
-        snackbarHost = { SnackbarHost(snackBarHostState) },
         containerColor = WithpeaceTheme.colors.SystemWhite,
     ) { innerPadding ->
         WithpeaceNavHost(

diff --git a/app/src/main/java/com/withpeace/withpeace/navigation/NavHost.kt b/app/src/main/java/com/withpeace/withpeace/navigation/NavHost.kt
@@ -8,6 +8,7 @@ import androidx.navigation.navOptions
 import androidx.navigation.navigation
 import com.app.profileeditor.navigation.navigateProfileEditor
 import com.app.profileeditor.navigation.profileEditorNavGraph
+import com.withpeace.withpeace.core.designsystem.ui.snackbar.SnackbarState
 import com.withpeace.withpeace.feature.gallery.navigation.galleryNavGraph
 import com.withpeace.withpeace.feature.gallery.navigation.navigateToGallery
 import com.withpeace.withpeace.feature.home.navigation.homeNavGraph
@@ -46,15 +47,15 @@ fun WithpeaceNavHost(
     modifier: Modifier = Modifier,
     navController: NavHostController,
     startDestination: String = LOGIN_ROUTE,
-    onShowSnackBar: (message: String) -> Unit,
+    onShowSnackBar: (SnackbarState) -> Unit,
 ) {
     NavHost(
         modifier = modifier,
         navController = navController,
         startDestination = startDestination,
     ) {
         loginNavGraph(
-            onShowSnackBar = onShowSnackBar,
+            onShowSnackBar = { onShowSnackBar(SnackbarState(it)) },
             onSignUpNeeded = {
                 navController.navigateToPolicyConsent()
             },
@@ -70,7 +71,7 @@ fun WithpeaceNavHost(
             },
         )
         policyConsentGraph(
-            onShowSnackBar = onShowSnackBar,
+            onShowSnackBar = { onShowSnackBar(SnackbarState(it)) },
             onSuccessToNext = {
                 navController.navigateSignUp()
             },
@@ -82,21 +83,21 @@ fun WithpeaceNavHost(
             },
         )
         termsOfServiceGraph(
-            onShowSnackBar = onShowSnackBar,
+            onShowSnackBar = { onShowSnackBar(SnackbarState(it)) },
             onClickBackButton = {
                 navController.popBackStack()
             },
         )
 
         privacyPolicyGraph(
-            onShowSnackBar = onShowSnackBar,
+            onShowSnackBar = { onShowSnackBar(SnackbarState(it)) },
             onClickBackButton = {
                 navController.popBackStack()
             },
         )
 
         signUpNavGraph(
-            onShowSnackBar = onShowSnackBar,
+            onShowSnackBar = { onShowSnackBar(SnackbarState(it)) },
             onNavigateToGallery = {
                 navController.navigateToGallery(imageLimit = 1)
             },
@@ -112,7 +113,7 @@ fun WithpeaceNavHost(
             },
         )
         registerPostNavGraph(
-            onShowSnackBar = onShowSnackBar,
+            onShowSnackBar = { onShowSnackBar(SnackbarState(it)) },
             onCompleteRegisterPost = { postId ->
                 navController.navigateToPostDetail(
                     postId,
@@ -160,21 +161,21 @@ fun WithpeaceNavHost(
                 )
                 navController.popBackStack()
             },
-            onShowSnackBar = onShowSnackBar,
+            onShowSnackBar = { onShowSnackBar(SnackbarState(it)) },
         )
         homeNavGraph(
-            onShowSnackBar = onShowSnackBar,
+            onShowSnackBar = { onShowSnackBar(SnackbarState(it)) },
             onPolicyClick = {
                 navController.navigateToPolicyDetail(policy = it)
             },
         )
         policyDetailNavGraph(
-            onShowSnackBar = onShowSnackBar,
+            onShowSnackBar = { onShowSnackBar(SnackbarState(it)) },
             onClickBackButton = { navController.popBackStack() },
         )
         navigation(startDestination = MY_PAGE_ROUTE, MY_PAGE_NESTED_ROUTE) {
             myPageNavGraph(
-                onShowSnackBar = onShowSnackBar,
+                onShowSnackBar = { onShowSnackBar(SnackbarState(it)) },
                 onEditProfile = { nickname, profileImageUrl ->
                     navController.navigateProfileEditor(
                         nickname = nickname,
@@ -204,7 +205,7 @@ fun WithpeaceNavHost(
                 },
             )
             profileEditorNavGraph(
-                onShowSnackBar = onShowSnackBar,
+                onShowSnackBar = { onShowSnackBar(SnackbarState(it)) },
                 onClickBackButton = {
                     navController.popBackStack()
                 },
@@ -225,7 +226,7 @@ fun WithpeaceNavHost(
             )
         }
         postDetailGraph(
-            onShowSnackBar = onShowSnackBar,
+            onShowSnackBar = { onShowSnackBar(SnackbarState(it)) },
             onClickBackButton = navController::popBackStack,
             onClickEditButton = {
                 navController.currentBackStackEntry?.savedStateHandle?.set(
@@ -242,10 +243,10 @@ fun WithpeaceNavHost(
                     set(POST_LIST_DELETED_POST_ID_ARGUMENT, it)
                 }
                 navController.popBackStack()
-            }
+            },
         )
         postListGraph(
-            onShowSnackBar = onShowSnackBar,
+            onShowSnackBar = { onShowSnackBar(SnackbarState(it)) },
             navigateToPostDetail = navController::navigateToPostDetail,
             onAuthExpired = {
                 onAuthExpired(onShowSnackBar, navController)
@@ -255,10 +256,10 @@ fun WithpeaceNavHost(
 }
 
 private fun onAuthExpired(
-    onShowSnackBar: (message: String) -> Unit,
+    onShowSnackBar: (SnackbarState) -> Unit,
     navController: NavHostController,
 ) {
-    onShowSnackBar("세션이 만료되었습니다. 로그인 후 다시 시도해 주세요.")
+    onShowSnackBar(SnackbarState("세션이 만료되었습니다. 로그인 후 다시 시도해 주세요."))
     navController.navigateLogin(
         navOptions = navOptions {
             popUpTo(navController.graph.id) {

diff --git a/...m/src/main/java/com/withpeace/withpeace/core/designsystem/ui/snackbar/CheonghaSnackbar.kt b/...m/src/main/java/com/withpeace/withpeace/core/designsystem/ui/snackbar/CheonghaSnackbar.kt
@@ -0,0 +1,7 @@
+package com.withpeace.withpeace.core.designsystem.ui.snackbar
+
+import androidx.compose.runtime.Composable
+
+@Composable
+fun CheonghaSnackbar() {
+}