🔀 : (#275) 프로필 화면 v2 적용

core/designsystem/src/main/java/com/idiotfrogs/designsystem/component/button/MSButton.kt

@@ -22,6 +22,7 @@ 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 androidx.compose.ui.unit.dp
 import com.idiotfrogs.designsystem.component.MSText
 import com.idiotfrogs.designsystem.theme.MSTheme
@@ -33,6 +34,7 @@ fun MSButton(
     modifier: Modifier = Modifier,
     enabled: Boolean = true,
     isRounded: Boolean = true,
+    cornerRadius: Dp = 12.dp,
     colors: ButtonColors = ButtonDefaults.buttonColors(
         containerColor = MSTheme.color.primaryNormal,
         disabledContainerColor = MSTheme.color.primaryLight
@@ -51,7 +53,7 @@ fun MSButton(
 ) {
     val isPressed by interactionSource.collectIsPressedAsState()
     val cornerRadius by animateDpAsState(
-        targetValue = if (isRounded) 12.dp else 0.dp,
+        targetValue = if (isRounded) cornerRadius else 0.dp,
         animationSpec = tween(durationMillis = 300),
         label = "cornerRadiusAnimation",
     )

core/designsystem/stability/designsystem-debug.stability

@@ -315,13 +315,14 @@ public fun com.idiotfrogs.designsystem.component.TwoByTwo(images: kotlin.collect
     - images: RUNTIME (requires runtime check)
 
 @Composable
-public fun com.idiotfrogs.designsystem.component.button.MSButton(modifier: androidx.compose.ui.Modifier, enabled: kotlin.Boolean, isRounded: kotlin.Boolean, colors: androidx.compose.material3.ButtonColors, pressColors: androidx.compose.material3.ButtonColors, elevation: androidx.compose.material3.ButtonElevation?, border: androidx.compose.foundation.BorderStroke?, wavyStrokeColor: androidx.compose.ui.graphics.Color?, contentPadding: androidx.compose.foundation.layout.PaddingValues, interactionSource: androidx.compose.foundation.interaction.MutableInteractionSource, onClick: kotlin.Function0<kotlin.Unit>, content: @[Composable] @[ExtensionFunctionType] androidx.compose.runtime.internal.ComposableFunction1<androidx.compose.foundation.layout.RowScope, kotlin.Unit>): kotlin.Unit
+public fun com.idiotfrogs.designsystem.component.button.MSButton(modifier: androidx.compose.ui.Modifier, enabled: kotlin.Boolean, isRounded: kotlin.Boolean, cornerRadius: androidx.compose.ui.unit.Dp, colors: androidx.compose.material3.ButtonColors, pressColors: androidx.compose.material3.ButtonColors, elevation: androidx.compose.material3.ButtonElevation?, border: androidx.compose.foundation.BorderStroke?, wavyStrokeColor: androidx.compose.ui.graphics.Color?, contentPadding: androidx.compose.foundation.layout.PaddingValues, interactionSource: androidx.compose.foundation.interaction.MutableInteractionSource, onClick: kotlin.Function0<kotlin.Unit>, content: @[Composable] @[ExtensionFunctionType] androidx.compose.runtime.internal.ComposableFunction1<androidx.compose.foundation.layout.RowScope, kotlin.Unit>): kotlin.Unit
   skippable: true
   restartable: true
   params:
     - modifier: STABLE (marked @Stable or @Immutable)
     - enabled: STABLE (primitive type)
     - isRounded: STABLE (primitive type)
+    - cornerRadius: STABLE (marked @Stable or @Immutable)
     - colors: STABLE (marked @Stable or @Immutable)
     - pressColors: STABLE (marked @Stable or @Immutable)
     - elevation: STABLE (marked @Stable or @Immutable)

core/designsystem/stability/designsystem-release.stability

@@ -315,13 +315,14 @@ public fun com.idiotfrogs.designsystem.component.TwoByTwo(images: kotlin.collect
     - images: RUNTIME (requires runtime check)
 
 @Composable
-public fun com.idiotfrogs.designsystem.component.button.MSButton(modifier: androidx.compose.ui.Modifier, enabled: kotlin.Boolean, isRounded: kotlin.Boolean, colors: androidx.compose.material3.ButtonColors, pressColors: androidx.compose.material3.ButtonColors, elevation: androidx.compose.material3.ButtonElevation?, border: androidx.compose.foundation.BorderStroke?, wavyStrokeColor: androidx.compose.ui.graphics.Color?, contentPadding: androidx.compose.foundation.layout.PaddingValues, interactionSource: androidx.compose.foundation.interaction.MutableInteractionSource, onClick: kotlin.Function0<kotlin.Unit>, content: @[Composable] @[ExtensionFunctionType] androidx.compose.runtime.internal.ComposableFunction1<androidx.compose.foundation.layout.RowScope, kotlin.Unit>): kotlin.Unit
+public fun com.idiotfrogs.designsystem.component.button.MSButton(modifier: androidx.compose.ui.Modifier, enabled: kotlin.Boolean, isRounded: kotlin.Boolean, cornerRadius: androidx.compose.ui.unit.Dp, colors: androidx.compose.material3.ButtonColors, pressColors: androidx.compose.material3.ButtonColors, elevation: androidx.compose.material3.ButtonElevation?, border: androidx.compose.foundation.BorderStroke?, wavyStrokeColor: androidx.compose.ui.graphics.Color?, contentPadding: androidx.compose.foundation.layout.PaddingValues, interactionSource: androidx.compose.foundation.interaction.MutableInteractionSource, onClick: kotlin.Function0<kotlin.Unit>, content: @[Composable] @[ExtensionFunctionType] androidx.compose.runtime.internal.ComposableFunction1<androidx.compose.foundation.layout.RowScope, kotlin.Unit>): kotlin.Unit
   skippable: true
   restartable: true
   params:
     - modifier: STABLE (marked @Stable or @Immutable)
     - enabled: STABLE (primitive type)
     - isRounded: STABLE (primitive type)
+    - cornerRadius: STABLE (marked @Stable or @Immutable)
     - colors: STABLE (marked @Stable or @Immutable)
     - pressColors: STABLE (marked @Stable or @Immutable)
     - elevation: STABLE (marked @Stable or @Immutable)

core/network/src/main/java/com/idiotfrogs/network/service/UserService.kt

@@ -24,8 +24,8 @@ interface UserService {
     @Multipart
     suspend fun updateMyProfile(
         @Path("userId") userId: Long,
-        @Part("profileImage") profileImage: MultipartBody.Part,
-        @Part("userUpdateDto") userUpdateRequest: UserUpdateRequest
+        @Part profileImage: MultipartBody.Part,
+        @Query("nickname") nickname: String
     ): UserResponse
 
     @PATCH("users/sign-up")

data/src/main/java/com/idiotfrogs/data/datasource/user/UserDataSource.kt

@@ -13,7 +13,7 @@ interface UserDataSource {
     suspend fun updateMyProfile(
         userId: Long,
         profileImage: MultipartBody.Part,
-        userUpdateRequest: UserUpdateRequest
+        nickname: String,
     ): UserResponse
 
     suspend fun signUp(

data/src/main/java/com/idiotfrogs/data/datasource/user/UserDataSourceImpl.kt

@@ -21,12 +21,12 @@ class UserDataSourceImpl @Inject constructor(
     override suspend fun updateMyProfile(
         userId: Long,
         profileImage: MultipartBody.Part,
-        userUpdateRequest: UserUpdateRequest
+        nickname: String,
     ): UserResponse {
         return userService.updateMyProfile(
             userId = userId,
             profileImage = profileImage,
-            userUpdateRequest = userUpdateRequest
+            nickname = nickname
         )
     }
 

data/src/main/java/com/idiotfrogs/data/repository/user/UserRepository.kt

@@ -12,8 +12,8 @@ interface UserRepository {
 
     suspend fun updateMyProfile(
         userId: Long,
-        profileImage: File,
-        userUpdateRequest: UserUpdateRequest
+        profileImage: File?,
+        nickname: String
     ): UserResponse
 
     suspend fun signUp(

data/src/main/java/com/idiotfrogs/data/repository/user/UserRepositoryImpl.kt

@@ -3,10 +3,10 @@ package com.idiotfrogs.data.repository.user
 import com.idiotfrogs.data.datasource.user.UserDataSource
 import com.idiotfrogs.model.user.ProfileResponse
 import com.idiotfrogs.model.user.UserResponse
-import com.idiotfrogs.model.user.UserUpdateRequest
 import okhttp3.MediaType.Companion.toMediaType
 import okhttp3.MultipartBody
 import okhttp3.RequestBody.Companion.asRequestBody
+import okhttp3.RequestBody.Companion.toRequestBody
 import java.io.File
 import javax.inject.Inject
 
@@ -23,15 +23,21 @@ class UserRepositoryImpl @Inject constructor(
 
     override suspend fun updateMyProfile(
         userId: Long,
-        profileImage: File,
-        userUpdateRequest: UserUpdateRequest
+        profileImage: File?,
+        nickname: String,
     ): UserResponse {
-        val imageRequestBody = profileImage.asRequestBody("image/jpeg".toMediaType())
-        val imagePart = MultipartBody.Part.createFormData("profileImage", profileImage.name, imageRequestBody)
+        val imageRequestBody = profileImage?.asRequestBody("image/jpeg".toMediaType())
+            ?: "".toRequestBody("image/*".toMediaType())
+        val imagePart = MultipartBody.Part.createFormData(
+            "profileImage",
+            profileImage?.name ?: "profileImage", // 기본 이미지 대응
+            imageRequestBody
+        )
+
         return userDataSource.updateMyProfile(
             userId = userId,
             profileImage = imagePart,
-            userUpdateRequest = userUpdateRequest
+            nickname = nickname
         )
     }
 

domain/src/main/java/com/idiotfrogs/domain/usecase/user/UpdateMyProfileUseCase.kt

@@ -2,7 +2,6 @@ package com.idiotfrogs.domain.usecase.user
 
 import com.idiotfrogs.data.repository.user.UserRepository
 import com.idiotfrogs.model.user.UserResponse
-import com.idiotfrogs.model.user.UserUpdateRequest
 import com.idiotfrogs.util.safeCatching
 import java.io.File
 import javax.inject.Inject
@@ -12,13 +11,13 @@ class UpdateMyProfileUseCase @Inject constructor(
 ) {
     suspend operator fun invoke(
         userId: Long,
-        profileImage: File,
-        userUpdateRequest: UserUpdateRequest
+        profileImage: File?,
+        nickname: String,
     ): Result<UserResponse> = safeCatching {
             userRepository.updateMyProfile(
                 userId,
                 profileImage,
-                userUpdateRequest
+                nickname
             )
         }
 }

feature/profile/src/main/java/com/idiotfrogs/profile/component/EditProfileHeader.kt

@@ -1,22 +1,26 @@
 package com.idiotfrogs.profile.component
 
 import androidx.compose.foundation.Image
-import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.idiotfrogs.designsystem.component.MSText
+import com.idiotfrogs.designsystem.component.button.MSButton
 import com.idiotfrogs.designsystem.theme.MSTheme
 import com.idiotfrogs.designsystem.util.noRippleClickable
 import com.idiotfrogs.resource.R
@@ -28,33 +32,42 @@ fun ProfileHeader(
     onBack: () -> Unit,
     onSave: () -> Unit,
 ) {
-    Row(
+    Box(
         modifier = modifier
             .fillMaxWidth()
-            .padding(vertical = 16.dp),
-        horizontalArrangement = Arrangement.SpaceBetween,
-        verticalAlignment = Alignment.CenterVertically
+            .height(56.dp),
     ) {
         Image(
-            modifier = Modifier.noRippleClickable(onBack),
+            modifier = Modifier
+                .align(Alignment.CenterStart)
+                .size(24.dp)
+                .noRippleClickable(onBack),
             painter = painterResource(R.drawable.ic_chevron_left),
             contentDescription = "chevron left"
         )
         MSText(
-            text = "프로필",
+            modifier = Modifier.align(Alignment.Center),
+            text = "프로필 수정",
             fontWeight = FontWeight.Bold,
-            fontSize = 14.dp,
+            fontSize = 20.dp,
             color = MSTheme.color.black
         )
-        MSText(
-            modifier = Modifier.noRippleClickable {
-                if (isChanged) onSave()
-            },
-            text = "저장",
-            fontWeight = FontWeight.Bold,
-            fontSize = 14.dp,
-            color = if (isChanged) MSTheme.color.primaryNormal else MSTheme.color.greyG2,
-        )
+        MSButton(
+            modifier = Modifier
+                .align(Alignment.CenterEnd)
+                .height(32.dp),
+            cornerRadius = 8.dp,
+            contentPadding = PaddingValues(horizontal = 1.dp),
+            enabled = isChanged,
+            onClick = onSave
+        ) {
+            MSText(
+                text = "저장",
+                color = if (isChanged) MSTheme.color.primaryDark else Color(0xFF84B591),
+                fontSize = 14.dp,
+                fontWeight = FontWeight.Bold
+            )
+        }
     }
 }
 

feature/profile/src/main/java/com/idiotfrogs/profile/component/ProfileCard.kt

@@ -2,13 +2,18 @@ package com.idiotfrogs.profile.component
 
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.Icon
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
@@ -19,6 +24,7 @@ import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.idiotfrogs.designsystem.component.MSText
+import com.idiotfrogs.designsystem.component.button.MSButton
 import com.idiotfrogs.designsystem.theme.MSTheme
 import com.idiotfrogs.designsystem.util.noRippleClickable
 import com.idiotfrogs.resource.R
@@ -31,63 +37,51 @@ fun ProfileCard(
     nickname: String,
     onEditClick: () -> Unit,
 ) {
-    Row(
-        modifier = modifier
-            .background(
-                color = MSTheme.color.white,
-                shape = RoundedCornerShape(10.dp)
-            )
-            .padding(horizontal = 16.dp, vertical = 20.dp),
-        verticalAlignment = Alignment.CenterVertically
+    Column(
+        modifier = modifier.background(color = MSTheme.color.white),
+        horizontalAlignment = Alignment.CenterHorizontally,
+        verticalArrangement = Arrangement.Center
     ) {
         imageUrl?.let {
             GlideImage(
                 modifier = Modifier
-                    .size(54.dp)
+                    .size(80.dp)
                     .clip(CircleShape),
                 imageModel = { it }
             )
         } ?: run {
             Image(
-                modifier = Modifier.size(54.dp),
-                painter = painterResource(R.drawable.img_profile_54),
+                modifier = Modifier.size(width = 78.dp, height = 80.dp),
+                painter = painterResource(R.drawable.img_empty_profile),
                 contentDescription = "empty_profile"
             )
         }
-
-        Spacer(modifier = Modifier.width(10.dp))
+        Spacer(modifier = Modifier.height(8.dp))
         MSText(
             text = nickname,
             fontWeight = FontWeight.Bold,
-            fontSize = 16.dp,
+            fontSize = 24.dp,
             color = MSTheme.color.greyG5
         )
-        Spacer(modifier = Modifier.weight(1f))
-        Row(
-            modifier = Modifier
-                .background(
-                    color = MSTheme.color.greyG1,
-                    shape = RoundedCornerShape(29.dp)
-                )
-                .padding(
-                    top = 8.dp, bottom = 8.dp,
-                    start = 8.dp, end = 10.dp
-                )
-                .noRippleClickable(onClick = onEditClick),
-            verticalAlignment = Alignment.CenterVertically
+        Spacer(modifier = Modifier.height(20.dp))
+        MSButton(
+            modifier = Modifier.height(32.dp),
+            contentPadding = PaddingValues(horizontal = 8.dp),
+            colors = ButtonDefaults.buttonColors(
+                containerColor = MSTheme.color.greyG5,
+                disabledContainerColor = MSTheme.color.greyG5
+            ),
+            pressColors = ButtonDefaults.buttonColors(
+                containerColor = MSTheme.color.greyG5,
+                disabledContainerColor = MSTheme.color.greyG5
+            ),
+            onClick = onEditClick
         ) {
-            Icon(
-                modifier = Modifier.size(16.dp),
-                painter = painterResource(R.drawable.ic_edit),
-                contentDescription = "edit",
-                tint = MSTheme.color.greyG3
-            )
-            Spacer(modifier = Modifier.width(2.dp))
             MSText(
                 text = "프로필 수정",
-                fontWeight = FontWeight.Medium,
+                fontWeight = FontWeight.Bold,
                 fontSize = 12.dp,
-                color = MSTheme.color.greyG3
+                color = MSTheme.color.white
             )
         }
     }

feature/profile/src/main/java/com/idiotfrogs/profile/component/ProfileHeader.kt

@@ -43,15 +43,15 @@ fun ProfileHeader(
         MSText(
             text = "프로필",
             fontWeight = FontWeight.Bold,
-            fontSize = 14.dp,
+            fontSize = 20.dp,
             color = MSTheme.color.greyG5
         )
-        MSText(
-            modifier = Modifier.noRippleClickable(onClick = onSetting),
-            text = "설정",
-            fontWeight = FontWeight.Medium,
-            fontSize = 14.dp,
-            color = MSTheme.color.greyG3
+        Image(
+            modifier = Modifier
+                .size(24.dp)
+                .noRippleClickable(onClick = onSetting),
+            painter = painterResource(R.drawable.ic_setting),
+            contentDescription = "설정"
         )
     }
 }