[Feat] collection create thumbnail#77
Conversation
chanmi1125
added
🧩 Component
📝 WalkthroughWalkthroughcollectionCreate 화면용 새 Composable Changes
Sequence Diagram(s)(생성 조건 미충족 — 생략) Estimated code review effort🎯 2 (Simple) | ⏱️ ~15 minutes Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 3 | ❌ 2❌ Failed checks (1 warning, 1 inconclusive)
✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches
📜 Recent review detailsConfiguration used: Organization UI Review profile: CHILL Plan: Pro 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
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: 1
🤖 Fix all issues with AI agents
In
@app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt:
- Around line 112-121: The preview function
CollectionCreateEmptyThumbnailPreview currently passes a real imageUrl to
CollectionCreateThumbnail so it renders a filled thumbnail; change the preview
to match its name by either renaming the function to
CollectionCreateFilledThumbnailPreview or adjusting the preview to show the
empty state (e.g., call CollectionCreateThumbnail with imageUrl = null or "" or
the prop/state that triggers the empty UI), ensuring you modify the
CollectionCreateEmptyThumbnailPreview identifier or the imageUrl argument
accordingly.
🧹 Nitpick comments (2)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt (2)
40-71: Empty 상태와 Fill 상태 간의 aspectRatio 불일치
CollectionCreateFillThumbnail은aspectRatio(1.5f / 1f)를 적용하고 있지만,CollectionCreateEmptyThumbnail에는 aspectRatio가 없습니다. 이로 인해 두 상태 간 전환 시 레이아웃 높이가 달라져 UI가 튀는 현상이 발생할 수 있습니다.♻️ aspectRatio 추가 제안
@Composable private fun CollectionCreateEmptyThumbnail( onClick: () -> Unit, modifier: Modifier = Modifier, ) { Box( modifier = modifier .fillMaxWidth() + .aspectRatio(1.5f / 1f) .noRippleClickable(onClick = onClick), contentAlignment = Alignment.Center, ) {
87-92: NetworkImage modifier 개선 고려
NetworkImage가fillMaxWidth()만 사용하고 있어, aspectRatio가 적용된 Box 내에서 이미지 높이가 Box를 완전히 채우지 못할 수 있습니다.fillMaxSize()를 사용하면 이미지가 Box 전체를 채울 수 있습니다.♻️ 제안된 수정
NetworkImage( imageUrl = imageUrl, modifier = Modifier - .fillMaxWidth(), + .fillMaxSize(), )
📜 Review details
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt
🧰 Additional context used
🧬 Code graph analysis (1)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt (2)
app/src/main/java/com/flint/core/designsystem/component/image/NetworkImage.kt (1)
NetworkImage(22-46)app/src/main/java/com/flint/core/designsystem/theme/Theme.kt (1)
FlintTheme(8-16)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: PR Build Check
- GitHub Check: PR Lint Check
🔇 Additional comments (1)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt (1)
20-38: LGTM!메인 Composable의 분기 로직이 명확하고, modifier가 하위 컴포넌트에 올바르게 전달되고 있습니다.
giovannijunseokim
force-pushed
the
feat/#71-collectionCreate-thumbnail
branch
from
08edd76 to
b5cbefe
Compare
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Fix all issues with AI agents
In
@app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt:
- Around line 46-77: CollectionCreateEmptyThumbnail lacks the aspectRatio used
in CollectionCreateFillThumbnail which causes height jumps; update
CollectionCreateEmptyThumbnail to apply the same aspectRatio(1.5f / 1f) to its
root modifier (e.g., on the Box or the same Modifier chain currently using
fillMaxWidth()/noRippleClickable) so both empty and filled thumbnails share
identical sizing behavior and prevent layout shifts.
- Line 3: Remove the unused import android.widget.Space from
CollectionCreateThumbnail.kt; the file uses
androidx.compose.foundation.layout.Spacer (imported on line 8) for Compose
spacing, so delete the android.widget.Space import to resolve the unused-import
warning and run lint/compile to confirm no other references remain.
🧹 Nitpick comments (3)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt (3)
6-7: 사용하지 않는 import 정리
Column과Row는 Preview 함수에서Column만 사용되고,Row는 사용되지 않습니다.♻️ 수정 제안
import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column -import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer
58-66: 배경 이미지에 Icon 대신 Image 사용 권장
Iconcomposable은 의미적으로 아이콘(버튼 아이콘, 상태 표시 등)에 사용됩니다. 배경 이미지(img_collection_bg1)는Imagecomposable을 사용하는 것이 더 적절합니다.♻️ 수정 제안
- Icon( + Image( modifier = Modifier .fillMaxWidth() .align(Alignment.Center), painter = painterResource(R.drawable.img_collection_bg1), contentDescription = null, - tint = Color.Unspecified, )Import 추가:
import androidx.compose.foundation.Image
118-137: Preview 함수 네이밍 개선 필요함수 이름이
CollectionCreateEmptyThumbnailPreview이지만 실제로는 filled 상태와 empty 상태 모두를 보여줍니다. 함수 이름을CollectionCreateThumbnailPreview로 변경하는 것이 좋습니다.♻️ 수정 제안
@Preview @Composable -fun CollectionCreateEmptyThumbnailPreview() { +private fun CollectionCreateThumbnailPreview() { FlintTheme { Column { CollectionCreateThumbnail(
📜 Review details
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt
🧰 Additional context used
🧬 Code graph analysis (1)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt (2)
app/src/main/java/com/flint/core/designsystem/component/image/NetworkImage.kt (1)
NetworkImage(22-46)app/src/main/java/com/flint/core/designsystem/theme/Theme.kt (1)
FlintTheme(8-16)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: PR Build Check
- GitHub Check: PR Lint Check
🔇 Additional comments (1)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt (1)
79-116: 구현이 적절합니다.NetworkImage 위에 blur 오버레이와 아이콘을 레이어링하는 구조가 잘 구현되어 있습니다. aspectRatio 적용도 올바릅니다.
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Fix all issues with AI agents
In
@app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt:
- Around line 44-75: The empty-thumbnail Composable
(CollectionCreateEmptyThumbnail) lacks the aspect ratio used by the
filled-thumbnail Composable (CollectionCreateFillThumbnail), causing layout
jumps; update CollectionCreateEmptyThumbnail to apply the same aspectRatio(1.5f
/ 1f) (on the Box or its root Modifier) so both states share identical aspect
ratio and stable layout when toggling between empty and filled.
🧹 Nitpick comments (2)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt (2)
56-64: 배경 이미지에는Imagecomposable 사용 권장
Icon은 일반적으로 벡터 아이콘용입니다. 배경 이미지(img_collection_bg1)에는Imagecomposable이 더 의미론적으로 적합합니다.tint = Color.Unspecified로 동작은 하지만,Image를 사용하면 의도가 더 명확해집니다.제안된 수정
- Icon( + Image( modifier = Modifier .fillMaxWidth() .align(Alignment.Center), painter = painterResource(R.drawable.img_collection_bg1), contentDescription = null, - tint = Color.Unspecified, )
Imageimport 추가 필요:import androidx.compose.foundation.Image
116-134: Preview 함수명이 실제 동작과 불일치함수명이
CollectionCreateEmptyThumbnailPreview이지만 실제로는 채워진 상태(imageUrl 있음)와 빈 상태(imageUrl = null) 모두를 프리뷰합니다. 함수명을CollectionCreateThumbnailPreview로 변경하면 의도가 더 명확해집니다.제안된 수정
@Preview @Composable -fun CollectionCreateEmptyThumbnailPreview() { +private fun CollectionCreateThumbnailPreview() { FlintTheme { Column {
📜 Review details
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt
🧰 Additional context used
🧬 Code graph analysis (1)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt (2)
app/src/main/java/com/flint/core/designsystem/component/image/NetworkImage.kt (1)
NetworkImage(22-46)app/src/main/java/com/flint/core/designsystem/theme/Theme.kt (1)
FlintTheme(8-16)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: PR Build Check
🔇 Additional comments (2)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt (2)
24-42: LGTM!
isNullOrBlank()사용으로 빈 문자열도 적절히 처리하고, Compose 컨벤션에 맞게 modifier를 마지막 파라미터로 배치했습니다.
77-114: LGTM!블러 오버레이와 함께 네트워크 이미지를 표시하는 구현이 적절합니다.
FlintTheme.colors.imgBlur를 활용한 오버레이 처리가 깔끔합니다.
| modifier = | ||
| modifier | ||
| .fillMaxWidth() | ||
| .aspectRatio(1.5f / 1f) |
There was a problem hiding this comment.
p3
3:2가 아니라 1.5:1로 한 이유가 있나용?
디자인 담당자님이 말씀해주실 때는 3:2로 명칭 얘기해주셨던 것 같아서요!
3 participants
📮 관련 이슈
📌 작업 내용
📸 스크린샷
| 스크린샷 |
😅 미구현
🫛 To. 리뷰어
Summary by CodeRabbit
✏️ Tip: You can customize this high-level summary in your review settings.