Skip to content

[Feat] collection create empty UI#102

Merged
nahy-512 merged 9 commits into
developfrom
Feat/#85-Collection-Create-Empty-UI
Jan 16, 2026
Merged

[Feat] collection create empty UI#102
nahy-512 merged 9 commits into
developfrom
Feat/#85-Collection-Create-Empty-UI

Conversation

@chanmi1125

@chanmi1125 chanmi1125 commented Jan 14, 2026

Copy link
Copy Markdown
Contributor

📮 관련 이슈

📌 작업 내용

  • collection create UI

📸 스크린샷

스크린샷
Screenshot_20260115-011128_Flint
Screenshot_20260115-011332_Flint
Screenshot_20260115-012328_Flint
videoframe_2337

😅 미구현

  • [ ]

🫛 To. 리뷰어

  • 버튼 부분은 준서님이 수정해주실 예정입니다~~

Summary by CodeRabbit

  • New Features

    • 컬렉션 생성 화면 전체 UI 추가(썸네일, 제목/설명, 가시성 토글, 작품 추가/목록, 바텀시트, 삭제 모달)
    • 컬렉션용 영화 아이템 리스트 컴포넌트 추가(삭제, 스포일러 토글, 사유 입력, 미리보기)
    • 샘플 영화 데이터(dummy list) 추가로 화면 미리보기 강화
  • Refactor

    • 컬렉션 생성 흐름을 별도 화면으로 분리하고 내부 상태·워크플로우 정리
  • Style

    • 토글 및 썸네일/패딩 등 UI 치수 조정으로 시각 개선
    • 일부 컴포넌트 미리보기 설정 업데이트
  • Behavior

    • 버튼 컴포넌트에 활성화/비활성화 옵션 노출
    • 바텀시트 등 컴포넌트에 modifier 전달 가능하도록 개선

✏️ Tip: You can customize this high-level summary in your review settings.

* CollectionCreateScreen
    - LazyColumn을 사용하여 FilmItemList를 추가
    - `컬렉션의 주제를 작성해주세요` 플레이스홀더를 `컬렉션의 소개를 작성해주세요`로 변경
    - 하단 완료 버튼에 padding 추가
* CollectionCreateFilmItemList
    - `작품 추가하기` 시 노출될 Film Item List 컴포저블 제작
* FlintBasicToggle
    - padding 추가 및 thumb size 변경
* CollectionCreateFilmSection
    - 불필요한 background 제거
@chanmi1125 chanmi1125 self-assigned this Jan 14, 2026
@chanmi1125 chanmi1125 requested a review from a team as a code owner January 14, 2026 16:25
@chanmi1125 chanmi1125 added the 📱 UI feat - 컴포넌트 조립, 화면 구현 label Jan 14, 2026
@coderabbitai

coderabbitai Bot commented Jan 14, 2026

Copy link
Copy Markdown
Contributor
📝 Walkthrough

Walkthrough

컬렉션 생성 화면과 관련 하위 컴포넌트들을 추가하고, 토글·버튼·바텀시트 등 디자인 시스템 컴포넌트의 레이아웃 및 공개 API를 일부 조정했습니다.

Changes

Cohort / File(s) 변경 요약
CollectionCreate screen & model
app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt, app/src/main/java/com/flint/presentation/collectioncreate/model/CollectionFilmUiModel.kt
신규 CollectionCreateScreenCollectionCreateRoute 추가, 로컬 UI 상태 및 샘플 데이터(CollectionFilmUiModeldummyFilmList) 추가, Preview 추가
CollectionCreate 하위 컴포넌트
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt, app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmSection.kt, app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionAddFilmBottomSheet.kt
CollectionCreateFilmItemList 신규 추가(취소 아이콘, 스포일러 토글, 사유 입력 등), CollectionCreateFilmSection에서 Row 배경 제거 및 Preview 설정 변경, CollectionAddFilmBottomSheetmodifier: Modifier = Modifier 파라미터 추가 및 전달
토글 시각/상호작용 조정
app/src/main/java/com/flint/core/designsystem/component/toggle/FlintBasicToggle.kt
noRippleClickable에 수직 10.dp 패딩 추가, 썸프 콘텐츠 크기 28.dp → 24.dp로 축소 (클릭 로직 유지)
버튼 API 확장
app/src/main/java/com/flint/core/designsystem/component/button/...
FlintBasicButton.kt, FlintIconButton.kt, FlintLargeButton.kt, FlintMediumButton.kt
공통으로 enabled: Boolean = true 파라미터 추가 및 하위 FlintBasicButton 호출에 전달하도록 변경 (외부에서 활성화/비활성화 제어 가능)
바텀시트 레이아웃 조정
app/src/main/java/com/flint/core/designsystem/component/bottomsheet/MenuBottomSheet.kt
LazyColumn에 하단 패딩 12.dp 추가

Sequence Diagram(s)

sequenceDiagram
participant User as User
participant Screen as CollectionCreateScreen
participant BottomSheet as CollectionAddFilmBottomSheet
participant FilmList as CollectionCreateFilmItemList

User->>Screen: 화면 진입·입력/버튼 상호작용
User->>Screen: 작품 추가 요청 (갤러리/추가 버튼)
Screen->>BottomSheet: show bottom sheet
BottomSheet->>User: 작품 선택 UI 표시
User->>BottomSheet: 작품 선택
BottomSheet->>Screen: 선택 결과 전달
Screen->>FilmList: 항목 렌더(데이터 전달)
User->>FilmList: 항목 취소/토글/사유 입력
FilmList->>Screen: 콜백(onCancel/onToggle/onReason)
Screen->>User: UI 상태 업데이트 / 완료 동작
Loading

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~45 minutes

Possibly related PRs

Suggested labels

🧩 Component

Suggested reviewers

  • nahy-512
  • giovannijunseokim

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 The title '[Feat] collection create empty UI' clearly and concisely describes the main change: implementing the collection creation screen UI.
Description check ✅ Passed The PR description follows the template structure with linked issue (#85), work content summary, screenshots/video, unimplemented items section, and reviewer notes.
Linked Issues check ✅ Passed The PR implements the collection creation UI as required by issue #85, with all necessary components (CollectionCreateScreen, FilmItemList, state management) and supporting design system updates.
Out of Scope Changes check ✅ Passed All code changes support the collection create UI implementation. Design system updates (buttons, toggle, bottom sheet) are necessary supporting changes for the main feature.

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

✨ Finishing touches
  • 📝 Generate docstrings

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

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Actionable comments posted: 1

🤖 Fix all issues with AI agents
In
`@app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt`:
- Around line 189-199: You’re embedding a LazyColumn inside a
vertically-scrollable Column which causes scroll conflicts; since you only
render a single CollectionCreateFilmItemList here, replace the LazyColumn with a
regular Column (or Box) and keep the parent verticalScroll, or alternatively
refactor the whole screen to use a top-level LazyColumn and move
CollectionCreateFilmItemList into an item { } block; update the code around the
LazyColumn and CollectionCreateFilmItemList usage accordingly.
🧹 Nitpick comments (5)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmSection.kt (1)

99-101: Preview 설정 확인 필요

showBackground = false로 설정하면서 backgroundColor를 지정하는 것은 모순될 수 있습니다. showBackground = true로 변경하거나, backgroundColor 파라미터를 제거하는 것을 고려해 주세요.

💡 제안
-@Preview(showBackground = false, backgroundColor = 0xFF121212)
+@Preview(showBackground = true, backgroundColor = 0xFF121212)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt (2)

52-61: 클릭 처리 일관성 검토

프로젝트 내 다른 아이콘 버튼들이 noRippleClickable을 사용하는 경우가 있습니다 (예: FlintBackTopAppbar). 디자인 가이드라인에 따라 ripple 효과 유무를 일관되게 적용하는 것을 권장합니다.

💡 noRippleClickable 사용 시
 Icon(
     imageVector = ImageVector.vectorResource(R.drawable.ic_cancel),
     contentDescription = null,
     tint = Color.Unspecified,
     modifier =
         Modifier
-            .clickable(onClick = onCancelClick)
+            .noRippleClickable(onClick = onCancelClick)
             .padding(12.dp)
             .size(24.dp),
 )

34-41: Modifier 파라미터 추가 고려

재사용성을 높이기 위해 modifier: Modifier = Modifier 파라미터를 추가하는 것을 권장합니다. 이렇게 하면 외부에서 패딩이나 크기 등을 조절할 수 있습니다.

💡 제안
 `@Composable`
 fun CollectionCreateFilmItemList(
     onCancelClick: () -> Unit,
     imageUrl: String,
     title: String,
     director: String,
     createdYear: String,
+    modifier: Modifier = Modifier,
 ) {
app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt (2)

37-48: 주석 처리된 코드 정리 필요

CollectionCreateRoute가 주석 처리되어 있습니다. 추후 사용 예정이라면 TODO 주석으로 명확히 표시하거나, 사용하지 않을 코드라면 삭제하는 것이 좋습니다.


236-247: Preview 함수의 가시성 수정

Preview 함수가 public으로 선언되어 있습니다. 다른 파일의 Preview 함수들과 일관성을 위해 private으로 변경하는 것이 좋습니다.

💡 제안
 `@Preview`
 `@Composable`
-fun CollectionCreateScreenPreview() {
+private fun CollectionCreateScreenPreview() {
     FlintTheme {
📜 Review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 2cba14c and 1f227ef.

📒 Files selected for processing (4)
  • app/src/main/java/com/flint/core/designsystem/component/toggle/FlintBasicToggle.kt
  • app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt
  • app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt
  • app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmSection.kt
🧰 Additional context used
🧠 Learnings (4)
📓 Common learnings
Learnt from: chanmi1125
Repo: imflint/Flint-Android PR: 77
File: app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt:45-72
Timestamp: 2026-01-13T19:02:41.580Z
Learning: In `app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt`, the height difference between CollectionCreateEmptyThumbnail (no aspectRatio) and CollectionCreateFillThumbnail (aspectRatio 1.5f / 1f) is intentional design - the empty state should not have the same aspectRatio as the filled state.
📚 Learning: 2026-01-13T19:02:41.580Z
Learnt from: chanmi1125
Repo: imflint/Flint-Android PR: 77
File: app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt:45-72
Timestamp: 2026-01-13T19:02:41.580Z
Learning: In `app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt`, the height difference between CollectionCreateEmptyThumbnail (no aspectRatio) and CollectionCreateFillThumbnail (aspectRatio 1.5f / 1f) is intentional design - the empty state should not have the same aspectRatio as the filled state.

Applied to files:

  • app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt
  • app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt
  • app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmSection.kt
📚 Learning: 2026-01-13T19:02:56.195Z
Learnt from: chanmi1125
Repo: imflint/Flint-Android PR: 77
File: app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt:45-72
Timestamp: 2026-01-13T19:02:56.195Z
Learning: In `app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt`, the aspect ratio difference between `CollectionCreateEmptyThumbnail` (no aspect ratio) and `CollectionCreateFillThumbnail` (1.5f / 1f) is intentional by design.

Applied to files:

  • app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt
  • app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt
  • app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmSection.kt
📚 Learning: 2026-01-13T20:04:18.300Z
Learnt from: chanmi1125
Repo: imflint/Flint-Android PR: 84
File: app/src/main/java/com/flint/presentation/savedfilm/SavedFilmListItem.kt:177-185
Timestamp: 2026-01-13T20:04:18.300Z
Learning: In the Flint-Android project, the development team has decided that touch target areas for interactive elements like bookmark icons don't need to meet the standard 48.dp minimum recommendation, indicating a project-specific design decision.

Applied to files:

  • app/src/main/java/com/flint/core/designsystem/component/toggle/FlintBasicToggle.kt
🧬 Code graph analysis (2)
app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt (8)
app/src/main/java/com/flint/core/designsystem/component/topappbar/FlintBackTopAppbar.kt (1)
  • FlintBackTopAppbar (16-57)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt (1)
  • CollectionCreateThumbnail (25-43)
app/src/main/java/com/flint/core/designsystem/component/textfield/FlintLongTextField.kt (1)
  • FlintLongTextField (19-47)
app/src/main/java/com/flint/core/designsystem/component/button/FlintIconButton.kt (1)
  • FlintIconButton (20-39)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt (1)
  • CollectionCreateFilmItemList (34-121)
app/src/main/java/com/flint/core/designsystem/component/button/FlintLargeButton.kt (1)
  • FlintLargeButton (15-32)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionAddFilmBottomSheet.kt (1)
  • CollectionAddFilmBottomSheet (11-38)
app/src/main/java/com/flint/core/designsystem/theme/Theme.kt (1)
  • FlintTheme (8-16)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt (4)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmSection.kt (1)
  • CollectionCreateFilmSection (19-47)
app/src/main/java/com/flint/core/designsystem/component/toggle/FlintBasicToggle.kt (1)
  • FlintBasicToggle (20-48)
app/src/main/java/com/flint/core/designsystem/component/textfield/FlintBasicTextField.kt (1)
  • FlintBasicTextField (36-114)
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 Lint Check
  • GitHub Check: PR Build Check
🔇 Additional comments (5)
app/src/main/java/com/flint/core/designsystem/component/toggle/FlintBasicToggle.kt (1)

29-35: LGTM!

Modifier 체인 순서가 적절합니다. noRippleClickable 뒤에 padding을 적용하여 터치 영역이 패딩을 포함하도록 설정되어 있습니다. Thumb 크기 조정도 문제없습니다.

app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmSection.kt (1)

27-29: LGTM!

배경 스타일링을 제거하여 컴포넌트가 더 유연해졌습니다. 부모 컴포넌트에서 배경을 제어할 수 있도록 한 것은 좋은 설계입니다.

app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt (1)

42-43: 로컬 상태 관리에 대한 고려 사항

현재 toggleCheckedreasonText가 컴포넌트 내부에서 관리되고 있습니다. UI-only PR로서 적절하지만, 추후 ViewModel 연동 시 state hoisting이 필요할 수 있습니다. 상태를 상위 컴포넌트로 올려야 할 경우를 대비하여 파라미터로 받는 방식도 고려해 주세요.

app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt (2)

141-159: 공개 여부 선택 상태 관리 누락

"공개"와 "비공개" 버튼 모두 동일한 FlintButtonState.Outline 상태를 사용하고 있어 어떤 옵션이 선택되었는지 시각적으로 구분되지 않습니다. 선택 상태를 추적하는 로직이 필요합니다.


180-184: 하드코딩된 값 확인

"0/10" 카운트가 하드코딩되어 있습니다. UI-only PR임을 감안하더라도, 추후 동적 값으로 대체될 예정인지 확인이 필요합니다.

✏️ Tip: You can disable this entire section by setting review_details to false in your review settings.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🤖 Fix all issues with AI agents
In
`@app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt`:
- Around line 151-179: Add a selection state and update the two FlintIconButton
usages to reflect and toggle that state: create a remember { mutableStateOf(...)
} boolean (e.g., isPublic) in the same composable, pass FlintButtonState.Filled
when isPublic is true for the "공개" button and Outline otherwise, and vice versa
for the "비공개" button; in each button's onClick set isPublic = true or false
accordingly so the UI visually shows which option is selected (use the existing
FlintIconButton and FlintButtonState symbols).
📜 Review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 1f227ef and dd93f5f.

📒 Files selected for processing (1)
  • app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt
🧰 Additional context used
🧠 Learnings (4)
📓 Common learnings
Learnt from: chanmi1125
Repo: imflint/Flint-Android PR: 77
File: app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt:45-72
Timestamp: 2026-01-13T19:02:41.580Z
Learning: In `app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt`, the height difference between CollectionCreateEmptyThumbnail (no aspectRatio) and CollectionCreateFillThumbnail (aspectRatio 1.5f / 1f) is intentional design - the empty state should not have the same aspectRatio as the filled state.
📚 Learning: 2026-01-13T19:02:41.580Z
Learnt from: chanmi1125
Repo: imflint/Flint-Android PR: 77
File: app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt:45-72
Timestamp: 2026-01-13T19:02:41.580Z
Learning: In `app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt`, the height difference between CollectionCreateEmptyThumbnail (no aspectRatio) and CollectionCreateFillThumbnail (aspectRatio 1.5f / 1f) is intentional design - the empty state should not have the same aspectRatio as the filled state.

Applied to files:

  • app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt
📚 Learning: 2026-01-13T19:02:56.195Z
Learnt from: chanmi1125
Repo: imflint/Flint-Android PR: 77
File: app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt:45-72
Timestamp: 2026-01-13T19:02:56.195Z
Learning: In `app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt`, the aspect ratio difference between `CollectionCreateEmptyThumbnail` (no aspect ratio) and `CollectionCreateFillThumbnail` (1.5f / 1f) is intentional by design.

Applied to files:

  • app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt
📚 Learning: 2026-01-13T17:03:16.816Z
Learnt from: giovannijunseokim
Repo: imflint/Flint-Android PR: 72
File: app/src/main/java/com/flint/core/designsystem/component/collection/PeopleBottomSheet.kt:85-98
Timestamp: 2026-01-13T17:03:16.816Z
Learning: In PeopleBottomSheet.kt, the `people` list passed to LazyColumn is static and does not change while the bottom sheet is visible, so a key parameter is not required for the items() call.

Applied to files:

  • app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt
⏰ 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 Lint Check
  • GitHub Check: PR Build Check
🔇 Additional comments (3)
app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt (3)

51-58: LGTM!

UI 모델이 필요한 필드들로 잘 구성되어 있고, filmId가 LazyColumn의 key로 적절히 활용됩니다.


98-242: LazyColumn 구조가 적절하게 구성되어 있습니다.

이전 리뷰에서 지적된 verticalScroll Column 내부의 LazyColumn 문제가 해결되었습니다. 현재 구조는 LazyColumn을 최상위 스크롤 컨테이너로 사용하고 각 섹션을 item { } 블록으로 구성하여 올바르게 동작합니다. items()에서 key를 사용한 것도 적절합니다.


263-274: LGTM!

Preview가 FlintTheme으로 올바르게 감싸져 있습니다.

✏️ Tip: You can disable this entire section by setting review_details to false in your review settings.

@coderabbitai

coderabbitai Bot commented Jan 14, 2026

Copy link
Copy Markdown
Contributor

Note

Docstrings generation - SUCCESS
Generated docstrings for this pull request at #105

coderabbitai Bot added a commit that referenced this pull request Jan 14, 2026
Docstrings generation was requested by @nahy-512.

* #102 (comment)

The following files were modified:

* `app/src/main/java/com/flint/core/designsystem/component/toggle/FlintBasicToggle.kt`
* `app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt`
* `app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt`
* `app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmSection.kt`

@nahy-512 nahy-512 left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

고생하셨습니다. 화면과 조금 다른 부분들이 있어서 작업 수정 부탁드려요~!
TextField는 제가 수정할게요

Comment on lines +104 to +119
// 썸네일
item {
CollectionCreateThumbnail(
imageUrl = thumbnailImageUrl,
onClick = { isSheetVisible = true },
)
}

// 컬렉션 제목
item {
Column {
Text(
text = "컬렉션 제목",
color = FlintTheme.colors.white,
style = FlintTheme.typography.head3M18,
)

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p1
이거 썸네일이랑 제목 패딩 36.dp이던데 확인 부탁드릴게요

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

적용했습니다!

LazyColumn(
modifier = Modifier.weight(1f),
contentPadding = PaddingValues(horizontal = 16.dp, vertical = 36.dp),
verticalArrangement = Arrangement.spacedBy(16.dp),

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p1
이거 28.dp 되어야할 것 같아요

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

적용했습니다! 감사합니다~~

item {
Column {
Text(
text = "컬렉션 소개 (선택)",

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p1
선택 텍스트 색상 다르게 해줘야해용

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

적용했습니당!!

placeholder = "컬렉션의 소개를 작성해주세요.",
onValueChanged = { contentText = it },
maxLength = 200,
height = 104.dp,

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p1
이거 입력할 때마다 TextField 높이가 계속 늘어나야할 것 같은데,, 제가 BasicTextField 한번에 고칠게요

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

넵!!

)
Text(
text = "${filmList.size}/10",
color = FlintTheme.colors.gray200,

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p1
이거 white 색상인 것 같아요

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

적용했습니다아!!

Comment on lines +106 to +109
CollectionCreateThumbnail(
imageUrl = thumbnailImageUrl,
onClick = { isSheetVisible = true },
)

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p1
썸네일은 패딩 밖으로 빠져야할듯!

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

넵!!

Comment on lines +255 to +261
if (isSheetVisible) {
CollectionAddFilmBottomSheet(
onGalleryClick = onGalleryClick,
onCoverDeleteClick = onCoverDeleteClick,
onDismiss = { isSheetVisible = false },
)
}

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p1
이거 바텀시트 사라질 때 자연스럽게 사라지는 게 아니라 뚝 끊기는 현상이 있는 것 같은데, 종우가 구현해준 FlintBasicBottomSheet 프리뷰 바탕으로 수정해보고, 내일 종우한테 한번 물어보고 수정해보면 좋을 것 같아요

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p1
BottomSheet modifier로 padding bottom 넣어 줘야 할것같은데 확인 부탁드려요

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

넹!

@nahy-512 nahy-512 left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

잘못 눌렀다ㅎㅎ RC 드립니다 ..

@kimjw2003 kimjw2003 left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

이것만 고쳐주세효요

Comment on lines +255 to +261
if (isSheetVisible) {
CollectionAddFilmBottomSheet(
onGalleryClick = onGalleryClick,
onCoverDeleteClick = onCoverDeleteClick,
onDismiss = { isSheetVisible = false },
)
}

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p1
BottomSheet modifier로 padding bottom 넣어 줘야 할것같은데 확인 부탁드려요

- 컬렉션 생성 화면에서 작품 삭제 시 확인 모달을 표시하도록 로직을 추가했습니다.
- 컬렉션 공개/비공개 버튼의 상태가 선택에 따라 동적으로 변경되도록 수정했습니다. (`ColorOutline` / `Disable`)
- 화면 전체에 `LazyColumn`을 적용하고, 아이템 간 간격 및 패딩을 조정했습니다.
- `컬렉션 소개` 라벨에 "(선택)"을 `gray300` 색상의 `SpanStyle`로 적용했습니다.
- 작품 개수 표시 텍스트의 색상을 `white`로 변경했습니다.
- `FlintBasicButton` 및 이를 사용하는 버튼 컴포저블에 `enabled` 파라미터를 추가했습니다.

@giovannijunseokim giovannijunseokim left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

LGTM 👍

리뷰 확인 부탁드려요! 🙇

Icon(
imageVector = ImageVector.vectorResource(R.drawable.ic_cancel),
contentDescription = null,
tint = Color.Unspecified,

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p3: 개인적으로는 vector 리소스가 다양한 색을 갖고 있지 않다면 여기서 명시해주는 것도 괜찮은 것 같아요!

이렇게 될 경우 Preview를 보거나 해당 vector 리소스를 확인해야 어떤 색인지 알 수 있으니까요. 🤔

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

넵! 반영하겠습니다아

Spacer(Modifier.height(4.dp))

FlintBasicTextField(
placeholder = "이 작품의 매력 포인트 적어주세요.",

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p1: 를

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

🫨

Comment on lines +51 to +57
data class CollectionFilmUiModel(
val filmId: Long,
val imageUrl: String,
val title: String,
val director: String,
val createdYear: String,
)

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p3: UiModel이 뭔지 설명해주실 수 있나요?

Comment on lines +71 to +89
val filmList =
remember {
mutableStateListOf(
CollectionFilmUiModel(
filmId = 1L,
imageUrl = "https://buly.kr/DEaVFRZ",
title = "해리포터 불의 잔",
director = "마이크 뉴웰",
createdYear = "2005",
),
CollectionFilmUiModel(
filmId = 2L,
imageUrl = "https://buly.kr/DEaVFRZ",
title = "인터스텔라",
director = "크리스토퍼 놀란",
createdYear = "2014",
),
)
}

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p3: 테스트용 데이터는 외부로 빼주면 UI를 파악하기 좋을 것 같습니다.

또한 교체할 수 없다는 점이 있으니 파라미터로 받아야 할 것 같아요. 👀

Column(
modifier =
Modifier
.fillMaxWidth()

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p2: Screen의 최상위 레이아웃이니 fillMaxWidth()보단 fillMaxSize()가 어울리지 않을까요?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

옹!! 반영하겟습니다아

// 작품 리스트
items(
items = filmList,
key = { it.filmId },

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p3: key는 어떤 역할을 하나요? 👀

Comment on lines +215 to +225
Column {
CollectionCreateFilmItemList(
onCancelClick = {
filmList.removeAll { it.filmId == film.filmId }
},
imageUrl = film.imageUrl,
title = film.title,
director = film.director,
createdYear = film.createdYear,
)
}

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p3: Column으로 감싸야 할까요?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

원래 패딩을 주기 위해 Column을 사용했는데, 마지막에 실수로 그 부분을 다 제거해서 혼란을 드렸네요. 죄송합니다!! 반영했습니다아

Comment on lines +228 to +241
// 작품 추가 버튼
item {
Column {
FlintIconButton(
text = "작품 추가하기",
iconRes = R.drawable.ic_plus,
state = FlintButtonState.ColorOutline,
onClick = {},
modifier =
Modifier
.fillMaxWidth()
.defaultMinSize(minHeight = 80.dp),
)
}

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p3: Column으로 감싸야 할까요? 2

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

2222

- CollectionCreateScreen, CollectionAddFilmBottomSheet, MenuBottomSheet 컴포저블의 코드 스타일을 일관성 있게 수정했습니다.
- 불필요한 공백을 제거하고 trailing comma를 추가했습니다.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Actionable comments posted: 1

🤖 Fix all issues with AI agents
In
`@app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt`:
- Around line 64-71: The CollectionCreateScreen composable currently accepts an
onConfirm callback but never invokes it; update the "완료" button's onClick
handler (the button defined near the bottom of CollectionCreateScreen) to call
onConfirm when the button is enabled (i.e., instead of or in addition to the
current noop), and ensure any enabled-checking logic (e.g.,
isFormValid/isConfirmEnabled state used to set enabled = ...) remains intact so
onConfirm is only invoked when the button is enabled.
♻️ Duplicate comments (1)
app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt (1)

42-54: paddingValuesnavigateToAddFilm 파라미터가 여전히 사용되지 않고 있습니다.

이전 리뷰에서 언급된 바와 같이, 해당 파라미터들은 아직 연결되지 않았습니다. 추후 구현 시 적용 부탁드립니다.

🧹 Nitpick comments (3)
app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt (1)

184-219: 버튼 상태 로직을 when 표현식으로 간소화하면 가독성이 향상됩니다.

현재 if-else if-else 체인이 여러 줄에 걸쳐 있어 읽기 어렵습니다. Kotlin의 when 표현식을 사용하면 더 간결하게 표현할 수 있습니다.

♻️ 리팩토링 제안
                     FlintIconButton(
                         text = "공개",
                         iconRes = R.drawable.ic_share,
-                        state =
-                            if (isPublic ==
-                                true
-                            ) {
-                                FlintButtonState.ColorOutline
-                            } else if (isPublic ==
-                                false
-                            ) {
-                                FlintButtonState.Disable
-                            } else {
-                                FlintButtonState.Outline
-                            },
+                        state = when (isPublic) {
+                            true -> FlintButtonState.ColorOutline
+                            false -> FlintButtonState.Disable
+                            null -> FlintButtonState.Outline
+                        },
                         onClick = { isPublic = true },
                         modifier = Modifier.weight(1f),
                     )

                     Spacer(Modifier.width(8.dp))

                     FlintIconButton(
                         text = "비공개",
                         iconRes = R.drawable.ic_lock,
-                        state =
-                            if (isPublic ==
-                                false
-                            ) {
-                                FlintButtonState.ColorOutline
-                            } else if (isPublic ==
-                                true
-                            ) {
-                                FlintButtonState.Disable
-                            } else {
-                                FlintButtonState.Outline
-                            },
+                        state = when (isPublic) {
+                            false -> FlintButtonState.ColorOutline
+                            true -> FlintButtonState.Disable
+                            null -> FlintButtonState.Outline
+                        },
                         onClick = { isPublic = false },
                         modifier = Modifier.weight(1f),
                     )
app/src/main/java/com/flint/core/designsystem/component/button/FlintBasicButton.kt (2)

87-88: 타이포그래피 스타일 조건이 중복되어 있습니다.

Lines 87과 94에서 동일한 조건식 if (enabled) 로 타이포그래피를 선택하고 있습니다. 현재는 간단하지만, 향후 스타일 로직이 복잡해질 경우 상수나 변수로 추출하면 유지보수가 용이합니다.

♻️ 선택적 리팩토링 제안
 fun FlintBasicButton(
     ...
 ) {
     val background: Brush = state.background
     val contentColor: Color = state.contentColor
     val border: BorderStroke? = state.border
     val shape = RoundedCornerShape(8.dp)
+    val textStyle = if (enabled) FlintTheme.typography.body1Sb16 else FlintTheme.typography.body1M16
 
     Row(
         ...
     ) {
         if (leadingIconRes != null) {
             ...
             Box(...) {
                 Text(
                     text = text,
                     color = contentColor,
-                    style = if (enabled) FlintTheme.typography.body1Sb16 else FlintTheme.typography.body1M16,
+                    style = textStyle,
                 )
             }
         } else {
             Text(
                 text = text,
                 color = contentColor,
-                style = if (enabled) FlintTheme.typography.body1Sb16 else FlintTheme.typography.body1M16,
+                style = textStyle,
             )
         }
     }
 }

40-40: FlintButtonStateenabled 속성과 별도의 enabled 파라미터 중복 제거 필요

FlintButtonState enum은 이미 각 상태별 enabled 속성을 정의하고 있습니다(Able(enabled=true), Disable(enabled=false), Outline(enabled=true), ColorOutline(enabled=true)). 그러나 FlintBasicButton의 별도 enabled: Boolean = true 파라미터가 이를 무시하고 있어 불필요한 중복과 불일치 위험이 발생합니다.

현재 state.enabled은 사용되지 않으며, clickable 수정자와 타이포그래피 스타일 선택이 분리된 enabled 파라미터로만 제어됩니다. 이로 인해:

  • state = FlintButtonState.Disable이지만 enabled = true(기본값)인 경우, 버튼이 비활성 모양이면서 클릭 가능
  • state = FlintButtonState.Able이지만 enabled = false로 설정된 경우, 활성화된 모양이면서 클릭 불가

state.enabled을 사용하여 단일 진실 공급원으로 통합하거나, 둘의 동기화를 강제하는 구조로 개선하기를 권장합니다.

📜 Review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between bf577fe and c33f4b7.

📒 Files selected for processing (7)
  • app/src/main/java/com/flint/core/designsystem/component/bottomsheet/MenuBottomSheet.kt
  • app/src/main/java/com/flint/core/designsystem/component/button/FlintBasicButton.kt
  • app/src/main/java/com/flint/core/designsystem/component/button/FlintIconButton.kt
  • app/src/main/java/com/flint/core/designsystem/component/button/FlintLargeButton.kt
  • app/src/main/java/com/flint/core/designsystem/component/button/FlintMediumButton.kt
  • app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt
  • app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionAddFilmBottomSheet.kt
🧰 Additional context used
🧠 Learnings (4)
📓 Common learnings
Learnt from: chanmi1125
Repo: imflint/Flint-Android PR: 77
File: app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt:45-72
Timestamp: 2026-01-13T19:02:41.580Z
Learning: In `app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt`, the height difference between CollectionCreateEmptyThumbnail (no aspectRatio) and CollectionCreateFillThumbnail (aspectRatio 1.5f / 1f) is intentional design - the empty state should not have the same aspectRatio as the filled state.
📚 Learning: 2026-01-13T17:03:16.816Z
Learnt from: giovannijunseokim
Repo: imflint/Flint-Android PR: 72
File: app/src/main/java/com/flint/core/designsystem/component/collection/PeopleBottomSheet.kt:85-98
Timestamp: 2026-01-13T17:03:16.816Z
Learning: In PeopleBottomSheet.kt, the `people` list passed to LazyColumn is static and does not change while the bottom sheet is visible, so a key parameter is not required for the items() call.

Applied to files:

  • app/src/main/java/com/flint/core/designsystem/component/bottomsheet/MenuBottomSheet.kt
  • app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt
  • app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionAddFilmBottomSheet.kt
📚 Learning: 2026-01-13T19:02:41.580Z
Learnt from: chanmi1125
Repo: imflint/Flint-Android PR: 77
File: app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt:45-72
Timestamp: 2026-01-13T19:02:41.580Z
Learning: In `app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt`, the height difference between CollectionCreateEmptyThumbnail (no aspectRatio) and CollectionCreateFillThumbnail (aspectRatio 1.5f / 1f) is intentional design - the empty state should not have the same aspectRatio as the filled state.

Applied to files:

  • app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt
📚 Learning: 2026-01-13T19:02:56.195Z
Learnt from: chanmi1125
Repo: imflint/Flint-Android PR: 77
File: app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt:45-72
Timestamp: 2026-01-13T19:02:56.195Z
Learning: In `app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt`, the aspect ratio difference between `CollectionCreateEmptyThumbnail` (no aspect ratio) and `CollectionCreateFillThumbnail` (1.5f / 1f) is intentional by design.

Applied to files:

  • app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt
🧬 Code graph analysis (3)
app/src/main/java/com/flint/core/designsystem/component/button/FlintMediumButton.kt (1)
app/src/main/java/com/flint/core/designsystem/component/button/FlintBasicButton.kt (1)
  • FlintBasicButton (34-98)
app/src/main/java/com/flint/core/designsystem/component/button/FlintIconButton.kt (1)
app/src/main/java/com/flint/core/designsystem/component/button/FlintBasicButton.kt (1)
  • FlintBasicButton (34-98)
app/src/main/java/com/flint/core/designsystem/component/button/FlintLargeButton.kt (1)
app/src/main/java/com/flint/core/designsystem/component/button/FlintBasicButton.kt (1)
  • FlintBasicButton (34-98)
⏰ 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 Lint Check
  • GitHub Check: PR Build Check
🔇 Additional comments (10)
app/src/main/java/com/flint/core/designsystem/component/bottomsheet/MenuBottomSheet.kt (1)

44-48: LGTM!

LazyColumn에 하단 패딩을 추가하여 바텀시트 콘텐츠에 적절한 여백을 제공합니다. 레이아웃 개선이 잘 적용되었습니다.

app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionAddFilmBottomSheet.kt (1)

14-19: LGTM!

modifier 파라미터를 추가하여 외부에서 바텀시트 레이아웃을 커스터마이징할 수 있도록 한 것은 좋은 패턴입니다. 기본값 Modifier를 제공하여 기존 호출 코드와의 호환성도 유지됩니다.

app/src/main/java/com/flint/core/designsystem/component/button/FlintLargeButton.kt (1)

16-27: LGTM! enabled 파라미터가 일관되게 FlintBasicButton으로 전달되어, 다른 버튼 래퍼들(FlintIconButton, FlintMediumButton)과 동일한 패턴을 따르고 있습니다.

enabledFlintButtonState는 서로 다른 목적을 담당하므로 별도로 설정되어야 한다는 우려는 불필요합니다. state는 배경/테두리 등 시각적 스타일링을 담당하고, enabled는 클릭 비활성화 및 타이포그래피 변경을 담당하는 독립적인 파라미터입니다.

app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt (5)

56-62: LGTM!

UI 모델 구조가 적절합니다. 필요한 필드들이 잘 정의되어 있습니다.


274-278: "작품 추가하기" 버튼의 클릭 핸들러가 비어있습니다.

이 버튼은 CollectionCreateRoute에서 전달받는 navigateToAddFilm 콜백과 연결되어야 할 것으로 보입니다. 해당 기능 구현 시 연결 부탁드립니다.


99-109: LazyColumn 구조가 잘 개선되었습니다.

이전 리뷰에서 지적된 verticalScroll Column 내부 LazyColumn 문제가 해결되었습니다. LazyColumnweight(1f)를 적용하여 하단 버튼을 고정하면서 스크롤 영역을 확보한 구조가 적절합니다.


308-322: 삭제 확인 모달 로직이 잘 구현되어 있습니다.

selectedFilm 상태를 활용한 삭제 로직과 모달 dismiss 처리가 적절합니다. onConfirmonDismiss 모두에서 상태를 정리하는 점이 좋습니다.


325-337: LGTM!

Preview 함수가 FlintTheme으로 적절히 래핑되어 있습니다.

app/src/main/java/com/flint/core/designsystem/component/button/FlintIconButton.kt (1)

27-33: LGTM!

enabled 파라미터가 FlintBasicButton에 올바르게 전달되고 있으며, 기본값 true로 기존 호출부와의 호환성이 유지됩니다.

app/src/main/java/com/flint/core/designsystem/component/button/FlintMediumButton.kt (1)

24-30: LGTM!

FlintIconButton과 동일한 패턴으로 enabled 파라미터를 전달하고 있습니다. 버튼 컴포넌트 간 일관된 API가 유지되어 좋습니다.

✏️ Tip: You can disable this entire section by setting review_details to false in your review settings.

Comment on lines +64 to +71
@Composable
fun CollectionCreateScreen(
thumbnailImageUrl: String,
onBackClick: () -> Unit,
onGalleryClick: () -> Unit,
onCoverDeleteClick: () -> Unit,
onConfirm: () -> Unit,
) {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

⚠️ Potential issue | 🟡 Minor

onConfirm 콜백이 사용되지 않고 있습니다.

onConfirm 파라미터가 전달되었지만 "완료" 버튼(line 289-297)의 onClick에 연결되어 있지 않습니다. 버튼이 활성화될 때 해당 콜백을 호출하도록 수정이 필요합니다.

🐛 수정 제안
         FlintLargeButton(
             text = "완료",
-            state = FlintButtonState.Disable,
-            onClick = {},
+            state = if (titleText.isNotBlank() && isPublic != null) FlintButtonState.Filled else FlintButtonState.Disable,
+            onClick = onConfirm,
             modifier =
                 Modifier
                     .fillMaxWidth()
                     .padding(horizontal = 16.dp, vertical = 8.dp),
         )
🤖 Prompt for AI Agents
In
`@app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt`
around lines 64 - 71, The CollectionCreateScreen composable currently accepts an
onConfirm callback but never invokes it; update the "완료" button's onClick
handler (the button defined near the bottom of CollectionCreateScreen) to call
onConfirm when the button is enabled (i.e., instead of or in addition to the
current noop), and ensure any enabled-checking logic (e.g.,
isFormValid/isConfirmEnabled state used to set enabled = ...) remains intact so
onConfirm is only invoked when the button is enabled.

@nahy-512 nahy-512 added the Feat ✨ 신규 기능을 추가하거나 기존 기능의 동작, 정책을 변경 label Jan 16, 2026
- `CollectionCreateScreen` 내에 있던 `CollectionFilmUiModel`을 별도의 파일로 분리했습니다.
- filmList의 상태를 `ImmutableList`로 관리하고, 삭제 로직을 상위 컴포저블로 이동하여 상태 관리 방식을 개선했습니다.
- `CollectionCreateFilmItemList`의 취소 아이콘 색상을 `Color.White`로 수정하고, 플레이스홀더 텍스트를 "이 작품의 매력 포인트를 적어주세요."로 변경했습니다.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Actionable comments posted: 1

🤖 Fix all issues with AI agents
In
`@app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt`:
- Around line 42-43: The local states toggleChecked and reasonText inside the
CollectionCreateFilmItemList composable should be hoisted: remove the internal
remember { mutableStateOf(...) } declarations and add parameters like
toggleChecked: Boolean, reasonText: String, onToggleChecked: (Boolean) -> Unit,
and onReasonTextChange: (String) -> Unit to the CollectionCreateFilmItemList
signature; update all usages to read from the passed-in toggleChecked and
reasonText and call onToggleChecked / onReasonTextChange where the UI previously
mutated the local state so the parent can manage and collect the spoiler flag
and reason text.
🧹 Nitpick comments (3)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt (3)

56-60: 터치 영역 확장을 위해 Modifier 순서 변경을 고려해주세요.

현재 .clickable.padding 앞에 있어서 터치 가능한 영역이 24dp 아이콘 크기로 제한됩니다. 순서를 변경하면 패딩 영역까지 포함한 48dp 터치 영역을 확보할 수 있습니다.

♻️ Modifier 순서 변경 제안
                 modifier =
                     Modifier
-                        .clickable(onClick = onCancelClick)
                         .padding(12.dp)
-                        .size(24.dp),
+                        .size(24.dp)
+                        .clickable(onClick = onCancelClick),

52-55: 접근성 개선: contentDescription 추가를 고려해주세요.

취소 아이콘에 contentDescription이 null로 설정되어 있어 스크린 리더 사용자가 이 버튼의 기능을 알 수 없습니다.

♻️ contentDescription 추가 제안
             Icon(
                 imageVector = ImageVector.vectorResource(R.drawable.ic_cancel),
-                contentDescription = null,
+                contentDescription = "영화 삭제",
                 tint = Color.White,

34-41: 컴포넌트 이름이 혼동을 줄 수 있습니다.

CollectionCreateFilmItemList라는 이름은 여러 아이템의 리스트를 암시하지만, 실제로는 단일 필름 아이템을 표현하는 컴포넌트입니다. CollectionCreateFilmItem으로 변경하는 것을 고려해주세요.

📜 Review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between c33f4b7 and af171ad.

📒 Files selected for processing (3)
  • app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt
  • app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt
  • app/src/main/java/com/flint/presentation/collectioncreate/model/CollectionFilmUiModel.kt
🚧 Files skipped from review as they are similar to previous changes (1)
  • app/src/main/java/com/flint/presentation/collectioncreate/CollectionCreateScreen.kt
🧰 Additional context used
🧠 Learnings (3)
📓 Common learnings
Learnt from: chanmi1125
Repo: imflint/Flint-Android PR: 77
File: app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt:45-72
Timestamp: 2026-01-13T19:02:41.580Z
Learning: In `app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt`, the height difference between CollectionCreateEmptyThumbnail (no aspectRatio) and CollectionCreateFillThumbnail (aspectRatio 1.5f / 1f) is intentional design - the empty state should not have the same aspectRatio as the filled state.
📚 Learning: 2026-01-13T19:02:41.580Z
Learnt from: chanmi1125
Repo: imflint/Flint-Android PR: 77
File: app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt:45-72
Timestamp: 2026-01-13T19:02:41.580Z
Learning: In `app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt`, the height difference between CollectionCreateEmptyThumbnail (no aspectRatio) and CollectionCreateFillThumbnail (aspectRatio 1.5f / 1f) is intentional design - the empty state should not have the same aspectRatio as the filled state.

Applied to files:

  • app/src/main/java/com/flint/presentation/collectioncreate/model/CollectionFilmUiModel.kt
  • app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt
📚 Learning: 2026-01-13T19:02:56.195Z
Learnt from: chanmi1125
Repo: imflint/Flint-Android PR: 77
File: app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt:45-72
Timestamp: 2026-01-13T19:02:56.195Z
Learning: In `app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateThumbnail.kt`, the aspect ratio difference between `CollectionCreateEmptyThumbnail` (no aspect ratio) and `CollectionCreateFillThumbnail` (1.5f / 1f) is intentional by design.

Applied to files:

  • app/src/main/java/com/flint/presentation/collectioncreate/model/CollectionFilmUiModel.kt
  • app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt
🧬 Code graph analysis (1)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt (4)
app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmSection.kt (1)
  • CollectionCreateFilmSection (19-47)
app/src/main/java/com/flint/core/designsystem/component/toggle/FlintBasicToggle.kt (1)
  • FlintBasicToggle (20-48)
app/src/main/java/com/flint/core/designsystem/component/textfield/FlintBasicTextField.kt (1)
  • FlintBasicTextField (36-114)
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/model/CollectionFilmUiModel.kt (1)

5-31: LGTM!

데이터 클래스 구조가 깔끔하고, persistentListOf를 사용하여 Compose에서 효율적인 리컴포지션을 지원하는 불변 리스트로 관리하는 점이 좋습니다.

✏️ Tip: You can disable this entire section by setting review_details to false in your review settings.

Comment on lines +42 to +43
var toggleChecked by remember { mutableStateOf(false) }
var reasonText by remember { mutableStateOf("") }

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

🛠️ Refactor suggestion | 🟠 Major

상태 호이스팅이 필요합니다.

toggleCheckedreasonText가 컴포넌트 내부에서 로컬 상태로 관리되고 있어, 부모 컴포저블에서 이 값들에 접근할 수 없습니다. 폼 제출 시 스포일러 여부와 선택 이유 텍스트를 수집할 수 없게 됩니다.

상태와 콜백을 파라미터로 받아 상위 컴포저블에서 관리하도록 변경하는 것을 권장합니다.

♻️ 상태 호이스팅 제안
 `@Composable`
 fun CollectionCreateFilmItemList(
     onCancelClick: () -> Unit,
     imageUrl: String,
     title: String,
     director: String,
     createdYear: String,
+    toggleChecked: Boolean,
+    onToggleCheckedChange: (Boolean) -> Unit,
+    reasonText: String,
+    onReasonTextChange: (String) -> Unit,
 ) {
-    var toggleChecked by remember { mutableStateOf(false) }
-    var reasonText by remember { mutableStateOf("") }
🤖 Prompt for AI Agents
In
`@app/src/main/java/com/flint/presentation/collectioncreate/component/CollectionCreateFilmItemList.kt`
around lines 42 - 43, The local states toggleChecked and reasonText inside the
CollectionCreateFilmItemList composable should be hoisted: remove the internal
remember { mutableStateOf(...) } declarations and add parameters like
toggleChecked: Boolean, reasonText: String, onToggleChecked: (Boolean) -> Unit,
and onReasonTextChange: (String) -> Unit to the CollectionCreateFilmItemList
signature; update all usages to read from the passed-in toggleChecked and
reasonText and call onToggleChecked / onReasonTextChange where the UI previously
mutated the local state so the parent can manage and collect the spoiler flag
and reason text.

Comment on lines +75 to +80
var titleText by remember { mutableStateOf("") }
var contentText by remember { mutableStateOf("") }
var isSheetVisible by remember { mutableStateOf(false) }
var isModalVisible by remember { mutableStateOf(false) }
var selectedFilm by remember { mutableStateOf<CollectionFilmUiModel?>(null) }
var isPublic by remember { mutableStateOf<Boolean?>(null) }

@nahy-512 nahy-512 Jan 16, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

p1
나중에는 결국 이런 UI 상태를 ViewModel에서 들고있어야 해요.
isSheetVisible, isModelVisible는 관리 책임이 UI에 있다고 볼 수 있어서 정의가 이곳에 되어도 상관없지만,titleText, contentText 같은 값은 어차피 뷰모델이 생기면서 상태 관리 방식이 달라져야 해요.

그래서 지금 단계에서는 '버튼 클릭 이벤트', '화면 상태 변경'을 고려하지 말고, '보여주기', '뷰 조립'만 해도 된다고 말했었던 거예요.
작업을 중간중간 확인했더라면 좋았을 것 같은데, 제가 설명이 부족했나 봅니다.

이거 이따가 같이 얘기해봐요

@nahy-512 nahy-512 left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

일단 머지하고 뷰모델 같이 작성해봅시당~! 작업 고생했우

@nahy-512 nahy-512 merged commit 22be34d into develop Jan 16, 2026
3 checks passed
@nahy-512 nahy-512 deleted the Feat/#85-Collection-Create-Empty-UI branch January 16, 2026 11:42
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Feat ✨ 신규 기능을 추가하거나 기존 기능의 동작, 정책을 변경 📱 UI feat - 컴포넌트 조립, 화면 구현

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Feat] collection create ui 제작

4 participants