[feature/setup-navigation] Set up navigation between Home-Post screens (#17)

l2hyunwoo · web-flow · commit fe69d669c82a · 2023-11-05T01:38:47.000+09:00
* Set up navigation between home and post

* Add DeleteTaskDialog

* Change method of deleteTask in repository

* Add delete dialog show logic and delete logic

* Change container color of dialog
diff --git a/app/src/main/java/com/conf/mad/todo/TodoApp.kt b/app/src/main/java/com/conf/mad/todo/TodoApp.kt
@@ -8,6 +8,7 @@ import com.conf.mad.todo.designsystem.TodoTheme
 import com.conf.mad.todo.home.HOME_SCREEN_ROUTE
 import com.conf.mad.todo.home.homeScreen
 import com.conf.mad.todo.post.POST_SCREEN_ROUTE
+import com.conf.mad.todo.post.POST_SCREEN_TASK_DEFAULT_ID
 import com.conf.mad.todo.post.postScreen
 
 @Composable
@@ -19,8 +20,19 @@ fun TodoApp(
             navController = navController,
             startDestination = HOME_SCREEN_ROUTE
         ) {
-            homeScreen(onPost = { navController.navigate(POST_SCREEN_ROUTE) })
-            postScreen()
+            homeScreen(
+                onPost = {
+                    navController.navigate("${POST_SCREEN_ROUTE}/${POST_SCREEN_TASK_DEFAULT_ID}")
+                }
+            )
+            postScreen(
+                onCancel = { navController.popBackStack() },
+                onComplete = {
+                    navController.navigate(HOME_SCREEN_ROUTE) {
+                        launchSingleTop = true
+                    }
+                }
+            )
         }
     }
 }
diff --git a/core/ui/src/main/java/com/conf/mad/todo/ui/Clickable.kt b/core/ui/src/main/java/com/conf/mad/todo/ui/Clickable.kt
@@ -1,6 +1,8 @@
 package com.conf.mad.todo.ui
 
+import androidx.compose.foundation.ExperimentalFoundationApi
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.combinedClickable
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
@@ -18,3 +20,17 @@ inline fun Modifier.noRippleClickable(
         onClick()
     }
 )
+
+@OptIn(ExperimentalFoundationApi::class)
+@Composable
+inline fun Modifier.noRippleCombinedClickable(
+    noinline onClick: () -> Unit,
+    noinline onLongClick: () -> Unit
+): Modifier = composed {
+    this.combinedClickable(
+        onClick = onClick,
+        onLongClick = onLongClick,
+        indication = null,
+        interactionSource = remember { MutableInteractionSource() }
+    )
+}
diff --git a/data/task/src/main/java/com/conf/mad/todo/data/task/repository/DefaultTaskRepository.kt b/data/task/src/main/java/com/conf/mad/todo/data/task/repository/DefaultTaskRepository.kt
@@ -25,7 +25,7 @@ class DefaultTaskRepository @Inject constructor(
     }
 
     override suspend fun deleteTask(task: Task) {
-        taskDao.insertTask(task.toEntity())
+        taskDao.deleteTask(task.toEntity())
     }
 
     override suspend fun updateFavorite(id: Long, isFavorite: Boolean) {
diff --git a/feature/home/src/main/java/com/conf/mad/todo/home/HomeScreen.kt b/feature/home/src/main/java/com/conf/mad/todo/home/HomeScreen.kt
@@ -12,6 +12,7 @@ import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
+import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
 import androidx.hilt.navigation.compose.hiltViewModel
@@ -20,6 +21,7 @@ import androidx.navigation.NavGraphBuilder
 import androidx.navigation.compose.composable
 import com.conf.mad.todo.designsystem.TodoTheme
 import com.conf.mad.todo.designsystem.preview.DevicePreview
+import com.conf.mad.todo.home.component.DeleteTaskDialog
 import com.conf.mad.todo.home.component.HomeBottomAppBar
 import com.conf.mad.todo.home.component.HomeTopAppBar
 import com.conf.mad.todo.home.component.TaskItem
@@ -47,8 +49,12 @@ fun HomeScreen(
     viewModel: HomeViewModel = hiltViewModel()
 ) {
     val uiState by viewModel.uiState.collectAsStateWithLifecycle()
+    val isDeleteDialogVisible = remember(uiState.taskToDelete) {
+        uiState.taskToDelete != null
+    }
     HomeScreen(
         isCompletedTaskVisible = uiState.isCompletedTaskVisible,
+        isDeleteDialogVisible = isDeleteDialogVisible,
         currentDestination = uiState.currentDestination,
         todos = uiState.todoTasks,
         completedTasks = uiState.completedTasks,
@@ -57,12 +63,16 @@ fun HomeScreen(
         onPost = onPost,
         onFavoriteChanged = viewModel::onFavoriteChanged,
         onCompletedChanged = viewModel::onCompletedChanged,
+        onSelectTaskToDelete = viewModel::onSelectTaskToDelete,
+        onDeleteDialogDismiss = viewModel::onDismissDeleteDialog,
+        onDeleteTask = viewModel::onDeleteTask
     )
 }
 
 @Composable
 fun HomeScreen(
     isCompletedTaskVisible: Boolean,
+    isDeleteDialogVisible: Boolean,
     currentDestination: HomeMenu,
     todos: ImmutableList<TaskUiModel>,
     completedTasks: ImmutableList<TaskUiModel>,
@@ -71,6 +81,9 @@ fun HomeScreen(
     onPost: () -> Unit,
     onFavoriteChanged: (Long, Boolean) -> Unit,
     onCompletedChanged: (Long, Boolean) -> Unit,
+    onSelectTaskToDelete: (task: TaskUiModel) -> Unit,
+    onDeleteDialogDismiss: () -> Unit,
+    onDeleteTask: () -> Unit
 ) {
     Scaffold(
         modifier = Modifier
@@ -129,6 +142,7 @@ fun HomeScreen(
                             !todo.isFavorite
                         )
                     },
+                    onDeleteDialogShow = { onSelectTaskToDelete(todo) }
                 )
             }
             if (isCompletedTaskVisible) {
@@ -159,10 +173,17 @@ fun HomeScreen(
                                 !task.isFavorite
                             )
                         },
+                        onDeleteDialogShow = { onSelectTaskToDelete(task) }
                     )
                 }
             }
         }
+        if (isDeleteDialogVisible) {
+            DeleteTaskDialog(
+                onDismissRequest = onDeleteDialogDismiss,
+                onConfirm = onDeleteTask
+            )
+        }
     }
 }
 
@@ -204,6 +225,7 @@ private fun HomeScreenPreview() {
     TodoTheme {
         HomeScreen(
             isCompletedTaskVisible = true,
+            isDeleteDialogVisible = false,
             currentDestination = HomeMenu.POST,
             todos = todos,
             completedTasks = completedTasks,
@@ -212,6 +234,9 @@ private fun HomeScreenPreview() {
             onPost = {},
             onFavoriteChanged = { _, _ -> },
             onCompletedChanged = { _, _ -> },
+            onSelectTaskToDelete = {},
+            onDeleteDialogDismiss = {},
+            onDeleteTask = {}
         )
     }
 }
diff --git a/feature/home/src/main/java/com/conf/mad/todo/home/HomeViewModel.kt b/feature/home/src/main/java/com/conf/mad/todo/home/HomeViewModel.kt
@@ -74,4 +74,26 @@ class HomeViewModel @Inject constructor(
             repository.updateCompleted(id, isCompleted)
         }
     }
+
+    fun onSelectTaskToDelete(task: TaskUiModel) {
+        _uiState.update {
+            it.copy(taskToDelete = task)
+        }
+    }
+
+    fun onDeleteTask() {
+        viewModelScope.launch {
+            val task = uiState.value.taskToDelete ?: return@launch
+            repository.deleteTask(task.asDomain())
+            _uiState.update {
+                it.copy(taskToDelete = null)
+            }
+        }
+    }
+
+    fun onDismissDeleteDialog() {
+        _uiState.update {
+            it.copy(taskToDelete = null)
+        }
+    }
 }
diff --git a/feature/home/src/main/java/com/conf/mad/todo/home/component/DeleteTaskDialog.kt b/feature/home/src/main/java/com/conf/mad/todo/home/component/DeleteTaskDialog.kt
@@ -0,0 +1,98 @@
+package com.conf.mad.todo.home.component
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.Card
+import androidx.compose.material3.CardDefaults
+import androidx.compose.material3.Text
+import androidx.compose.material3.TextButton
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import androidx.compose.ui.window.Dialog
+import com.conf.mad.todo.designsystem.TodoTheme
+import com.conf.mad.todo.designsystem.preview.DevicePreview
+
+@Composable
+fun DeleteTaskDialog(
+    onDismissRequest: () -> Unit,
+    onConfirm: () -> Unit
+) {
+    Dialog(onDismissRequest = onDismissRequest) {
+        Card(
+            modifier = Modifier
+                .padding(16.dp)
+                .height(240.dp)
+                .fillMaxWidth(),
+            shape = RoundedCornerShape(4.dp),
+            colors = CardDefaults.cardColors(containerColor = TodoTheme.colors.surface)
+        ) {
+            Column(
+                modifier = Modifier
+                    .fillMaxSize()
+                    .padding(24.dp),
+                verticalArrangement = Arrangement.SpaceBetween
+            ) {
+                Column(modifier = Modifier.fillMaxWidth()) {
+                    Text(
+                        text = "투두를 삭제할까요?",
+                        style = TodoTheme.typography.medium1.copy(fontSize = 20.sp),
+                        color = TodoTheme.colors.onSurface60
+                    )
+                    Spacer(modifier = Modifier.height(16.dp))
+                    Text(
+                        text = "삭제하면 되돌릴 수 없어요.",
+                        style = TodoTheme.typography.regular1,
+                        color = TodoTheme.colors.onSurface50
+                    )
+                }
+                Row(
+                    modifier = Modifier.fillMaxWidth(),
+                    horizontalArrangement = Arrangement.End,
+                    verticalAlignment = Alignment.Bottom
+                ) {
+                    TextButton(
+                        onClick = onDismissRequest,
+                    ) {
+                        Text(
+                            text = "취소",
+                            style = TodoTheme.typography.medium1,
+                            color = TodoTheme.colors.onSurface60
+                        )
+                    }
+                    Spacer(modifier = Modifier.width(8.dp))
+                    TextButton(
+                        onClick = onConfirm,
+                    ) {
+                        Text(
+                            text = "삭제하기",
+                            style = TodoTheme.typography.medium1,
+                            color = TodoTheme.colors.primary
+                        )
+                    }
+                }
+            }
+        }
+    }
+}
+
+@DevicePreview
+@Composable
+private fun DeleteTaskDialogPreview() {
+    TodoTheme {
+        DeleteTaskDialog(
+            onDismissRequest = {},
+            onConfirm = {}
+        )
+    }
+}
diff --git a/feature/home/src/main/java/com/conf/mad/todo/home/component/TaskItem.kt b/feature/home/src/main/java/com/conf/mad/todo/home/component/TaskItem.kt
@@ -1,7 +1,9 @@
 package com.conf.mad.todo.home.component
 
+import androidx.compose.foundation.ExperimentalFoundationApi
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
+import androidx.compose.foundation.combinedClickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
@@ -20,6 +22,7 @@ import com.conf.mad.todo.home.R
 import com.conf.mad.todo.home.model.TaskStatus
 import com.conf.mad.todo.ui.noRippleClickable
 
+@OptIn(ExperimentalFoundationApi::class)
 @Composable
 internal fun TaskItem(
     modifier: Modifier = Modifier,
@@ -28,6 +31,7 @@ internal fun TaskItem(
     isFavorite: Boolean,
     onCompletedValueChange: () -> Unit,
     onFavoriteValueChange: () -> Unit,
+    onDeleteDialogShow: () -> Unit
 ) {
     Row(
         modifier = modifier
@@ -37,7 +41,10 @@ internal fun TaskItem(
     ) {
         Row(
             modifier = Modifier
-                .noRippleClickable(onClick = onCompletedValueChange),
+                .combinedClickable(
+                    onClick = onCompletedValueChange,
+                    onLongClick = onDeleteDialogShow
+                ).weight(1f),
             verticalAlignment = Alignment.CenterVertically
         ) {
             Image(
@@ -93,7 +100,8 @@ private fun TaskItemPreview() {
             status = TaskStatus.DONE,
             isFavorite = false,
             onCompletedValueChange = {},
-            onFavoriteValueChange = {}
+            onFavoriteValueChange = {},
+            onDeleteDialogShow = {}
         )
     }
 }
diff --git a/feature/home/src/main/java/com/conf/mad/todo/home/model/HomeUiState.kt b/feature/home/src/main/java/com/conf/mad/todo/home/model/HomeUiState.kt
@@ -6,6 +6,7 @@ import kotlinx.collections.immutable.persistentListOf
 data class HomeUiState(
     val isCompletedTaskVisible: Boolean = true,
     val currentDestination: HomeMenu = HomeMenu.TASK,
+    val taskToDelete: TaskUiModel? = null,
     val todoTasks: ImmutableList<TaskUiModel> = persistentListOf(),
     val completedTasks: ImmutableList<TaskUiModel> = persistentListOf()
 ) {
diff --git a/feature/home/src/main/java/com/conf/mad/todo/home/model/TaskUiModel.kt b/feature/home/src/main/java/com/conf/mad/todo/home/model/TaskUiModel.kt
@@ -20,6 +20,14 @@ data class TaskUiModel(
         isFavorite = task.isFavorite
     )
 
+    fun asDomain() = Task(
+        id = id,
+        title = title,
+        description = description,
+        isFavorite = isFavorite,
+        isCompleted = isCompleted
+    )
+
     companion object {
         fun of(task: Task) = TaskUiModel(task)
     }
diff --git a/feature/post/src/main/java/com/conf/mad/todo/post/PostScreen.kt b/feature/post/src/main/java/com/conf/mad/todo/post/PostScreen.kt
diff --git a/feature/post/src/main/java/com/conf/mad/todo/post/PostViewModel.kt b/feature/post/src/main/java/com/conf/mad/todo/post/PostViewModel.kt
diff --git a/feature/post/src/main/java/com/conf/mad/todo/post/model/PostUiState.kt b/feature/post/src/main/java/com/conf/mad/todo/post/model/PostUiState.kt

Original file line number	Diff line number	Diff line change
`@@ -25,7 +25,7 @@ class DefaultTaskRepository @Inject constructor(`
`25`	`25`	`}`
`26`	`26`
`27`	`27`	`override suspend fun deleteTask(task: Task) {`
`28`		`- taskDao.insertTask(task.toEntity())`
	`28`	`+ taskDao.deleteTask(task.toEntity())`
`29`	`29`	`}`
`30`	`30`
`31`	`31`	`override suspend fun updateFavorite(id: Long, isFavorite: Boolean) {`
Original file line number	Diff line number	Diff line change
`@@ -20,6 +20,14 @@ data class TaskUiModel(`
`20`	`20`	`isFavorite = task.isFavorite`
`21`	`21`	`)`
`22`	`22`
	`23`	`+ fun asDomain() = Task(`
	`24`	`+ id = id,`
	`25`	`+ title = title,`
	`26`	`+ description = description,`
	`27`	`+ isFavorite = isFavorite,`
	`28`	`+ isCompleted = isCompleted`
	`29`	`+ )`
	`30`	`+`
`23`	`31`	`companion object {`
`24`	`32`	`fun of(task: Task) = TaskUiModel(task)`
`25`	`33`	`}`