[FEAT/#221] 마이페이지 뷰 / 서버통신 구현

core/src/main/java/com/terning/core/designsystem/component/bottomsheet/ProfileBottomSheet.kt

@@ -30,6 +30,7 @@ import com.terning.core.R
 import com.terning.core.designsystem.theme.TerningMain
 import com.terning.core.designsystem.theme.TerningTheme
 import com.terning.core.extension.noRippleClickable
+import com.terning.core.type.ProfileImage
 import kotlinx.coroutines.launch
 
 /**
@@ -38,15 +39,15 @@ import kotlinx.coroutines.launch
  * @param modifier 바텀시트에 적용할 Modifier입니다.
  * @param onDismiss 바텀시트가 닫힐 때 호출되는 콜백 함수입니다.
  * @param onSaveClick 저장하기 버튼 클릭 시, 호출되는 콜백 함수입니다.
- * @param initialSelectedOption 초기에 선택된 이미지를 나타내는 인덱스 값입니다.
+ * @param initialSelectedOption 초기에 선택된 이미지의 이름을 나타내는 string 값입니다.
  */
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun ProfileBottomSheet(
     modifier: Modifier = Modifier,
     onDismiss: () -> Unit,
-    onSaveClick: (Int) -> Unit,
-    initialSelectedOption: Int
+    onSaveClick: (ProfileImage) -> Unit,
+    initialSelectedOption: String
 ) {
     val scope = rememberCoroutineScope()
     val sheetState = rememberModalBottomSheetState()
@@ -64,11 +65,11 @@ fun ProfileBottomSheet(
                         ),
                 )
                 RadioButtonGroup(
-                    onOptionSelected = { index ->
+                    onOptionSelected = { selectedProfile ->
                         scope.launch { sheetState.hide() }
                             .invokeOnCompletion {
                                 if (!sheetState.isVisible) {
-                                    onSaveClick(index)
+                                    onSaveClick(selectedProfile)
                                 }
                             }
                     },
@@ -82,38 +83,34 @@ fun ProfileBottomSheet(
     )
 }
 
+
 /**
  * 6개의 프로필 이미지 중, 하나의 이미지만 선택할 수 있는 라디오 버튼입니다.
  *
- * @param onOptionSelected 선택된 이미지의 인덱스 값을 나타내는 콜백 함수입니다.
- * @param initialSelectedOption 초기에 선택된 이미지를 나타내는 인덱스 값입니다.
+ * @param onOptionSelected 선택된 이미지의 이름을 나타내는 콜백 함수입니다.
+ * @param initialSelectedOption 초기에 선택된 이미지의 이름을 나타내는 string 값입니다.
  * @param modifier 라디오 버튼에 적용할 Modifier입니다.
  */
 @Composable
 fun RadioButtonGroup(
-    onOptionSelected: (Int) -> Unit,
-    initialSelectedOption: Int,
+    onOptionSelected: (ProfileImage) -> Unit,
+    initialSelectedOption: String,
     modifier: Modifier = Modifier,
 ) {
-    val options = listOf(
-        R.drawable.ic_terning_profile_00,
-        R.drawable.ic_terning_profile_01,
-        R.drawable.ic_terning_profile_02,
-        R.drawable.ic_terning_profile_03,
-        R.drawable.ic_terning_profile_04,
-        R.drawable.ic_terning_profile_05
-    )
+    val options = ProfileImage.entries
 
-    var selectedOption by rememberSaveable { mutableIntStateOf(options[initialSelectedOption]) }
+    var selectedOptionIndex by rememberSaveable {
+        mutableIntStateOf(ProfileImage.toIndex(ProfileImage.fromString(initialSelectedOption)))
+    }
 
     LazyVerticalGrid(
         columns = GridCells.Fixed(3),
         verticalArrangement = Arrangement.spacedBy(8.dp),
         horizontalArrangement = Arrangement.spacedBy(20.dp),
         modifier = modifier.padding(horizontal = 34.dp)
     ) {
-        itemsIndexed(options) { index, option ->
-            val imageModifier = if (selectedOption == options[index]) {
+        itemsIndexed(options.take(6)) { index, option ->
+            val imageModifier = if (selectedOptionIndex == index) {
                 Modifier
                     .border(
                         color = TerningMain,
@@ -126,19 +123,17 @@ fun RadioButtonGroup(
             }
 
             Image(
-                painter = painterResource(
-                    id = option
-                ),
+                painter = painterResource(id = option.drawableResId),
                 contentDescription = "profile image",
                 modifier = imageModifier
                     .noRippleClickable {
-                        onOptionSelected(index)
-                        selectedOption = option
+                        onOptionSelected(option)
+                        selectedOptionIndex = index
                     }
                     .clip(shape = CircleShape)
                     .size(76.dp)
                     .aspectRatio(1f)
             )
         }
     }
-}
+}

core/src/main/java/com/terning/core/designsystem/component/item/ProfileWithPlusButton.kt

@@ -14,26 +14,20 @@ import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.terning.core.R
+import com.terning.core.type.ProfileImage
 
 @Composable
 fun ProfileWithPlusButton(
-    index: Int,
+    profileImage: String,
     modifier: Modifier = Modifier,
 ) {
-    val grade = when (index) {
-        0 -> R.drawable.ic_terning_profile_00
-        1 -> R.drawable.ic_terning_profile_01
-        2 -> R.drawable.ic_terning_profile_02
-        3 -> R.drawable.ic_terning_profile_03
-        4 -> R.drawable.ic_terning_profile_04
-        else -> R.drawable.ic_terning_profile_05
-    }
+    val userProfile = ProfileImage.fromString(profileImage)
 
     Box(
         modifier = modifier.wrapContentWidth()
     ) {
         Image(
-            painterResource(id = grade),
+            painterResource(id = userProfile.drawableResId),
             contentDescription = "profile image",
             modifier = modifier
                 .clip(shape = CircleShape)
@@ -51,5 +45,5 @@ fun ProfileWithPlusButton(
 @Preview(showBackground = true)
 @Composable
 fun ProfileWithPlusButtonPreview() {
-    ProfileWithPlusButton(index = 1)
+    ProfileWithPlusButton(profileImage = "basic")
 }

core/src/main/java/com/terning/core/designsystem/component/snackbar/TerningBasicSnackBar.kt

@@ -0,0 +1,23 @@
+package com.terning.core.designsystem.component.snackbar
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.unit.dp
+import com.terning.core.designsystem.theme.Grey500
+
+@Composable
+fun TerningBasicSnackBar(content: @Composable () -> Unit) {
+    Box(
+        modifier = Modifier
+            .clip(CircleShape)
+            .background(Grey500)
+            .padding(vertical = 7.dp, horizontal = 20.dp)
+    ) {
+        content()
+    }
+}

core/src/main/java/com/terning/core/type/ProfileImage.kt

@@ -0,0 +1,33 @@
+package com.terning.core.type
+
+import androidx.annotation.DrawableRes
+import com.terning.core.R
+
+enum class ProfileImage(
+    @DrawableRes val drawableResId: Int,
+    val stringValue: String
+) {
+
+    BASIC(drawableResId = R.drawable.ic_terning_profile_00, stringValue = "basic"),
+    LUCKY(drawableResId = R.drawable.ic_terning_profile_01, stringValue = "lucky"),
+    SMART(drawableResId = R.drawable.ic_terning_profile_02, stringValue = "smart"),
+    GLASS(drawableResId = R.drawable.ic_terning_profile_03, stringValue = "glass"),
+    CALENDAR(drawableResId = R.drawable.ic_terning_profile_04, stringValue = "calendar"),
+    PASSION(drawableResId = R.drawable.ic_terning_profile_05, stringValue = "passion"),
+    DEFAULT(drawableResId = R.drawable.ic_terning_profile_default, stringValue = "default");
+
+    companion object {
+        fun fromString(value: String): ProfileImage = when (value) {
+            "basic" -> BASIC
+            "lucky" -> LUCKY
+            "smart" -> SMART
+            "glass" -> GLASS
+            "calendar" -> CALENDAR
+            "passion" -> PASSION
+            else -> BASIC
+        }
+
+        fun toIndex(profileImage: ProfileImage): Int =
+            entries.indexOf(profileImage)
+    }
+}