[feature/#1011] 전화번호 에러 표시

sopt-makers · Jan 17, 2025 · 554fbff · 554fbff
1 parent 82fe067
commit 554fbff
Show file tree

Hide file tree

Showing 3 changed files with 68 additions and 121 deletions.
diff --git a/app/src/main/java/org/sopt/official/feature/auth/component/PhoneCertification.kt b/app/src/main/java/org/sopt/official/feature/auth/component/PhoneCertification.kt
diff --git a/app/src/main/java/org/sopt/official/feature/auth/feature/certificate/CertificationScreen.kt b/app/src/main/java/org/sopt/official/feature/auth/feature/certificate/CertificationScreen.kt
@@ -44,6 +44,7 @@ import androidx.compose.runtime.getValue
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.input.VisualTransformation
@@ -72,7 +73,6 @@ import org.sopt.official.designsystem.White
 import org.sopt.official.feature.auth.component.AuthButton
 import org.sopt.official.feature.auth.component.AuthTextField
 import org.sopt.official.feature.auth.component.AuthTextWithArrow
-import org.sopt.official.feature.auth.component.PhoneCertification
 import org.sopt.official.feature.auth.model.AuthStatus
 import org.sopt.official.feature.auth.utils.phoneNumberVisualTransformation
 
@@ -182,15 +182,16 @@ private fun CertificationScreen(
                 onTextChange = onPhoneNumberChange,
                 phoneNumber = phoneNumber,
                 visualTransformation = visualTransformation,
-                buttonText = certificationButtonText
+                buttonText = certificationButtonText,
+                errorMessage = errorMessage
             )
             Spacer(modifier = Modifier.height(10.dp))
             AuthTextField(
                 modifier = Modifier.fillMaxWidth(),
                 labelText = code,
                 hintText = "인증번호를 입력해 주세요.",
                 onTextChange = onCodeChange,
-                isError = errorMessage.isNotEmpty(),
+                isError = ErrorCase.isCodeError(errorMessage),
                 errorMessage = errorMessage
             ) {
                 Text(
@@ -292,6 +293,55 @@ private fun TopBar(
     }
 }
 
+@Composable
+private fun PhoneCertification(
+    onPhoneNumberClick: () -> Unit,
+    textColor: Color,
+    onTextChange: (String) -> Unit,
+    phoneNumber: String,
+    buttonText: String,
+    errorMessage: String,
+    modifier: Modifier = Modifier,
+    visualTransformation: VisualTransformation = VisualTransformation.None,
+) {
+    Column(modifier = modifier) {
+        Text(
+            text = "전화번호",
+            color = textColor,
+            style = SoptTheme.typography.body14M
+        )
+        Spacer(modifier = Modifier.height(12.dp))
+        Row(horizontalArrangement = Arrangement.spacedBy(7.dp)) {
+            AuthTextField(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .weight(1f),
+                labelText = phoneNumber,
+                hintText = "010-XXXX-XXXX",
+                onTextChange = onTextChange,
+                visualTransformation = visualTransformation,
+                isError = ErrorCase.isPhoneError(errorMessage),
+                errorMessage = errorMessage
+            )
+            AuthButton(
+                padding = PaddingValues(
+                    vertical = 16.dp,
+                    horizontal = if (buttonText == CertificationButtonText.GET_CODE.message) 12.dp
+                    else 20.dp
+                ),
+                onClick = onPhoneNumberClick,
+                containerColor = Gray10,
+                contentColor = Gray950,
+            ) {
+                Text(
+                    text = buttonText,
+                    style = SoptTheme.typography.body14M
+                )
+            }
+        }
+    }
+}
+
 @Preview(showBackground = true)
 @Composable
 private fun AuthCertificationPreview() {

diff --git a/...rc/main/java/org/sopt/official/feature/auth/feature/certificate/CertificationViewModel.kt b/...rc/main/java/org/sopt/official/feature/auth/feature/certificate/CertificationViewModel.kt
@@ -15,6 +15,7 @@ import kotlinx.coroutines.flow.asStateFlow
 import kotlinx.coroutines.flow.update
 import kotlinx.coroutines.isActive
 import kotlinx.coroutines.launch
+import okhttp3.internal.immutableListOf
 import org.sopt.official.domain.auth.model.InformationWithCode
 import org.sopt.official.domain.auth.model.InitialInformation
 import org.sopt.official.domain.auth.model.UserPhoneNumber
@@ -25,7 +26,12 @@ import javax.inject.Inject
 internal enum class ErrorCase(val message: String) {
     CODE_ERROR("인증 번호가 일치하지 않아요."),
     PHONE_ERROR("SOPT 활동 시 사용한 전화번호가 아니에요."),
-    TIME_ERROR("3분이 초과되었어요. 인증번호를 다시 요청해주세요.")
+    TIME_ERROR("3분이 초과되었어요. 인증번호를 다시 요청해주세요.");
+
+    companion object {
+        fun isPhoneError(message: String) = PHONE_ERROR.message == message
+        fun isCodeError(message: String) = immutableListOf(CODE_ERROR, TIME_ERROR).any { it.message == message }
+    }
 }
 
 internal enum class CertificationButtonText(val message: String) {
@@ -77,15 +83,15 @@ class CertificationViewModel @Inject constructor(
                 updateButtonText()
             }.onFailure {
                 // TODO: DELETE !!
-                startTimer()
-                resetErrorCase()
-                updateButtonText()
+//                startTimer()
+//                resetErrorCase()
+//                updateButtonText()
                 // TODO: 주석 해제
-//                _state.update { currentState ->
-//                    currentState.copy(
-//                        errorMessage = ErrorCase.PHONE_ERROR.message
-//                    )
-//                }
+                _state.update { currentState ->
+                    currentState.copy(
+                        errorMessage = ErrorCase.PHONE_ERROR.message
+                    )
+                }
             }
         }
     }