🔀 :: (#253) 메세지 화면 구현

app/build.gradle.kts

@@ -15,6 +15,7 @@ dependencies {
     implementation(project(":feature:detail"))
     implementation(project(":feature:friend"))
     implementation(project(":feature:management"))
+    implementation(project(":feature:message"))
     implementation(project(":core:designsystem"))
     implementation(project(":core:navigation"))
     implementation(project(":core:util"))

app/src/main/java/com/idiotfrogs/memoryseal/MainActivity.kt

@@ -27,6 +27,7 @@ import com.idiotfrogs.detail.DetailRoute
 import com.idiotfrogs.friend.FriendRoute
 import com.idiotfrogs.home.HomeRoute
 import com.idiotfrogs.management.ManagementRoute
+import com.idiotfrogs.message.MessageRoute
 import com.idiotfrogs.navigation.LocalComposeMSNavigator
 import com.idiotfrogs.navigation.MSNavigatorImpl
 import com.idiotfrogs.navigation.Routes
@@ -84,11 +85,8 @@ class MainActivity : ComponentActivity() {
                                 entry<Routes.Profile> { ProfileRoute() }
                                 entry<Routes.EditProfile> { EditProfileRoute() }
                                 entry<Routes.Setting> { SettingRoute() }
-                                entry<Routes.Detail> { DetailRoute(it.id) }
-                                entry<Routes.Message> {
-                                    // TODO 메시지 화면 퍼블리싱 후 추가하기
-                                    it.id
-                                }
+                                entry<Routes.Detail> { DetailRoute(capsuleId = it.id) }
+                                entry<Routes.Message> { MessageRoute(capsuleId = it.id) }
                                 entry<Routes.Friend> { FriendRoute(it.id) }
                                 entry<Routes.Management> {
                                     ManagementRoute(

feature/home/src/main/java/com/idiotfrogs/home/component/HomeTabBar.kt → core/designsystem/src/main/java/com/idiotfrogs/designsystem/component/MSTabBar.kt

@@ -1,4 +1,4 @@
-package com.idiotfrogs.home.component
+package com.idiotfrogs.designsystem.component
 
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.padding
@@ -9,70 +9,61 @@ import androidx.compose.material3.TabRow
 import androidx.compose.material3.TabRowDefaults.tabIndicatorOffset
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
-import androidx.compose.runtime.getValue
-import androidx.compose.runtime.mutableStateOf
-import androidx.compose.runtime.remember
-import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import com.idiotfrogs.designsystem.component.MSText
 import com.idiotfrogs.designsystem.theme.MSTheme
 import com.idiotfrogs.designsystem.util.DrawType
 import com.idiotfrogs.designsystem.util.wavyStroke
 
-enum class HomeTab(val title: String) {
-    CREATED("생성한 티켓"), JOINED("합류한 티켓")
-}
-
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
-fun HomeTabBar(
-    selectedTab: HomeTab,
-    onClick: (HomeTab) -> Unit,
+fun MSTabBar(
+    tabs: List<String>,
+    selectedIndex: Int,
+    onClick: (Int) -> Unit,
+    modifier: Modifier = Modifier,
 ) {
-    val homeTabs = remember { HomeTab.entries }
-
     CompositionLocalProvider(LocalRippleConfiguration provides null) {
         TabRow(
-            selectedTabIndex = selectedTab.ordinal,
+            modifier = modifier,
+            selectedTabIndex = selectedIndex,
             containerColor = MSTheme.color.white,
             indicator = { tabPositions ->
                 Box(
                     modifier = Modifier
-                        .tabIndicatorOffset(tabPositions[selectedTab.ordinal])
+                        .tabIndicatorOffset(tabPositions[selectedIndex])
                         .padding(horizontal = 54.dp)
                         .wavyStroke(
                             color = MSTheme.color.greyG5,
                             drawType = DrawType.BOTTOM,
-                            spacing = 3.dp
-                    )
+                            spacing = 3.dp,
+                        )
                 )
             },
-            divider = {}
+            divider = {},
         ) {
-            homeTabs.forEach { homeTab ->
-                HomeTabItem(
-                    selected = homeTab == selectedTab,
-                    text = homeTab.title,
-                    onClick = { onClick.invoke(homeTab) }
+            tabs.forEachIndexed { index, tab ->
+                MSTabItem(
+                    selected = selectedIndex == index,
+                    text = tab,
+                    onClick = { onClick(index) },
                 )
             }
         }
     }
 }
 
 @Composable
-fun HomeTabItem(
+private fun MSTabItem(
     selected: Boolean,
     text: String,
-    onClick: () -> Unit
+    onClick: () -> Unit,
 ) {
     Tab(
         selected = selected,
         selectedContentColor = MSTheme.color.black,
         unselectedContentColor = MSTheme.color.greyG3,
-        onClick = onClick
+        onClick = onClick,
     ) {
         MSText(
             modifier = Modifier.padding(vertical = 16.dp),
@@ -81,14 +72,3 @@ fun HomeTabItem(
         )
     }
 }
-
-@Preview
-@Composable
-private fun HomeTabBarPreview() {
-    var currentTab by remember { mutableStateOf(HomeTab.CREATED) }
-
-    HomeTabBar(
-        selectedTab = currentTab,
-        onClick = { currentTab = it }
-    )
-}

core/designsystem/src/main/java/com/idiotfrogs/designsystem/component/MSTextField.kt

@@ -109,6 +109,60 @@ fun MSTextField(
     )
 }
 
+@Composable
+fun MSPlainTextField(
+    modifier: Modifier = Modifier,
+    hint: String,
+    enabled: Boolean = true,
+    readOnly: Boolean = false,
+    textFieldState: TextFieldState = rememberTextFieldState(),
+    inputTransformation: InputTransformation? = null,
+    textStyle: TextStyle = TextStyle(
+        color = MSTheme.color.greyG5,
+        fontSize = 14.dp.toSp(),
+        fontWeight = FontWeight.Normal,
+        fontFamily = pretendard,
+        lineHeight = 14.dp.toSp() * 1.6,
+    ),
+    keyboardOptions: KeyboardOptions = KeyboardOptions.Default,
+    onKeyboardAction: KeyboardActionHandler? = null,
+    lineLimits: TextFieldLineLimits = TextFieldLineLimits.MultiLine(),
+    onTextLayout: (Density.(getResult: () -> TextLayoutResult?) -> Unit)? = null,
+    cursorBrush: Brush = SolidColor(MSTheme.color.greyG5),
+    outputTransformation: OutputTransformation? = null,
+    scrollState: ScrollState = rememberScrollState(),
+) {
+    BasicTextField(
+        state = textFieldState,
+        modifier = modifier,
+        enabled = enabled,
+        readOnly = readOnly,
+        inputTransformation = inputTransformation,
+        textStyle = textStyle,
+        keyboardOptions = keyboardOptions,
+        onKeyboardAction = onKeyboardAction,
+        lineLimits = lineLimits,
+        onTextLayout = onTextLayout,
+        cursorBrush = cursorBrush,
+        outputTransformation = outputTransformation,
+        decorator = { innerTextField ->
+            Box {
+                if (textFieldState.text.isEmpty()) {
+                    MSText(
+                        text = hint,
+                        color = MSTheme.color.greyG3,
+                        fontSize = 16.dp,
+                        fontWeight = FontWeight.Normal,
+                        lineHeight = 14.dp.toSp() * 1.6,
+                    )
+                }
+                innerTextField()
+            }
+        },
+        scrollState = scrollState,
+    )
+}
+
 @Preview
 @Composable
 private fun MSTextFieldPreview() {
@@ -126,4 +180,13 @@ private fun MSTextFieldDisabledPreview() {
         enabled = false,
         hint = "별명을 입력해주세요.",
     )
-}
+}
+
+@Preview
+@Composable
+private fun MSPlainTextFieldPreview() {
+    MSPlainTextField(
+        modifier = Modifier.fillMaxWidth(),
+        hint = "공유하고 싶은 메시지를 작성해보세요!",
+    )
+}

core/designsystem/stability/designsystem-debug.stability

@@ -141,6 +141,45 @@ public fun com.idiotfrogs.designsystem.component.MSMessageItem(type: com.idiotfr
     - imageList: RUNTIME (requires runtime check)
     - isSeal: STABLE (primitive type)
 
+@Composable
+public fun com.idiotfrogs.designsystem.component.MSPlainTextField(modifier: androidx.compose.ui.Modifier, hint: kotlin.String, enabled: kotlin.Boolean, readOnly: kotlin.Boolean, textFieldState: androidx.compose.foundation.text.input.TextFieldState, inputTransformation: androidx.compose.foundation.text.input.InputTransformation?, textStyle: androidx.compose.ui.text.TextStyle, keyboardOptions: androidx.compose.foundation.text.KeyboardOptions, onKeyboardAction: androidx.compose.foundation.text.input.KeyboardActionHandler?, lineLimits: androidx.compose.foundation.text.input.TextFieldLineLimits, onTextLayout: @[ExtensionFunctionType] kotlin.Function2<androidx.compose.ui.unit.Density, @[ParameterName(name = \, cursorBrush: androidx.compose.ui.graphics.Brush, outputTransformation: androidx.compose.foundation.text.input.OutputTransformation?, scrollState: androidx.compose.foundation.ScrollState): kotlin.Unit
+  skippable: true
+  restartable: true
+  params:
+    - modifier: STABLE (marked @Stable or @Immutable)
+    - hint: STABLE (String is immutable)
+    - enabled: STABLE (primitive type)
+    - readOnly: STABLE (primitive type)
+    - textFieldState: STABLE (marked @Stable or @Immutable)
+    - inputTransformation: STABLE (marked @Stable or @Immutable)
+    - textStyle: STABLE (marked @Stable or @Immutable)
+    - keyboardOptions: STABLE (marked @Stable or @Immutable)
+    - onKeyboardAction: STABLE (marked @Stable or @Immutable)
+    - lineLimits: STABLE (marked @Stable or @Immutable)
+    - onTextLayout: STABLE (function type)
+    - cursorBrush: STABLE (marked @Stable or @Immutable)
+    - outputTransformation: STABLE (marked @Stable or @Immutable)
+    - scrollState: STABLE (marked @Stable or @Immutable)
+
+@Composable
+public fun com.idiotfrogs.designsystem.component.MSTabBar(tabs: kotlin.collections.List<kotlin.String>, selectedIndex: kotlin.Int, onClick: kotlin.Function1<kotlin.Int, kotlin.Unit>, modifier: androidx.compose.ui.Modifier): kotlin.Unit
+  skippable: false
+  restartable: true
+  params:
+    - tabs: RUNTIME (requires runtime check)
+    - selectedIndex: STABLE (primitive type)
+    - onClick: STABLE (function type)
+    - modifier: STABLE (marked @Stable or @Immutable)
+
+@Composable
+private fun com.idiotfrogs.designsystem.component.MSTabItem(selected: kotlin.Boolean, text: kotlin.String, onClick: kotlin.Function0<kotlin.Unit>): kotlin.Unit
+  skippable: true
+  restartable: true
+  params:
+    - selected: STABLE (primitive type)
+    - text: STABLE (String is immutable)
+    - onClick: STABLE (function type)
+
 @Composable
 public fun com.idiotfrogs.designsystem.component.MSText(text: kotlin.String, modifier: androidx.compose.ui.Modifier, fontSize: androidx.compose.ui.unit.Dp, color: androidx.compose.ui.graphics.Color, fontFamily: androidx.compose.ui.text.font.FontFamily, fontWeight: androidx.compose.ui.text.font.FontWeight, letterSpacing: androidx.compose.ui.unit.TextUnit, textDecoration: androidx.compose.ui.text.style.TextDecoration?, textAlign: androidx.compose.ui.text.style.TextAlign?, lineHeight: androidx.compose.ui.unit.TextUnit, overflow: androidx.compose.ui.text.style.TextOverflow, softWrap: kotlin.Boolean, maxLines: kotlin.Int, minLines: kotlin.Int, onTextLayout: kotlin.Function1<androidx.compose.ui.text.TextLayoutResult, kotlin.Unit>?, style: androidx.compose.ui.text.TextStyle): kotlin.Unit
   skippable: true

core/designsystem/stability/designsystem-release.stability

@@ -141,6 +141,45 @@ public fun com.idiotfrogs.designsystem.component.MSMessageItem(type: com.idiotfr
     - imageList: RUNTIME (requires runtime check)
     - isSeal: STABLE (primitive type)
 
+@Composable
+public fun com.idiotfrogs.designsystem.component.MSPlainTextField(modifier: androidx.compose.ui.Modifier, hint: kotlin.String, enabled: kotlin.Boolean, readOnly: kotlin.Boolean, textFieldState: androidx.compose.foundation.text.input.TextFieldState, inputTransformation: androidx.compose.foundation.text.input.InputTransformation?, textStyle: androidx.compose.ui.text.TextStyle, keyboardOptions: androidx.compose.foundation.text.KeyboardOptions, onKeyboardAction: androidx.compose.foundation.text.input.KeyboardActionHandler?, lineLimits: androidx.compose.foundation.text.input.TextFieldLineLimits, onTextLayout: @[ExtensionFunctionType] kotlin.Function2<androidx.compose.ui.unit.Density, @[ParameterName(name = \, cursorBrush: androidx.compose.ui.graphics.Brush, outputTransformation: androidx.compose.foundation.text.input.OutputTransformation?, scrollState: androidx.compose.foundation.ScrollState): kotlin.Unit
+  skippable: true
+  restartable: true
+  params:
+    - modifier: STABLE (marked @Stable or @Immutable)
+    - hint: STABLE (String is immutable)
+    - enabled: STABLE (primitive type)
+    - readOnly: STABLE (primitive type)
+    - textFieldState: STABLE (marked @Stable or @Immutable)
+    - inputTransformation: STABLE (marked @Stable or @Immutable)
+    - textStyle: STABLE (marked @Stable or @Immutable)
+    - keyboardOptions: STABLE (marked @Stable or @Immutable)
+    - onKeyboardAction: STABLE (marked @Stable or @Immutable)
+    - lineLimits: STABLE (marked @Stable or @Immutable)
+    - onTextLayout: STABLE (function type)
+    - cursorBrush: STABLE (marked @Stable or @Immutable)
+    - outputTransformation: STABLE (marked @Stable or @Immutable)
+    - scrollState: STABLE (marked @Stable or @Immutable)
+
+@Composable
+public fun com.idiotfrogs.designsystem.component.MSTabBar(tabs: kotlin.collections.List<kotlin.String>, selectedIndex: kotlin.Int, onClick: kotlin.Function1<kotlin.Int, kotlin.Unit>, modifier: androidx.compose.ui.Modifier): kotlin.Unit
+  skippable: false
+  restartable: true
+  params:
+    - tabs: RUNTIME (requires runtime check)
+    - selectedIndex: STABLE (primitive type)
+    - onClick: STABLE (function type)
+    - modifier: STABLE (marked @Stable or @Immutable)
+
+@Composable
+private fun com.idiotfrogs.designsystem.component.MSTabItem(selected: kotlin.Boolean, text: kotlin.String, onClick: kotlin.Function0<kotlin.Unit>): kotlin.Unit
+  skippable: true
+  restartable: true
+  params:
+    - selected: STABLE (primitive type)
+    - text: STABLE (String is immutable)
+    - onClick: STABLE (function type)
+
 @Composable
 public fun com.idiotfrogs.designsystem.component.MSText(text: kotlin.String, modifier: androidx.compose.ui.Modifier, fontSize: androidx.compose.ui.unit.Dp, color: androidx.compose.ui.graphics.Color, fontFamily: androidx.compose.ui.text.font.FontFamily, fontWeight: androidx.compose.ui.text.font.FontWeight, letterSpacing: androidx.compose.ui.unit.TextUnit, textDecoration: androidx.compose.ui.text.style.TextDecoration?, textAlign: androidx.compose.ui.text.style.TextAlign?, lineHeight: androidx.compose.ui.unit.TextUnit, overflow: androidx.compose.ui.text.style.TextOverflow, softWrap: kotlin.Boolean, maxLines: kotlin.Int, minLines: kotlin.Int, onTextLayout: kotlin.Function1<androidx.compose.ui.text.TextLayoutResult, kotlin.Unit>?, style: androidx.compose.ui.text.TextStyle): kotlin.Unit
   skippable: true

core/model/src/main/java/com/idiotfrogs/model/timecapsule/TimeCapsuleCollaboratorsResponse.kt

@@ -6,7 +6,6 @@ import kotlinx.serialization.Serializable
 data class TimeCapsuleCollaboratorsResponse(
     val contributorRole: TimeCapsuleRole,
     val nickname: String,
-    val bury: Boolean?,
     val userId: Long,
     val profileImageUrl: String,
     val userActiveStatus: Boolean,

core/model/src/main/java/com/idiotfrogs/model/timecapsule/TimeCapsuleResponse.kt

@@ -13,4 +13,6 @@ data class TimeCapsuleResponse(
     val mainImageUrl: String,
     val timeCapsuleStatus: TimeCapsuleStatus,
     val userRole: TimeCapsuleRole,
+    val myContentCount: Int,
+    val myImageCount: Int,
 )

feature/detail/src/main/java/com/idiotfrogs/detail/DetailScreen.kt

@@ -77,6 +77,7 @@ fun DetailRoute(
         when (event) {
             DetailSideEffect.NavigateToBack -> navigator.popBackStack()
             is DetailSideEffect.NavigateToFriend -> navigator.navigate(Routes.Friend(event.id))
+            is DetailSideEffect.NavigateToMessage -> navigator.navigate(Routes.Message(event.id))
             is DetailSideEffect.NavigateToManagement -> navigator.navigate(
                 Routes.Management(
                     id = event.id,
@@ -389,7 +390,9 @@ fun DetailScreen(
                     color = MSTheme.color.greyG4,
                 )
                 Image(
-                    modifier = Modifier.size(16.dp),
+                    modifier = Modifier
+                        .size(16.dp)
+                        .noRippleClickable { onAction(DetailAction.NavigateToMessage(capsuleId)) },
                     painter = painterResource(R.drawable.ic_chevron_right),
                     contentDescription = "추억 메시지 상세 아이콘"
                 )

feature/detail/src/main/java/com/idiotfrogs/detail/DetailViewModel.kt

@@ -65,6 +65,7 @@ class DetailViewModel @AssistedInject constructor(
     override fun onAction(action: DetailAction) {
         when (action) {
             is DetailAction.NavigateToFriend -> intent { postSideEffect(DetailSideEffect.NavigateToFriend(action.id)) }
+            is DetailAction.NavigateToMessage -> intent { postSideEffect(DetailSideEffect.NavigateToMessage(action.id)) }
             is DetailAction.NavigateToManagement -> intent { postSideEffect(DetailSideEffect.NavigateToManagement(action.id, action.title)) }
             DetailAction.NavigateToBack -> intent { postSideEffect(DetailSideEffect.NavigateToBack) }
         }
@@ -84,12 +85,14 @@ data class TimeCapsuleData(
 
 sealed interface DetailAction {
     data class NavigateToFriend(val id: Long) : DetailAction
+    data class NavigateToMessage(val id: Long) : DetailAction
     data class NavigateToManagement(val id: Long, val title: String) : DetailAction
     data object NavigateToBack : DetailAction
 }
 
 sealed interface DetailSideEffect {
     data class NavigateToFriend(val id: Long) : DetailSideEffect
+    data class NavigateToMessage(val id: Long) : DetailSideEffect
     data class NavigateToManagement(val id: Long, val title: String) : DetailSideEffect
     data object NavigateToBack : DetailSideEffect
 }