Skip to content

[FEAT/#40] 시술 리스트 타이틀 섹션 구현#43

Merged
usuuhyn merged 5 commits intodevelopfrom
feat/#40-caution-component
Jan 13, 2026
Merged

[FEAT/#40] 시술 리스트 타이틀 섹션 구현#43
usuuhyn merged 5 commits intodevelopfrom
feat/#40-caution-component

Conversation

@usuuhyn
Copy link
Copy Markdown
Contributor

@usuuhyn usuuhyn commented Jan 12, 2026

Related issue 🛠

Work Description ✏️

  • 시술 필터링 뷰의 타이틀 섹션을 구현했습니다.

Screenshot 📸

Uncompleted Tasks 😅

N/A

To Reviewers 📢

시술 리스트 타이틀 섹션을 구현햇슴둥 !

Summary by CodeRabbit

  • 새로운 기능
    • 캘린더의 시술 정보 화면에 중요한 주의사항을 명확히 보여주는 새 UI 컴포넌트 추가
    • 시술명을 강조하는 섹션 헤더에 상하 구분선과 회색 배경, 가독성 높은 타이포그래피 적용으로 시각적 구분 강화
    • 섹션 하단에 주의 문구를 함께 표시해 사용자가 핵심 안내를 빠르게 인지하도록 개선

✏️ Tip: 리뷰 설정에서 이 요약을 맞춤화할 수 있습니다.

@usuuhyn usuuhyn self-assigned this Jan 12, 2026
@usuuhyn usuuhyn added the FEAT✨ 새로운 기능 구현 label Jan 12, 2026
@usuuhyn usuuhyn requested a review from a team as a code owner January 12, 2026 17:43
@usuuhyn usuuhyn added the 수현🍒 수현 담당 label Jan 12, 2026
@usuuhyn usuuhyn linked an issue Jan 12, 2026 that may be closed by this pull request
@coderabbitai
Copy link
Copy Markdown

coderabbitai Bot commented Jan 12, 2026

Walkthrough

두 개의 Jetpack Compose UI 컴포저블을 추가했습니다: 경고 문구를 표시하는 CautionDescription과 제목·구분선·경고를 포함하는 ProcedureTitleSection.

Changes

Cohort / File(s) 변경 요약
경고 컴포넌트
app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt
신규 컴포저블 CautionDescription(modifier: Modifier = Modifier) 추가. 선행 글자 "◎"와 한글 경고 텍스트를 수평 배치로 렌더링, body3R12 타이포·gray600 색상 적용. 프리뷰 포함.
섹션 타이틀 컴포넌트
app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/ProcedureTitleSection.kt
신규 컴포저블 ProcedureTitleSection(procedureName: String, modifier: Modifier = Modifier) 추가. 상단/하단 구분선, 배경 및 패딩 처리, 제목 텍스트(절차명 기반)와 소량 여백, 내부에 CautionDescription 호출. 프리뷰 포함.

Sequence Diagram(s)

(생성 조건 미충족 — 생략)

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

Possibly related issues

Suggested reviewers

  • hyeminililo
  • sohee6989
🚥 Pre-merge checks | ✅ 4 | ❌ 1
❌ Failed checks (1 warning)
Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Title check ✅ Passed PR 제목이 핵심 변경사항인 시술 리스트 타이틀 섹션 구현을 명확하게 설명하고 있습니다.
Description check ✅ Passed PR 설명이 템플릿 구조를 따르고 있으며, 관련 이슈, 작업 내용, 스크린샷, 검토자 메모를 포함하고 있습니다.
Linked Issues check ✅ Passed CautionDescription과 ProcedureTitleSection 컴포넌트 구현을 통해 #40에서 요청한 경고 문구 컴포넌트와 타이틀 섹션 요구사항을 충족합니다.
Out of Scope Changes check ✅ Passed 모든 변경사항이 #40의 타이틀 섹션과 경고 문구 컴포넌트 구현이라는 범위 내에 있습니다.

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

✨ Finishing touches
  • 📝 Generate docstrings

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

❤️ Share

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

@usuuhyn usuuhyn changed the title [FEAT/#40] 시술 타이틀 섹션 구현 [FEAT/#40] 시술 리스트 타이틀 섹션 구현 Jan 12, 2026
Copy link
Copy Markdown

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🤖 Fix all issues with AI agents
In
@app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt:
- Around line 22-37: The child composables in CautionDescription.kt (the two
Texts and the Spacer) should not receive the incoming modifier; remove the
passed-in modifier from those child Text/Text and Spacer calls and instead apply
the incoming modifier only to the root container of the CautionDescription
composable (e.g., the Row/Column that wraps these children). For the Spacer use
Modifier.size(4.dp) directly and for the child Texts use Modifier (or no
modifier) for local tweaks, ensuring the caller-provided modifier (e.g.,
fillMaxWidth/padding) is applied solely to the root composable.

In
@app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/ProcedureTitleSection.kt:
- Around line 17-50: The passed-in modifier is only applied to the inner Column,
so callers' modifiers (padding, fillMaxWidth, etc.) don't affect the whole
section; update ProcedureTitleSection to use a single root Column (wrapping both
HorizontalDivider, Text, Spacer, CautionDescription, and the bottom
HorizontalDivider) and apply the incoming modifier to that root Column instead
of the inner one, then move the two HorizontalDivider calls inside that Column
(removing their own separate modifier usages or merging necessary modifiers) so
the caller-provided modifier consistently affects the entire component.
📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between e2f8fcf and 04746f0.

📒 Files selected for processing (2)
  • app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt
  • app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/ProcedureTitleSection.kt
🧰 Additional context used
📓 Path-based instructions (1)
**/*.kt

⚙️ CodeRabbit configuration file

**/*.kt: - Jetpack Compose 구조, 상태 관리, recomposition 최적화에 집중

  • ViewModel, UiState, 단방향 데이터 흐름 패턴 검토
  • 불필요한 recomposition 가능성, remember/derivedStateOf 적절한 사용 확인
  • 네이밍 컨벤션, 가독성, Google 권장 Android 아키텍처 준수 여부

Files:

  • app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt
  • app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/ProcedureTitleSection.kt
🧬 Code graph analysis (2)
app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt (1)
app/src/main/java/com/cherrish/android/core/designsystem/theme/Theme.kt (1)
  • CherrishTheme (38-61)
app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/ProcedureTitleSection.kt (2)
app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt (1)
  • CautionDescription (14-39)
app/src/main/java/com/cherrish/android/core/designsystem/theme/Theme.kt (1)
  • CherrishTheme (38-61)
⏰ 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 (2)
app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt (1)

41-47: LGTM!

Preview 함수가 CherrishTheme으로 올바르게 감싸져 있어 디자인 시스템 테마가 적용됩니다.

app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/ProcedureTitleSection.kt (1)

52-60: LGTM!

Preview 함수가 CherrishTheme으로 올바르게 감싸져 있고, 샘플 데이터로 적절히 테스트하고 있습니다.

Copy link
Copy Markdown

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 0

🧹 Nitpick comments (2)
app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt (2)

18-36: Row의 수직 정렬 및 Spacer 사용 개선 권장

RowverticalAlignment가 지정되지 않아 불릿("◎")과 텍스트의 수직 정렬이 일관되지 않을 수 있습니다. 특히 텍스트가 여러 줄일 경우 정렬 문제가 발생할 수 있습니다.

또한, 수평 간격에는 Spacer(modifier = Modifier.size())보다 Spacer(modifier = Modifier.width())가 의도를 더 명확하게 표현합니다.

♻️ 개선 제안
     Row(
         modifier = modifier
-            .fillMaxWidth()
+            .fillMaxWidth(),
+        verticalAlignment = androidx.compose.ui.Alignment.Top
     ) {
         Text(
             text = "◎",
             style = CherrishTheme.typography.body3R12,
             color = CherrishTheme.colors.gray600
         )

-        Spacer(modifier = Modifier.size(4.dp))
+        Spacer(modifier = Modifier.width(4.dp))

         Text(

width import 추가:

import androidx.compose.foundation.layout.width

30-35: 하드코딩된 문자열을 string resource로 추출 권장

경고 문구가 코드에 직접 하드코딩되어 있습니다. 국제화(i18n) 및 유지보수를 위해 strings.xml로 추출하는 것이 좋습니다. 또한 하드코딩된 \n은 화면 크기에 따라 레이아웃 문제가 발생할 수 있으므로, 텍스트 줄바꿈은 시스템에 맡기는 것이 권장됩니다.

♻️ string resource 추출 제안

res/values/strings.xml에 추가:

<string name="caution_description">본 정보는 인터넷 빅데이터 검색 및 분석을 통해 수집된 정보이며, 공식적인 의료 정보가 아닙니다.</string>

컴포넌트에서 사용:

+import androidx.compose.ui.res.stringResource
+import com.cherrish.android.R

         Text(
-            text = "본 정보는 인터넷 빅데이터 검색 및 분석을 통해 " +
-                "수집된 정보\n이며, 공식적인 의료 정보가 아닙니다.",
+            text = stringResource(R.string.caution_description),
             style = CherrishTheme.typography.body3R12,
             color = CherrishTheme.colors.gray600
         )
📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 04746f0 and 43c51d5.

📒 Files selected for processing (2)
  • app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt
  • app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/ProcedureTitleSection.kt
🚧 Files skipped from review as they are similar to previous changes (1)
  • app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/ProcedureTitleSection.kt
🧰 Additional context used
📓 Path-based instructions (1)
**/*.kt

⚙️ CodeRabbit configuration file

**/*.kt: - Jetpack Compose 구조, 상태 관리, recomposition 최적화에 집중

  • ViewModel, UiState, 단방향 데이터 흐름 패턴 검토
  • 불필요한 recomposition 가능성, remember/derivedStateOf 적절한 사용 확인
  • 네이밍 컨벤션, 가독성, Google 권장 Android 아키텍처 준수 여부

Files:

  • app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.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 (1)
app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt (1)

39-45: LGTM!

Preview 함수가 CherrishTheme으로 올바르게 감싸져 있고, private 가시성이 적절하게 설정되어 있습니다.

Copy link
Copy Markdown

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 0

🧹 Nitpick comments (1)
app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt (1)

21-32: 하드코딩된 문자열을 string resource로 추출하는 것을 권장합니다.

현재 경고 문구가 코드에 직접 하드코딩되어 있습니다. 다국어 지원(i18n)과 유지보수성을 위해 strings.xml로 추출하는 것이 좋습니다. 또한 \n으로 줄바꿈을 강제하면 다양한 화면 크기에서 레이아웃이 의도대로 표시되지 않을 수 있습니다.

♻️ 제안된 수정

app/src/main/res/values/strings.xml에 추가:

<string name="caution_description">본 정보는 인터넷 빅데이터 검색 및 분석을 통해 수집된 정보이며, 공식적인 의료 정보가 아닙니다.</string>

컴포저블 수정:

 @Composable
 fun CautionDescription(
     modifier: Modifier = Modifier
 ) {
     Row(
         modifier = modifier.fillMaxWidth(),
         horizontalArrangement = Arrangement.spacedBy(4.dp)
     ) {
         Text(
             text = "◎",
             style = CherrishTheme.typography.body3R12,
             color = CherrishTheme.colors.gray600
         )

         Text(
-            text = "본 정보는 인터넷 빅데이터 검색 및 분석을 통해 " +
-                "수집된 정보\n이며, 공식적인 의료 정보가 아닙니다.",
+            text = stringResource(R.string.caution_description),
             style = CherrishTheme.typography.body3R12,
             color = CherrishTheme.colors.gray600
         )
     }
 }
📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 43c51d5 and 9434fe4.

📒 Files selected for processing (1)
  • app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt
🧰 Additional context used
📓 Path-based instructions (1)
**/*.kt

⚙️ CodeRabbit configuration file

**/*.kt: - Jetpack Compose 구조, 상태 관리, recomposition 최적화에 집중

  • ViewModel, UiState, 단방향 데이터 흐름 패턴 검토
  • 불필요한 recomposition 가능성, remember/derivedStateOf 적절한 사용 확인
  • 네이밍 컨벤션, 가독성, Google 권장 Android 아키텍처 준수 여부

Files:

  • app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt
🧬 Code graph analysis (1)
app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt (1)
app/src/main/java/com/cherrish/android/core/designsystem/theme/Theme.kt (1)
  • CherrishTheme (38-61)
⏰ 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 (2)
app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt (2)

1-11: LGTM!

패키지 구조와 import 구문이 적절하게 구성되어 있습니다.


36-42: LGTM!

Preview 함수가 private으로 적절히 선언되어 있고, CherrishTheme으로 감싸서 테마가 올바르게 적용됩니다.

Copy link
Copy Markdown
Contributor

@nhyeonii nhyeonii left a comment

Choose a reason for hiding this comment

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

LGTM ~~ 🚀🚀🚀🚀🚀🚀 최고입니다 !!!!!!!

@TEAM-Cherrish TEAM-Cherrish deleted a comment from usuuhyn Jan 12, 2026
Copy link
Copy Markdown
Contributor

@sohee6989 sohee6989 left a comment

Choose a reason for hiding this comment

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

수고하셨습니다!!
리뷰 한 번 확인 부탁드립니다~!

color = CherrishTheme.colors.gray1000
)

Spacer(modifier = Modifier.height(4.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.

p2: 지금 텍스트만 column으로 묶고 있으니 column에서 spacedBy로 간격줘도 되지 않나요?!

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에서 spacedBy로 간격 관리하도록 수정했습니당 ~~

@Composable
fun ProcedureTitleSection(
procedureName: String,
modifier: Modifier = Modifier
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: 지금 modifier 뚫어줬는데 얘를 쓰고 있는 곳이 없네여..!

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.

확인 ! ! !

Copy link
Copy Markdown

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 0

🧹 Nitpick comments (1)
app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/ProcedureTitleSection.kt (1)

16-19: modifier 파라미터 추가 권장

Google의 Compose API 가이드라인에 따르면, 모든 public composable은 modifier 파라미터를 첫 번째 선택적 파라미터로 받아야 합니다. 이를 통해 부모 composable에서 레이아웃 커스터마이징(padding, size 등)이 가능해집니다.

동일 패키지의 CautionDescription은 이미 modifier: Modifier = Modifier 파라미터를 포함하고 있어 일관성을 위해서도 추가가 필요합니다. 또한 Scaffold의 paddingValues를 적용하려면 modifier 파라미터가 필요합니다.

♻️ 제안하는 수정 사항
 @Composable
 fun ProcedureTitleSection(
-    procedureName: String
+    procedureName: String,
+    modifier: Modifier = Modifier
 ) {
-    HorizontalDivider(
-        thickness = 1.dp,
-        color = CherrishTheme.colors.gray500
-    )
-    Column(
-        modifier = Modifier
-            .fillMaxWidth()
-            .background(color = CherrishTheme.colors.gray100)
-            .padding(horizontal = 25.dp, vertical = 20.dp),
-        verticalArrangement = Arrangement.spacedBy(4.dp)
-    ) {
-        Text(
-            text = "$procedureName 관련 시술 리스트",
-            style = CherrishTheme.typography.title1SB18,
-            color = CherrishTheme.colors.gray1000
+    Column(modifier = modifier) {
+        HorizontalDivider(
+            thickness = 1.dp,
+            color = CherrishTheme.colors.gray500
         )
-
-        CautionDescription()
+        Column(
+            modifier = Modifier
+                .fillMaxWidth()
+                .background(color = CherrishTheme.colors.gray100)
+                .padding(horizontal = 25.dp, vertical = 20.dp),
+            verticalArrangement = Arrangement.spacedBy(4.dp)
+        ) {
+            Text(
+                text = "$procedureName 관련 시술 리스트",
+                style = CherrishTheme.typography.title1SB18,
+                color = CherrishTheme.colors.gray1000
+            )
+
+            CautionDescription()
+        }
+        HorizontalDivider(
+            thickness = 1.dp,
+            color = CherrishTheme.colors.gray500
+        )
     }
-    HorizontalDivider(
-        thickness = 1.dp,
-        color = CherrishTheme.colors.gray500
-    )
 }

Based on learnings, Scaffold paddingValues 적용을 위해 modifier 파라미터가 필요합니다.

📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 9434fe4 and f66a535.

📒 Files selected for processing (1)
  • app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/ProcedureTitleSection.kt
🧰 Additional context used
📓 Path-based instructions (1)
**/*.kt

⚙️ CodeRabbit configuration file

**/*.kt: - Jetpack Compose 구조, 상태 관리, recomposition 최적화에 집중

  • ViewModel, UiState, 단방향 데이터 흐름 패턴 검토
  • 불필요한 recomposition 가능성, remember/derivedStateOf 적절한 사용 확인
  • 네이밍 컨벤션, 가독성, Google 권장 Android 아키텍처 준수 여부

Files:

  • app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/ProcedureTitleSection.kt
🧠 Learnings (1)
📚 Learning: 2026-01-12T19:49:27.085Z
Learnt from: nhyeonii
Repo: TEAM-Cherrish/Cherrish-Android PR: 41
File: app/src/main/java/com/cherrish/android/presentation/challenge/ChallengeScreen.kt:30-39
Timestamp: 2026-01-12T19:49:27.085Z
Learning: When a Jetpack Compose screen composable receives a Scaffold paddingValues: PaddingValues parameter (commonly from Scaffold), apply it to the root container's modifier first (e.g., .padding(paddingValues)) before applying any additional padding. This ensures content respects system bars (status/navigation) and avoids layout overlap. This pattern should be followed across presentation screens under app/src/main/java/com/cherrish/android/presentation/ to maintain consistent insets handling.

Applied to files:

  • app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/ProcedureTitleSection.kt
🧬 Code graph analysis (1)
app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/ProcedureTitleSection.kt (2)
app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/CautionDescription.kt (1)
  • CautionDescription (13-34)
app/src/main/java/com/cherrish/android/core/designsystem/theme/Theme.kt (1)
  • CherrishTheme (38-61)
⏰ 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 (2)
app/src/main/java/com/cherrish/android/presentation/calendar/procedure/component/ProcedureTitleSection.kt (2)

24-42: 컴포넌트 구현 LGTM

spacedBy(4.dp)를 사용한 레이아웃 간격 관리, CherrishTheme의 색상/타이포그래피 일관된 사용, 그리고 CautionDescription 컴포넌트 재사용이 잘 되어 있습니다. Stateless composable로 불필요한 recomposition 우려가 없습니다.


45-53: Preview 구현 적절함

CherrishTheme으로 래핑하고, private 접근 제한자를 사용한 Preview 구현이 올바릅니다.

@usuuhyn usuuhyn merged commit 6fece74 into develop Jan 13, 2026
3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

FEAT✨ 새로운 기능 구현 수현🍒 수현 담당

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[FEAT] 시술 리스트 타이틀 섹션 구현

3 participants