Skip to content

[feat] #188 마이페이지 프로필 편집 기능 추가#189

Merged
ikseong00 merged 3 commits intodevelopfrom
feat/#188-mypage-edit-profile
Apr 13, 2026
Merged

[feat] #188 마이페이지 프로필 편집 기능 추가#189
ikseong00 merged 3 commits intodevelopfrom
feat/#188-mypage-edit-profile

Conversation

@Ojongseok
Copy link
Copy Markdown
Member

@Ojongseok Ojongseok commented Apr 12, 2026

🔗 관련 이슈

📙 작업 설명

  • EditProfileImage, SettingProfileImage 두 개의 별도 컴포넌트를 ProfileImage 공통 컴포넌트로 통합
  • EditProfileScreen, ProfileSettingScreen에서 공통 ProfileImage 컴포넌트를 사용하도록 교체
  • 계정 설정 화면(ProfileSettingScreen)에도 카메라 아이콘이 노출되도록 수정

📸 스크린샷 또는 시연 영상 (선택)

기능 미리보기
카메라 아이콘 선택
KakaoTalk_Video_2026-04-13-01-01-50.mp4

💬 추가 설명 or 리뷰 포인트 (선택)

  • 안녕하세요, 오랜만이 인사드립니다😅

Summary by CodeRabbit

릴리스 노트

  • 리팩토링
    • 프로필 이미지 표시 컴포넌트를 통합하여 새로운 ProfileImage 컴포넌트 추가
    • 기존 EditProfileImage 및 SettingProfileImage 컴포넌트 삭제 및 해당 화면에서 ProfileImage로 교체
    • 편집/카메라 아이콘 동작 유지 및 닉네임 표시 UI 포함
    • 내부 상태 초기화 타입 변경으로 이미지 상태 할당 로직 간소화

@coderabbitai
Copy link
Copy Markdown

coderabbitai bot commented Apr 12, 2026

Walkthrough

프로필 이미지 관련 UI를 통합하여 EditProfileImageSettingProfileImage를 제거하고, 새로 추가한 ProfileImage 컴포넌트를 사용하도록 화면 호출부(EditProfileScreen, ProfileSettingScreen)를 변경했습니다. 상태 타입 및 이미지 전달 방식이 일부 조정되었습니다.

Changes

Cohort / File(s) Summary
통합된 프로필 컴포넌트 추가
feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/component/ProfileImage.kt
새로운 ProfileImage 컴포저블 추가: 프로필 이미지(AsyncImage), 카메라 액션 버튼, 닉네임 및 편집 아이콘을 하나의 컴포넌트로 구현. 미리보기 컴포저블 포함.
제거된 기존 컴포넌트
feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/component/EditProfileImage.kt, feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/component/SettingProfileImage.kt
이전 EditProfileImageSettingProfileImage 파일 삭제. 해당 UI 로직이 ProfileImage로 대체됨.
화면 호출부 업데이트
feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/EditProfileScreen.kt, feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/ProfileSettingScreen.kt
두 화면에서 기존 컴포저블 호출을 ProfileImage로 교체. displayProfileImage 상태 타입 변경(nullable -> non-nullable 제네릭) 및 카메라/편집 클릭 핸들러 연결 방식 조정.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

🐰 새 컴포넌트로 하나가 된 날
카메라 버튼은 반짝, 닉네임도 환히
이미지가 모여 둥글게 춤추네 📸
리팩토링 밟고 깔끔히 정리했지
토끼가 축하해, 폴짝! 🥕

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Title check ✅ Passed PR 제목이 핵심 변경 사항(프로필 편집 기능/컴포넌트 통합)을 명확하게 요약하고 있습니다.
Linked Issues check ✅ Passed PR이 #188의 모든 요구사항을 충족합니다: ProfileSettingScreen에 카메라 아이콘 노출 및 프로필 편집 화면 전환 로직이 구현되었습니다.
Out of Scope Changes check ✅ Passed 모든 변경 사항이 #188의 요구사항 범위 내에 있으며, 기존 컴포넌트 통합 외의 불필요한 수정은 없습니다.
Description check ✅ Passed PR 설명이 관련 이슈, 작업 설명, 스크린샷을 포함하며 필수 섹션을 충분히 다루고 있습니다.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch feat/#188-mypage-edit-profile

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Copy Markdown

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)
feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/EditProfileScreen.kt (1)

78-87: ⚠️ Potential issue | 🟡 Minor

이미지 상태를 non-null로 고정하면서 빈 URL fallback이 약해졌습니다.

Line 79 변경으로 빈 문자열이 기본 이미지 fallback(null)을 우회할 수 있어 불필요한 로드 실패가 발생할 수 있습니다. nullable 상태를 유지하는 편이 안전합니다.

🔧 제안 수정안
     var displayProfileImage by remember {
-        mutableStateOf<Any>(uiState.userInfo.profileImageUrl)
+        mutableStateOf<Any?>(uiState.userInfo.profileImageUrl.ifEmpty { null })
     }

     LaunchedEffect(uiState.profileImageState) {
         when (uiState.profileImageState) {
-            is EditProfileImageType.OriginalImageUrl -> {}
+            is EditProfileImageType.OriginalImageUrl -> {
+                displayProfileImage = uiState.userInfo.profileImageUrl.ifEmpty { null }
+            }
             is EditProfileImageType.ImageUri -> displayProfileImage = uiState.profileImageState.uri
             EditProfileImageType.Default -> displayProfileImage = R.drawable.image_profile_empty
         }
     }
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In
`@feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/EditProfileScreen.kt`
around lines 78 - 87, The current change makes displayProfileImage non-nullable
(mutableStateOf<Any>) which prevents preserving a null/empty profile URL
fallback and can cause unnecessary load failures; revert it to a nullable state
by changing displayProfileImage to hold Any? (or the actual nullable type like
String?) and initialize it with uiState.userInfo.profileImageUrl (which may be
null), then keep the LaunchedEffect assignments compatible (assign uri,
R.drawable.image_profile_empty, or null as appropriate) so the UI can
distinguish empty/null URL vs explicit defaults; update any downstream consumers
of displayProfileImage accordingly to handle the nullable case.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Inline comments:
In
`@feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/component/ProfileImage.kt`:
- Around line 56-64: The clickable camera/edit icon lacks an accessibility
label, so add a descriptive contentDescription and semantic role to the
clickable element: locate the Box that uses noRippleClickableSingle(onClick =
onClickCameraIcon) in ProfileImage (and the similar block at the other spot
referenced), and provide an accessible label (e.g., "프로필 사진 변경" or appropriate
Korean string) via semantics or by giving the contained Icon a non-null
contentDescription and setting role = Role.Button so TalkBack users can
understand the action; ensure you apply the same fix to the second instance
(lines ~85-90) as well.

---

Outside diff comments:
In
`@feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/EditProfileScreen.kt`:
- Around line 78-87: The current change makes displayProfileImage non-nullable
(mutableStateOf<Any>) which prevents preserving a null/empty profile URL
fallback and can cause unnecessary load failures; revert it to a nullable state
by changing displayProfileImage to hold Any? (or the actual nullable type like
String?) and initialize it with uiState.userInfo.profileImageUrl (which may be
null), then keep the LaunchedEffect assignments compatible (assign uri,
R.drawable.image_profile_empty, or null as appropriate) so the UI can
distinguish empty/null URL vs explicit defaults; update any downstream consumers
of displayProfileImage accordingly to handle the nullable case.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: 45934950-fcbd-4d54-abbe-d5dca5485cfb

📥 Commits

Reviewing files that changed from the base of the PR and between 745b798 and c8d4e10.

📒 Files selected for processing (5)
  • feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/EditProfileScreen.kt
  • feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/ProfileSettingScreen.kt
  • feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/component/EditProfileImage.kt
  • feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/component/ProfileImage.kt
  • feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/component/SettingProfileImage.kt
💤 Files with no reviewable changes (2)
  • feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/component/EditProfileImage.kt
  • feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/component/SettingProfileImage.kt

Comment on lines +56 to +64
Box(
modifier = Modifier
.align(Alignment.BottomEnd)
.background(
color = NekiTheme.colorScheme.gray700,
shape = CircleShape,
)
.noRippleClickableSingle(onClick = onClickCameraIcon)
.padding(8.dp),
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟠 Major

클릭 가능한 아이콘에 접근성 라벨이 없습니다.

카메라/수정 아이콘이 contentDescription = null 상태라 TalkBack 사용자가 동작 목적을 식별하기 어렵습니다. 최소한 버튼 역할/설명을 부여해 주세요.

🔧 제안 수정안
 import androidx.compose.ui.unit.dp
+import androidx.compose.ui.semantics.Role
+import androidx.compose.ui.semantics.contentDescription
+import androidx.compose.ui.semantics.role
+import androidx.compose.ui.semantics.semantics
@@
             Box(
                 modifier = Modifier
                     .align(Alignment.BottomEnd)
                     .background(
                         color = NekiTheme.colorScheme.gray700,
                         shape = CircleShape,
                     )
                     .noRippleClickableSingle(onClick = onClickCameraIcon)
+                    .semantics {
+                        role = Role.Button
+                        contentDescription = "프로필 사진 편집"
+                    }
                     .padding(8.dp),
                 contentAlignment = Alignment.Center,
             ) {
@@
                 Icon(
-                    modifier = Modifier.noRippleClickableSingle(onClick = onClickEdit),
+                    modifier = Modifier
+                        .noRippleClickableSingle(onClick = onClickEdit)
+                        .semantics {
+                            role = Role.Button
+                            contentDescription = "닉네임 편집"
+                        },
                     imageVector = ImageVector.vectorResource(R.drawable.icon_edit),
                     contentDescription = null,
                     tint = Color.Unspecified,
                 )

Also applies to: 85-90

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In
`@feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/component/ProfileImage.kt`
around lines 56 - 64, The clickable camera/edit icon lacks an accessibility
label, so add a descriptive contentDescription and semantic role to the
clickable element: locate the Box that uses noRippleClickableSingle(onClick =
onClickCameraIcon) in ProfileImage (and the similar block at the other spot
referenced), and provide an accessible label (e.g., "프로필 사진 변경" or appropriate
Korean string) via semantics or by giving the contained Icon a non-null
contentDescription and setting role = Role.Button so TalkBack users can
understand the action; ensure you apply the same fix to the second instance
(lines ~85-90) as well.

@Ojongseok Ojongseok marked this pull request as draft April 12, 2026 15:58
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@Ojongseok Ojongseok marked this pull request as ready for review April 12, 2026 16:02
Copy link
Copy Markdown

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

♻️ Duplicate comments (1)
feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/component/ProfileImage.kt (1)

56-64: ⚠️ Potential issue | 🟠 Major

클릭 아이콘의 접근성 라벨/역할이 누락되어 있습니다.

Line 63, Line 86의 클릭 요소에 role/설명 텍스트가 없어 스크린리더 사용자가 동작 목적을 알기 어렵습니다. 카메라/수정 액션에 접근성 semantics를 추가해 주세요.

🔧 제안 수정안
 import androidx.compose.ui.unit.dp
+import androidx.compose.ui.semantics.Role
+import androidx.compose.ui.semantics.contentDescription
+import androidx.compose.ui.semantics.role
+import androidx.compose.ui.semantics.semantics
@@
             Box(
                 modifier = Modifier
                     .align(Alignment.BottomEnd)
                     .background(
                         color = NekiTheme.colorScheme.gray700,
                         shape = CircleShape,
                     )
                     .noRippleClickableSingle(onClick = onClickCameraIcon)
+                    .semantics {
+                        role = Role.Button
+                        contentDescription = "프로필 사진 변경"
+                    }
                     .padding(8.dp),
                 contentAlignment = Alignment.Center,
             ) {
@@
                 Icon(
-                    modifier = Modifier.noRippleClickableSingle(onClick = onClickEdit),
+                    modifier = Modifier
+                        .noRippleClickableSingle(onClick = onClickEdit)
+                        .semantics {
+                            role = Role.Button
+                            contentDescription = "닉네임 편집"
+                        },
                     imageVector = ImageVector.vectorResource(R.drawable.icon_edit),
                     contentDescription = null,
                     tint = Color.Unspecified,
                 )

Also applies to: 85-90

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In
`@feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/component/ProfileImage.kt`
around lines 56 - 64, The clickable icon Box using
noRippleClickableSingle(onClick = onClickCameraIcon) in ProfileImage.kt is
missing accessibility semantics; update the composable to add semantics(role =
Role.Button) and a clear contentDescription (e.g., "Open camera" or "Edit
profile image") so screen readers announce its purpose. Apply the same change to
the other clickable element near lines 85-90 (the modify/edit icon) and ensure
you use the same unique identifiers (onClickCameraIcon / the edit-icon Box) so
the role and description are attached to those click handlers rather than only
visual styling.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Duplicate comments:
In
`@feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/component/ProfileImage.kt`:
- Around line 56-64: The clickable icon Box using
noRippleClickableSingle(onClick = onClickCameraIcon) in ProfileImage.kt is
missing accessibility semantics; update the composable to add semantics(role =
Role.Button) and a clear contentDescription (e.g., "Open camera" or "Edit
profile image") so screen readers announce its purpose. Apply the same change to
the other clickable element near lines 85-90 (the modify/edit icon) and ensure
you use the same unique identifiers (onClickCameraIcon / the edit-icon Box) so
the role and description are attached to those click handlers rather than only
visual styling.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: 6ee485e1-8f8c-4ce8-ab88-719db8674a7f

📥 Commits

Reviewing files that changed from the base of the PR and between c8d4e10 and 8f907a9.

📒 Files selected for processing (1)
  • feature/mypage/impl/src/main/java/com/neki/android/feature/mypage/impl/profile/component/ProfileImage.kt

Copy link
Copy Markdown
Contributor

@ikseong00 ikseong00 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

카메라 아이콘이랑, Edit 클릭 이벤트 나눈 것 좋은 거 같습니다!

@ikseong00 ikseong00 merged commit 2ab1e21 into develop Apr 13, 2026
5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Feat] 프로필 편집 화면 진입 로직 추가

2 participants