[Feature] AppBar Named Preset 시스템 구현 및 마이그레이션#84
Merged
Jooman-Lee merged 16 commits intodevelopfrom Mar 17, 2026
Merged
Conversation
- component: PickleAppBarV2 레이아웃 및 하위 서브컴포넌트 8종 추가 - model: VerdictTab enum 모델 추가 - drawable: ic_appbar_back 네이밍 정규화 및 close/option/search 아이콘 추가 - dimension: appBarHorizontalSpacing, appBarActionsSpacing 값 추가
- layout: PickleAppBarLayout internal 레이아웃 추가 (Layer 0) - preset: PickleLogoAppBar, PickleTitleAppBar, PickleSearchAppBar 추가 (Layer 2) - model: AppBarAction sealed interface 추가 - remove: PickleAppBarVerdictTabs, VerdictTab 제거 - strings: common_cancel 문자열 추가
- migrate: HomeScreen topBar → PickleLogoAppBar 적용 - remove: HomeTopBar.kt 삭제 - dimension: appBarLogoWidth(84dp), appBarLogoHeight(32dp) 추가 - layout: PickleAppBarLayout에 appBarHorizontalSpacing 패딩 적용
- rename: AppBarAction → PickleAppBarAction (모듈 분리 대비) - feat: Named Preset에 containerColor 파라미터 추가 - refactor: PickleAppBarTitle internal화 - fix: PickleAppBarActionIcon.contentDescription nullable 처리
- migrate: LedgerCreateScreen, LedgerEditScreen → PickleTitleAppBar 교체 - migrate: LedgerDetailScreen → PickleTitleAppBar 교체 (containerColor transparent - migrate: MyLedgerScreen → PickleTitleAppBar 교체 - remove: LedgerCreateAppBar.kt, LedgerDetailAppBar.kt 삭제
- migrate: NicknameScreen, NicknameSettingBaseContent → PickleTitleAppBar - migrate: SettingScreen → PickleBackAppBar (containerColor transparent) - cleanup: MyLedgerScreen 불필요한 import 제거
- move: PickleAppBarLayout, PickleAppBarLogo 등 7종 → appbar/component/ - remove: PickleAppBarV2.kt (슬롯 API 레거시) 삭제
…en 마이그레이션 - feat: PickleTitleAppBar back 없는 오버로드 추가 (title + actions only) - migrate: MyPageScreen → PickleTitleAppBar 오버로드로 교체 - rename: ic_appbar_setting → ic_app_bar_setting (네이밍 정규화)
… 오류 수정 - fix: OptionPreview "검색" → "옵션" - fix: ClosePreview "검색" → "닫기"
- deprecate: PickleAppBar → Named Preset 사용 안내 (WARNING)
|
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
📝 WalkthroughSummary by CodeRabbit릴리스 노트
Walkthrough앱바 디자인 시스템에 Named Preset(AppBar) 컴포저블(타이틀·로고·검색·뒤로가기), 내부 구성요소·액션 모델, 문서(CLAUDE.md), 치수 상수 및 벡터·문자열 리소스를 추가하고 기존 화면별 AppBar 구현들을 대체·제거했습니다. PickleLogo 미리보기의 명시적 너비 지정이 제거되었습니다. Changes
Estimated code review effort🎯 4 (Complex) | ⏱️ ~50 minutes 🚥 Pre-merge checks | ✅ 3 | ❌ 2❌ Failed checks (2 warnings)
✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches
🧪 Generate unit tests (beta)
📝 Coding Plan
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. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 8
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/PickleTopAppBar.kt (1)
97-117:⚠️ Potential issue | 🟠 Major
PickleAppBarWithBottomContent에도 동일한@Deprecated처리를 적용하기를 제안합니다.
PickleAppBar는 레거시 슬롯 API로 표시되어 있으며, 구체적인 마이그레이션 경로(PickleTitleAppBar,PickleBackAppBar,PickleLogoAppBar)가 안내되어 있습니다. 그런데PickleAppBar를 내부적으로 호출하는PickleAppBarWithBottomContent는@Deprecated처리가 없어서, 이 함수를 사용하는 곳에서는 deprecation 경고가 표시되지 않습니다.두 함수 모두 동일한 슬롯 API 기반이므로, 일관된 마이그레이션 경험을 위해
PickleAppBarWithBottomContent도 함께 deprecation 처리하시는 것이 좋을 것 같습니다.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/PickleTopAppBar.kt` around lines 97 - 117, PickleAppBarWithBottomContent wraps the legacy slot-based PickleAppBar but lacks the same `@Deprecated` annotation and migration guidance; mark PickleAppBarWithBottomContent as `@Deprecated` (matching the PickleAppBar deprecation message) and update its KDoc to point callers to the concrete replacements (PickleTitleAppBar, PickleBackAppBar, PickleLogoAppBar) so users get consistent deprecation warnings and migration guidance when they use PickleAppBarWithBottomContent.
🧹 Nitpick comments (7)
presentation/src/main/res/drawable/ic_app_bar_setting.xml (2)
7-8: 불필요할 수 있는 clip-path 요소입니다 (선택적 정리).
clip-path가M0,0h24v24h-24z로 정의되어 있는데, 이는 viewport 전체(24x24)와 동일한 영역입니다. viewport가 이미 24x24로 설정되어 있으므로 이 clip-path는 실질적인 효과가 없을 수 있습니다.디자인 툴(Figma, Sketch 등)에서 익스포트할 때 자동으로 추가되는 경우가 많은데요, 제거해도 렌더링에는 영향이 없습니다. 파일 크기나 가독성 측면에서 정리하시면 좋겠지만, 필수 사항은 아닙니다.
♻️ 정리 제안 (선택)
<vector xmlns:android="http://schemas.android.com/apk/res/android" android:width="24dp" android:height="24dp" android:viewportWidth="24" android:viewportHeight="24"> - <group> - <clip-path - android:pathData="M0,0h24v24h-24z"/> <path android:pathData="M13.356,1.669C13.775,1.67..." android:fillColor="#4C4E51"/> - </group> </vector>🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@presentation/src/main/res/drawable/ic_app_bar_setting.xml` around lines 7 - 8, 현재 SVG의 <clip-path> 요소(android:pathData="M0,0h24v24h-24z")는 viewport 전체와 동일하여 불필요하므로 이 <clip-path> 요소를 제거해 파일 크기와 가독성을 개선하세요; 제거 전후 렌더링 차이가 없는지 아이콘(관련 벡터 요소)을 확인하고, 제거를 원치 않으면 해당 <clip-path>에 주석을 남기거나 이름을 명시하여 의도적임을 표시하세요.
11-11: 하드코딩된 색상 값을 색상 리소스로 관리하는 방식으로 개선하는 것을 권장합니다.현재
fillColor="#4C4E51"이 파일에 직접 입력되어 있는데요, presentation 모듈이 library로 운영되고 있다는 점을 감안하면 다음과 같은 방식을 고려해볼 수 있습니다:
presentation 모듈의 colors.xml에서 색상 리소스 정의
presentation/src/main/res/values/colors.xml을 생성하여<color name="icon_app_bar_default">#4C4E51</color>형태로 정의- drawable에서는
android:fillColor="@color/icon_app_bar_default"방식으로 참조또는 Material Design 테마 속성 활용 (권장)
?attr/colorOnSurface또는 유사한 시스템 색상 속성 사용- 테마 변경 시 자동으로 대응되고, 라이트/다크 모드 지원이 수월함
이렇게 하면 나중에 앱바 아이콘의 색상을 통일되게 관리할 수 있고, 색상 변경 시에도 한 곳에서만 수정하면 됩니다. 현재 ic_app_bar_search.xml, ic_app_bar_option.xml, ic_app_bar_close.xml도 동일한 패턴이므로, 함께 정리하면 더 효율적일 것 같습니다.
참고로
<clip-path android:pathData="M0,0h24v24h-24z"/>는 viewport와 동일한 크기의 사각형을 정의하므로 제거해도 무방합니다.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@presentation/src/main/res/drawable/ic_app_bar_setting.xml` at line 11, Replace the hard-coded android:fillColor="#4C4E51" in ic_app_bar_setting.xml with a color resource or theme attribute and remove the redundant full-size clip-path: add a color entry (e.g., <color name="icon_app_bar_default">#4C4E51</color>) to presentation/src/main/res/values/colors.xml and change android:fillColor to reference it (android:fillColor="@color/icon_app_bar_default"), or prefer using a theme attribute like android:fillColor="?attr/colorOnSurface" for automatic light/dark handling; also remove the <clip-path android:pathData="M0,0h24v24h-24z"/> element since it matches the viewport.presentation/src/main/java/com/smtm/pickle/presentation/designsystem/theme/dimension/Dimensions.kt (1)
36-39: 앱바 치수 상수 네이밍은 한 번만 통일해두면 좋겠습니다.바로 위의
appbarHeight와 새로 추가된appBar*가 함께 노출되면 검색성과 자동완성이 갈립니다. 새 상수들이 더 퍼지기 전에 한쪽 규칙으로 맞춰두면 API가 훨씬 안정적으로 보입니다.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/theme/dimension/Dimensions.kt` around lines 36 - 39, The file mixes appbarHeight (lowercase 'b') with new appBarHorizontalSpacing, appBarActionsSpacing, appBarLogoWidth, appBarLogoHeight (camelCase 'B'); unify naming by renaming appbarHeight to appBarHeight (or vice versa if your project convention prefers lowercase 'b') and update all usages accordingly so autocomplete/search is consistent—adjust the constant name in Dimensions.kt and fix any references/imports across the codebase (and any KDoc or tests) to the chosen symbol (appBarHeight or appbarHeight).presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarSearchField.kt (1)
21-21: 선택적 개선: 하드코딩된 padding 값을 Dimensions로 추출하는 것을 고려해 보세요.현재
end = 6.dp가 하드코딩되어 있는데, 다른 앱바 관련 spacing 값들(appBarHorizontalSpacing,appBarActionsSpacing등)처럼Dimensions에 정의하면 일관성과 유지보수성이 향상될 수 있습니다. 다만 현재 구현도 기능적으로는 문제없습니다.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarSearchField.kt` at line 21, The hardcoded modifier padding end = 6.dp in PickleAppBarSearchField should be replaced with a Dimensions constant for consistency; add a descriptive constant (e.g., appBarSearchFieldEndPadding or reuse appBarHorizontalSpacing/appBarActionsSpacing if appropriate) in your Dimensions file and update the modifier = modifier.padding(end = ...) call in the PickleAppBarSearchField composable to reference that constant so spacing is centralized and maintainable.presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarBackButton.kt (1)
15-15: 선택적 개선: contentDescription을 string resource로 관리하는 것을 고려해 보세요.현재
contentDescription이 하드코딩된 Korean 문자열"뒤로가기"로 되어 있습니다. 만약 향후 다국어 지원이 필요하다면stringResource(R.string.common_back)형태로 관리하는 것이 접근성과 i18n 측면에서 유리합니다. 현재 앱이 단일 언어만 지원한다면 이 부분은 무시하셔도 됩니다.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarBackButton.kt` at line 15, Replace the hardcoded Korean default for the contentDescription in the PickleAppBarBackButton composable with a string resource: change the parameter from contentDescription: String = "뒤로가기" to something like `@StringRes` contentDescriptionRes: Int = R.string.common_back, and inside PickleAppBarBackButton call stringResource(contentDescriptionRes) to produce the actual String passed to the icon's contentDescription; update usages/call sites of PickleAppBarBackButton accordingly.presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/model/PickleAppBarAction.kt (1)
6-9: 아이콘 액션의contentDescription은 필수값으로 두는 편이 좋겠습니다.현재처럼 nullable로 열어두면 이번 PR의
LedgerDetailScreen처럼 실제 액션 버튼에서 설명이 빠지기 쉽고, TalkBack 사용자는 버튼 목적을 알기 어렵습니다. 클릭 가능한 AppBar 아이콘만 이 모델을 사용한다면String을 필수로 두고 호출부에서stringResource(...)를 넘기도록 고정하는 쪽이 더 안전해 보입니다.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/model/PickleAppBarAction.kt` around lines 6 - 9, The Icon data class in PickleAppBarAction.kt currently defines contentDescription as nullable; change it to a non-nullable String (e.g., val contentDescription: String) so all AppBar icon actions must provide an accessible label, update any call sites (e.g., usages in LedgerDetailScreen) to pass stringResource(...) or a literal string, and ensure any places constructing PickleAppBarAction.Icon are updated to supply that required contentDescription.presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/PickleTitleAppBar.kt (1)
22-41: 액션 렌더링 분기를 한 곳으로 모아두면 유지보수가 쉬워집니다.Line 22-41과 Line 54-69가 동일하고, 같은 분기가
PickleLogoAppBar.ktLine 22-37에도 반복됩니다. 추후 action 타입이 늘어나거나 공통 spacing/semantics를 조정할 때 세 군데가 쉽게 어긋날 수 있어서,PickleAppBarActions(actions)같은 internal composable로 추출해 두는 편을 권하고 싶습니다.♻️ 추출 예시
+@Composable +internal fun PickleAppBarActions(actions: List<PickleAppBarAction>) { + actions.forEach { action -> + when (action) { + is PickleAppBarAction.Icon -> PickleAppBarActionIcon( + iconRes = action.icon, + contentDescription = action.contentDescription, + onClick = action.onClick, + ) + + is PickleAppBarAction.Text -> PickleAppBarTextAction( + text = action.label, + onClick = action.onClick, + ) + } + } +} + fun PickleTitleAppBar( title: String, onBack: () -> Unit, actions: List<PickleAppBarAction> = emptyList(), containerColor: Color = PickleTheme.colors.base0, ) { PickleAppBarLayout( containerColor = containerColor, start = { PickleAppBarBackButton(onClick = onBack) }, center = { PickleAppBarTitle(text = title) }, - end = { - actions.forEach { action -> - when (action) { - is PickleAppBarAction.Icon -> PickleAppBarActionIcon( - iconRes = action.icon, - contentDescription = action.contentDescription, - onClick = action.onClick - ) - - is PickleAppBarAction.Text -> PickleAppBarTextAction( - text = action.label, - onClick = action.onClick - ) - } - } - } + end = { PickleAppBarActions(actions) } ) }Also applies to: 54-69
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/PickleTitleAppBar.kt` around lines 22 - 41, The action-rendering logic is duplicated across PickleTitleAppBar (the end lambda) and PickleLogoAppBar; extract that branching into a single internal composable (e.g., PickleAppBarActions(actions: List<PickleAppBarAction>)) and replace the repeated forEach/when blocks with a call to that composable in both PickleTitleAppBar and PickleLogoAppBar; ensure the new PickleAppBarActions handles both PickleAppBarAction.Icon and PickleAppBarAction.Text and preserves existing spacing/semantics so behavior is unchanged.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In
`@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/CLAUDE.md`:
- Around line 23-27: The fenced code block in CLAUDE.md currently has no
language and triggers MD040; update the triple-backtick block around the "Layer
0/1/2" text to include a language identifier (e.g., change ``` to ```text) so
the markdown linter stops warning; locate the fenced block in CLAUDE.md
containing "Layer 0: PickleAppBarLayout..." and add the language token
immediately after the opening backticks.
- Around line 66-70: Update the example drawable name to match the repo's app
bar resource naming (ic_app_bar_*) so documentation aligns with code
conventions: in the PickleTitleAppBar example replace R.drawable.ic_option with
the canonical name (e.g., R.drawable.ic_app_bar_option) used across
PickleTitleAppBar / PickleAppBarAction.Icon so users copying the snippet follow
the same ic_app_bar_* pattern.
In
`@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarLayout.kt`:
- Around line 33-41: The center slot can overlap start/end because all three
(start, center, end) are independently placed; update PickleAppBarLayout to
reserve space for start and end and constrain the center's max width accordingly
(e.g., measure start and end widths via BoxWithConstraints or a custom
Layout/ConstraintLayout, then apply Modifier.widthIn(max = availableWidth) or
horizontal padding to the center slot). Specifically, ensure the start() content
(Box with Modifier.align(Alignment.CenterStart)) and end() content (Row with
Modifier.align(Alignment.CenterEnd)) are measured first and their combined
widths subtracted from the total before rendering center() (Box with
Modifier.align(Alignment.Center)), so the center content cannot exceed the
remaining space and won’t overlap the back/action areas.
In
`@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarTitle.kt`:
- Around line 16-20: The AppBar title Text in PickleAppBarTitle should be
constrained to a single line to prevent the fixed-height PickleAppBarLayout from
expanding; update the Text(...) invocation inside PickleAppBarTitle to include
maxLines = 1 and overflow = TextOverflow.Ellipsis (keeping the existing text,
style, color parameters) so long titles or translations are truncated with an
ellipsis.
In `@presentation/src/main/java/com/smtm/pickle/presentation/home/HomeScreen.kt`:
- Around line 105-113: The hardcoded accessibility label "통계" in
PickleLogoAppBar's action should be moved to resources: replace the literal
contentDescription in the PickleAppBarAction.Icon with a call to
stringResource(R.string.<appropriate_name>) (e.g.,
R.string.ic_appbar_statistics_description) and add the corresponding entry to
strings.xml; update usages of PickleLogoAppBar/PickleAppBarAction.Icon
(contentDescription) to use that string resource so the label is localizable and
centrally managed.
In
`@presentation/src/main/java/com/smtm/pickle/presentation/ledger/create/LedgerCreateScreen.kt`:
- Around line 117-120: 현재 상단 inset이 중복 적용되고 있으니 부모 Column에서 호출된
systemBarsPadding()를 제거하고 상단 inset 처리는 AppBar 쪽(PickleTitleAppBar의
statusBarsPadding())만 책임지게 정리하세요; 대신 본문 영역에 하단 인셋이 필요하면
navigationBarsPadding()이나 content에만 systemBarsPadding()을 적용하도록 변경하고, 관련 레이아웃은
Column(부모)에서 systemBarsPadding() 호출을 삭제하고 본문 컴포저블 또는 PickleTitleAppBar 코드만
statusBarsPadding()/navigationBarsPadding()을 사용하도록 수정하세요.
In
`@presentation/src/main/java/com/smtm/pickle/presentation/ledger/detail/LedgerDetailScreen.kt`:
- Around line 109-117: The two PickleAppBarAction.Icon entries (used with icons
R.drawable.ic_ledger_detail_edit_pen and R.drawable.ic_ledger_detail_trashcan
and handlers onEditClick/onDeleteButtonClick) lack accessibility labels; add a
contentDescription parameter to each by passing a localized string via
stringResource(R.string.<appropriate_edit_description>) and
stringResource(R.string.<appropriate_delete_description>) (or reuse existing
string keys) so assistive technologies can identify the actions.
In
`@presentation/src/main/java/com/smtm/pickle/presentation/mypage/MyPageScreen.kt`:
- Line 15: Replace the deprecated import
androidx.hilt.navigation.compose.hiltViewModel in MyPageScreen.kt with the newer
androidx.hilt.lifecycle.viewmodel.compose.hiltViewModel; locate usages of
hiltViewModel() in the MyPageScreen composable or any related functions/classes
and ensure the import matches the Hilt 1.3.0+ API so the existing calls to
hiltViewModel() continue to resolve correctly (add the
androidx.hilt:hilt-lifecycle-viewmodel-compose artifact to dependencies if not
already present).
---
Outside diff comments:
In
`@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/PickleTopAppBar.kt`:
- Around line 97-117: PickleAppBarWithBottomContent wraps the legacy slot-based
PickleAppBar but lacks the same `@Deprecated` annotation and migration guidance;
mark PickleAppBarWithBottomContent as `@Deprecated` (matching the PickleAppBar
deprecation message) and update its KDoc to point callers to the concrete
replacements (PickleTitleAppBar, PickleBackAppBar, PickleLogoAppBar) so users
get consistent deprecation warnings and migration guidance when they use
PickleAppBarWithBottomContent.
---
Nitpick comments:
In
`@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarBackButton.kt`:
- Line 15: Replace the hardcoded Korean default for the contentDescription in
the PickleAppBarBackButton composable with a string resource: change the
parameter from contentDescription: String = "뒤로가기" to something like `@StringRes`
contentDescriptionRes: Int = R.string.common_back, and inside
PickleAppBarBackButton call stringResource(contentDescriptionRes) to produce the
actual String passed to the icon's contentDescription; update usages/call sites
of PickleAppBarBackButton accordingly.
In
`@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarSearchField.kt`:
- Line 21: The hardcoded modifier padding end = 6.dp in PickleAppBarSearchField
should be replaced with a Dimensions constant for consistency; add a descriptive
constant (e.g., appBarSearchFieldEndPadding or reuse
appBarHorizontalSpacing/appBarActionsSpacing if appropriate) in your Dimensions
file and update the modifier = modifier.padding(end = ...) call in the
PickleAppBarSearchField composable to reference that constant so spacing is
centralized and maintainable.
In
`@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/model/PickleAppBarAction.kt`:
- Around line 6-9: The Icon data class in PickleAppBarAction.kt currently
defines contentDescription as nullable; change it to a non-nullable String
(e.g., val contentDescription: String) so all AppBar icon actions must provide
an accessible label, update any call sites (e.g., usages in LedgerDetailScreen)
to pass stringResource(...) or a literal string, and ensure any places
constructing PickleAppBarAction.Icon are updated to supply that required
contentDescription.
In
`@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/PickleTitleAppBar.kt`:
- Around line 22-41: The action-rendering logic is duplicated across
PickleTitleAppBar (the end lambda) and PickleLogoAppBar; extract that branching
into a single internal composable (e.g., PickleAppBarActions(actions:
List<PickleAppBarAction>)) and replace the repeated forEach/when blocks with a
call to that composable in both PickleTitleAppBar and PickleLogoAppBar; ensure
the new PickleAppBarActions handles both PickleAppBarAction.Icon and
PickleAppBarAction.Text and preserves existing spacing/semantics so behavior is
unchanged.
In
`@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/theme/dimension/Dimensions.kt`:
- Around line 36-39: The file mixes appbarHeight (lowercase 'b') with new
appBarHorizontalSpacing, appBarActionsSpacing, appBarLogoWidth, appBarLogoHeight
(camelCase 'B'); unify naming by renaming appbarHeight to appBarHeight (or vice
versa if your project convention prefers lowercase 'b') and update all usages
accordingly so autocomplete/search is consistent—adjust the constant name in
Dimensions.kt and fix any references/imports across the codebase (and any KDoc
or tests) to the chosen symbol (appBarHeight or appbarHeight).
In `@presentation/src/main/res/drawable/ic_app_bar_setting.xml`:
- Around line 7-8: 현재 SVG의 <clip-path> 요소(android:pathData="M0,0h24v24h-24z")는
viewport 전체와 동일하여 불필요하므로 이 <clip-path> 요소를 제거해 파일 크기와 가독성을 개선하세요; 제거 전후 렌더링 차이가
없는지 아이콘(관련 벡터 요소)을 확인하고, 제거를 원치 않으면 해당 <clip-path>에 주석을 남기거나 이름을 명시하여 의도적임을
표시하세요.
- Line 11: Replace the hard-coded android:fillColor="#4C4E51" in
ic_app_bar_setting.xml with a color resource or theme attribute and remove the
redundant full-size clip-path: add a color entry (e.g., <color
name="icon_app_bar_default">#4C4E51</color>) to
presentation/src/main/res/values/colors.xml and change android:fillColor to
reference it (android:fillColor="@color/icon_app_bar_default"), or prefer using
a theme attribute like android:fillColor="?attr/colorOnSurface" for automatic
light/dark handling; also remove the <clip-path
android:pathData="M0,0h24v24h-24z"/> element since it matches the viewport.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: a6d2b209-5cbb-45b4-aec7-93fe66d1f175
📒 Files selected for processing (35)
presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/PickleLogo.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/CLAUDE.mdpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/PickleBackAppBar.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/PickleLogoAppBar.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/PickleSearchAppBar.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/PickleTitleAppBar.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/PickleTopAppBar.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarActionIcon.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarBackButton.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarLayout.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarLogo.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarSearchField.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarTextAction.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarTitle.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/model/PickleAppBarAction.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/theme/dimension/Dimensions.ktpresentation/src/main/java/com/smtm/pickle/presentation/home/HomeScreen.ktpresentation/src/main/java/com/smtm/pickle/presentation/home/component/HomeTopBar.ktpresentation/src/main/java/com/smtm/pickle/presentation/ledger/create/LedgerCreateScreen.ktpresentation/src/main/java/com/smtm/pickle/presentation/ledger/create/component/LedgerCreateAppBar.ktpresentation/src/main/java/com/smtm/pickle/presentation/ledger/detail/LedgerDetailScreen.ktpresentation/src/main/java/com/smtm/pickle/presentation/ledger/detail/component/LedgerDetailAppBar.ktpresentation/src/main/java/com/smtm/pickle/presentation/ledger/edit/LedgerEditScreen.ktpresentation/src/main/java/com/smtm/pickle/presentation/login/nickname/NicknameScreen.ktpresentation/src/main/java/com/smtm/pickle/presentation/mypage/MyPageScreen.ktpresentation/src/main/java/com/smtm/pickle/presentation/mypage/myledger/MyLedgerScreen.ktpresentation/src/main/java/com/smtm/pickle/presentation/mypage/profile/components/NicknameSettingBaseContent.ktpresentation/src/main/java/com/smtm/pickle/presentation/setting/SettingScreen.ktpresentation/src/main/res/drawable/ic_app_bar_back.xmlpresentation/src/main/res/drawable/ic_app_bar_close.xmlpresentation/src/main/res/drawable/ic_app_bar_option.xmlpresentation/src/main/res/drawable/ic_app_bar_search.xmlpresentation/src/main/res/drawable/ic_app_bar_setting.xmlpresentation/src/main/res/drawable/ic_appbar_setting.xmlpresentation/src/main/res/values/strings.xml
💤 Files with no reviewable changes (5)
- presentation/src/main/res/drawable/ic_appbar_setting.xml
- presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/PickleLogo.kt
- presentation/src/main/java/com/smtm/pickle/presentation/ledger/create/component/LedgerCreateAppBar.kt
- presentation/src/main/java/com/smtm/pickle/presentation/home/component/HomeTopBar.kt
- presentation/src/main/java/com/smtm/pickle/presentation/ledger/detail/component/LedgerDetailAppBar.kt
Summary of ChangesHello, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! 이 Pull Request는 디자인 시스템 내 AppBar 컴포넌트의 아키텍처를 재설계하여, 기존의 유연하지만 오용 가능성이 있던 슬롯 API 방식에서 구조화되고 타입 안전성이 강화된 Named Preset 방식으로 전환합니다. 이를 통해 개발자들이 AppBar를 더 쉽게 이해하고 일관성 있게 사용할 수 있도록 하며, 여러 화면에 걸쳐 AppBar의 구현을 표준화하고 중복 코드를 제거하는 것을 목표로 합니다. 새로운 시스템은 가독성을 향상시키고, 내부 구현에 대한 직접적인 접근을 차단하여 디자인 시스템의 견고함을 높입니다. Highlights
🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console. Changelog
Activity
Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for GitHub and other Google products, sign up here. You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension. Footnotes
|
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
전반적으로 AppBar 시스템을 슬롯 기반 API에서 Named Preset 아키텍처로 재설계한 훌륭한 리팩터링입니다. 이를 통해 타입 안정성과 가독성이 크게 향상되었습니다. 몇 가지 개선점을 제안합니다:
- 여러 AppBar에서 중복되는 액션 렌더링 로직을 별도의 Composable로 추출하여 재사용성을 높일 수 있습니다.
- 접근성 향상을 위해 아이콘 액션에
contentDescription을 추가하는 것이 좋습니다. - 일부 아이콘 리소스 이름이 새로운 명명 규칙을 따르지 않아 일관성을 위해 수정을 제안합니다.
- 새로 추가된 코딩 지침 문서(
CLAUDE.md)에 작은 오타가 있어 수정이 필요합니다.
자세한 내용은 각 파일에 남긴 리뷰 코멘트를 참고해주세요.
- fix: LedgerCreateScreen systemBarsPadding → navigationBarsPadding - fix: PickleAppBarTitle maxLines=1, TextOverflow.Ellipsis 추가 - fix: LedgerDetailScreen 편집/삭제 아이콘 contentDescription 추가 - fix: HomeScreen 통계 아이콘 contentDescription stringResource 적용 - rename: ic_appbar_statistics → ic_app_bar_statistics 네이밍 정규화 - docs: CLAUDE.md MD040 수정, ic_app_bar_option 오타 수정
- extract: actions forEach/when 블록 → PickleAppBarActions building block으로 통합 - apply: PickleTitleAppBar (2 오버로드), PickleLogoAppBar에 적용
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In
`@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarActions.kt`:
- Around line 10-26: PickleAppBarActions currently renders actions with no
spacing; use the design token by adding
Arrangement.spacedBy(Dimensions.appBarActionsSpacing) to the Row in the
PickleAppBarLayout end slot (where actions are placed) so each
PickleAppBarAction (Icon/Text) is separated; locate the end slot Row in
PickleAppBarLayout and pass
Arrangement.spacedBy(Dimensions.appBarActionsSpacing) to its
horizontalArrangement parameter so the existing actions rendered by
PickleAppBarActions receive the defined appBarActionsSpacing.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 5447312f-0360-42ba-b1a4-b1ab83730d91
📒 Files selected for processing (3)
presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/PickleLogoAppBar.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/PickleTitleAppBar.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarActions.kt
Jooman-Lee
changed the title
UiHyeon-Kim
reviewed
Mar 16, 2026
Comment on lines
+13
to
+37
| @Composable | ||
| fun PickleSearchAppBar( | ||
| value: String, | ||
| onValueChange: (String) -> Unit, | ||
| onCancel: () -> Unit, | ||
| hint: String = "", | ||
| containerColor: Color = PickleTheme.colors.base0, | ||
| ) { | ||
| PickleAppBarLayout( | ||
| containerColor = containerColor, | ||
| center = { | ||
| PickleAppBarSearchField( | ||
| value = value, | ||
| onValueChange = onValueChange, | ||
| hint = hint, | ||
| ) | ||
| }, | ||
| end = { | ||
| PickleAppBarTextAction( | ||
| text = stringResource(R.string.common_cancel), | ||
| onClick = onCancel | ||
| ) | ||
| } | ||
| ) | ||
| } |
Member
There was a problem hiding this comment.
PickleAppBarLayout이 Box로 구성되어있어 서치바의 레이아웃이 겹치는 것 같습니다
Collaborator
Author
There was a problem hiding this comment.
refactor(design-system): appBarContainerModifier 추출로 SearchAppBar 레이아웃 구조 개선 커밋으로 수정했습니다!
확인 감사합니다!!
…웃 구조 개선 - extract: 컨테이너 스타일링 → appBarContainerModifier internal 확장으로 추출 - apply: PickleAppBarLayout에 appBarContainerModifier 적용 (동작 변경 없음) - refactor: PickleSearchAppBar → Row + weight(1f)로 재구현 (검색 필드 전체 너비 확보) - add: Dimensions.appBarSearchSpacing 신규 값 추가 - docs: CLAUDE.md 레이어 구조 및 새 프리셋 패턴 반영
There was a problem hiding this comment.
🧹 Nitpick comments (3)
presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarContainerModifier.kt (1)
17-17: 네이밍 컨벤션 일관성 검토 제안드립니다.
Dimensions.appbarHeight는 소문자 'b'를 사용하고 있는 반면, 같은 파일 내 다른 AppBar 관련 상수들(appBarHorizontalSpacing,appBarActionsSpacing등)은 camelCase를 사용하고 있습니다. 코드 가독성과 자동완성 편의를 위해 일관된 네이밍으로 통일하시면 좋을 것 같습니다.♻️ Dimensions.kt에서 네이밍 통일 제안
// 앱바 - val appbarHeight = 56.dp + val appBarHeight = 56.dp🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarContainerModifier.kt` at line 17, Dimensions.appbarHeight uses inconsistent naming; rename it to appBarHeight and update all usages to match the camelCase convention used by appBarHorizontalSpacing and appBarActionsSpacing. Modify the constant declaration in Dimensions (change Dimensions.appbarHeight → Dimensions.appBarHeight), then update every reference (e.g., the call to .requiredHeight(Dimensions.appbarHeight) in PickleAppBarContainerModifier and any other callers) to the new name so compilation and autocompletion remain consistent.presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/CLAUDE.md (2)
59-72: 코드 블록에 언어를 명시하면 일관성이 높아집니다.Line 59의 코드 블록에도
kotlin을 명시하면 문서 전체의 코드 예시들이 동일한 형식을 따르게 되어 더 체계적으로 보일 것 같습니다.♻️ 일관성 개선 제안
-``` +```kotlin // model/PickleAppBarAction.kt sealed interface PickleAppBarAction {🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/CLAUDE.md` around lines 59 - 72, The code block showing PickleAppBarAction and usage in CLAUDE.md is missing the Kotlin language tag; update the fenced code block that contains the PickleAppBarAction sealed interface and the PickleTitleAppBar usage to start with ```kotlin so the snippet (containing PickleAppBarAction, PickleAppBarAction.Icon/Text and the PickleTitleAppBar example) is consistently marked as Kotlin for syntax highlighting.
47-53: 코드 블록에 언어를 명시하면 가독성이 더 좋아질 것 같습니다.Line 47의 코드 블록에
kotlin을 명시하면 다른 코드 예시(Line 11)와 일관성이 유지되고, 문서 도구에서도 더 나은 하이라이팅을 제공할 수 있습니다.♻️ 일관성 개선 제안
-``` +```kotlin PickleLogoAppBar(actions: List<PickleAppBarAction> = emptyList()) PickleTitleAppBar(title, onBack, actions = emptyList(), containerColor?)🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/CLAUDE.md` around lines 47 - 53, Update the fenced code block containing PickleLogoAppBar, PickleTitleAppBar, PickleSearchAppBar, and PickleBackAppBar to specify the kotlin language (change the opening ``` to ```kotlin) so it matches the other example and enables proper syntax highlighting and consistency in the document.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In
`@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/CLAUDE.md`:
- Around line 59-72: The code block showing PickleAppBarAction and usage in
CLAUDE.md is missing the Kotlin language tag; update the fenced code block that
contains the PickleAppBarAction sealed interface and the PickleTitleAppBar usage
to start with ```kotlin so the snippet (containing PickleAppBarAction,
PickleAppBarAction.Icon/Text and the PickleTitleAppBar example) is consistently
marked as Kotlin for syntax highlighting.
- Around line 47-53: Update the fenced code block containing PickleLogoAppBar,
PickleTitleAppBar, PickleSearchAppBar, and PickleBackAppBar to specify the
kotlin language (change the opening ``` to ```kotlin) so it matches the other
example and enables proper syntax highlighting and consistency in the document.
In
`@presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarContainerModifier.kt`:
- Line 17: Dimensions.appbarHeight uses inconsistent naming; rename it to
appBarHeight and update all usages to match the camelCase convention used by
appBarHorizontalSpacing and appBarActionsSpacing. Modify the constant
declaration in Dimensions (change Dimensions.appbarHeight →
Dimensions.appBarHeight), then update every reference (e.g., the call to
.requiredHeight(Dimensions.appbarHeight) in PickleAppBarContainerModifier and
any other callers) to the new name so compilation and autocompletion remain
consistent.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: cad2024d-6bfd-4686-a3ab-b4c84a931f2e
📒 Files selected for processing (5)
presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/CLAUDE.mdpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/PickleSearchAppBar.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarContainerModifier.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/component/PickleAppBarLayout.ktpresentation/src/main/java/com/smtm/pickle/presentation/designsystem/theme/dimension/Dimensions.kt
🚧 Files skipped from review as they are similar to previous changes (2)
- presentation/src/main/java/com/smtm/pickle/presentation/designsystem/components/appbar/PickleSearchAppBar.kt
- presentation/src/main/java/com/smtm/pickle/presentation/designsystem/theme/dimension/Dimensions.kt
UiHyeon-Kim
approved these changes
Mar 17, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
♟️ Issue
✨ 주요 변경 사항
[appbar 시스템 재설계] 슬롯 API(V1) → Named Preset(V2) 아키텍처로 전환
PickleAppBarLayout(internal) — 3-zone 레이아웃,statusBarsPadding내부 처리component/Building blocks — 디자인 시스템 컴포넌트 8종 (PickleAppBarBackButton,PickleAppBarTitle,PickleAppBarLogo,PickleAppBarActionIcon,PickleAppBarTextAction,PickleAppBarSearchField,PickleAppBarLayout)PickleLogoAppBar,PickleTitleAppBar×2,PickleSearchAppBar,PickleBackAppBar)PickleAppBarActionsealed interface (Icon/Text) 추가PickleAppBar,PickleAppBarWithBottomContent@Deprecated(WARNING)처리[화면 마이그레이션] 기존 화면 7개 → Named Preset으로 교체
HomeScreen,LedgerCreateScreen,LedgerEditScreen,LedgerDetailScreen,NicknameScreen,SettingScreen,MyPageScreen,MyLedgerScreenHomeTopBar,LedgerCreateAppBar,LedgerDetailAppBar) 삭제[아이콘 정리]
ic_appbar_*→ic_app_bar_*네이밍 정규화, close/option/search/setting 아이콘 추가[CLAUDE.md] appbar 패키지 내 Claude Code용 코딩 지침 문서 추가
기존
PickleAppBar(V1) 대비 개선점PickleAppBar@Composable RowScope.() -> UnitList<PickleAppBarAction>sealed 타입PickleTitleAppBar(title, onBack)— 이름이 의도를 표현PickleAppBarAction— Icon/Text 외 추가 불가NavigationItem.Back(onClick)enum 전달onBack: () -> Unit직접 파라미터AppBarAlignment.Start / Center선택PickleAppBarLayout내부에서 자동 처리internal처리로 구조적 차단HomeTopBar.kt,LedgerDetailAppBar.kt등 개별 파일 필요✅ 체크리스트
🔍 중점 리뷰 사항
PickleAppBarLayout의internal적용이 실제로 화면 레이어에서 접근 차단되는지 확인PickleAppBarActionsealed interface —whenexhaustive 체크가 올바르게 동작하는지OnboardingScreen은 V1PickleAppBar아직 사용 중 (이번 PR 범위 외, 추후 마이그레이션 예정)