Skip to content

SCRUM-283 design: Add notification screen - #67

Merged
gdaegeun539 merged 3 commits into
project-lyrics:developfrom
gdaegeun539:feature/SCRUM-283-alert-view-layout
Jul 17, 2026
Merged

SCRUM-283 design: Add notification screen#67
gdaegeun539 merged 3 commits into
project-lyrics:developfrom
gdaegeun539:feature/SCRUM-283-alert-view-layout

Conversation

@gdaegeun539

@gdaegeun539 gdaegeun539 commented Jul 15, 2026

Copy link
Copy Markdown
Member

Please check if the PR fulfills these requirements

  • The commit message follows our guidelines
  • Tests for the changes have been added

What kind of change does this PR introduce?

  • Implement design

What is the current behavior?

홈 화면의 알림 아이콘에 이동 동작이 연결되어 있지 않고, 알림 목록을 보여주는 화면과 Navigation 목적지가 없습니다.

What is the new behavior (if this is a feature change)?

알림 화면을 구현하고 홈 화면 및 Navigation graph에 연결했습니다.

  • 뒤로가기 버튼과 중앙 정렬된 제목을 포함한 상단 앱바
  • 내 소식, 전체 탭과 탭별 샘플 상태
  • 알림 목록과 빈 상태 화면
  • 읽음 여부에 따른 텍스트, 썸네일, 안 읽음 표시
  • URL 이미지 로딩과 기본 placeholder
  • 삭제된 노트 상태를 위한 안내 다이얼로그 UI
  • Hilt NotificationViewModelStateFlow 기반 상태 관리
  • 홈 알림 아이콘에서 알림 화면으로 이동하는 Navigation 연결
  • ViewModel 단위 테스트와 Compose UI 테스트

서버 및 Repository를 통한 실제 알림 조회와 알림 항목 클릭 후 상세 화면 이동은 이번 작업 범위에서 제외했습니다.

Does this PR introduce a breaking change? (What changes might users need to make in their application due to this PR?)

아니요. 기존 기능에 영향을 주는 breaking change는 없습니다.

ScreenShots (If needed)

Light mode

Screenshot_20260715_231014_ DEV  Feelin Screenshot_20260715_231017_ DEV  Feelin

Dark mode

Screenshot_20260715_231024_ DEV  Feelin Screenshot_20260715_231027_ DEV  Feelin

Other information:

AI Agent

다음 항목을 검증했습니다.

  • ./gradlew :app:testDevDebugUnitTest
  • ./gradlew :app:connectedDevDebugAndroidTest (15 tests)
  • ./gradlew detekt
  • ./gradlew :app:assembleDebug
  • 에뮬레이터에서 알림 화면 진입, 탭 전환, 빈 상태, 뒤로가기 동작 확인

User

지금은 알림 화면 이동이 홈 화면에서만 있는데, 실제 구현에서는 마이페이지에서의 이동과 아티스트 화면에서의 이동(요구사항이 약간 다름)이 있습니다. 이는 실제 기능 연동시에 같이 연동하겠습니다.

Summary by CodeRabbit

  • New Features

    • Added a notifications screen accessible from the home screen.
    • Added “My News” and “All” notification tabs.
    • Added empty-state messaging, unread indicators, notification item interactions, and deleted-note confirmation dialog.
    • Added back navigation from the notifications screen.
  • Tests

    • Added coverage for notification display, tab switching, empty states, dividers, and read/unread indicators.

Create NotificationScreen and NotificationUiState to structure the layout of the notification area.
Introduce NotificationListItem and NotificationEmptyState for displaying individual alerts and empty states.
Register the notification screen route in the navigation graph
and update the home screen notification click handler to navigate to NotificationScreen.
Integrate NotificationViewModel to manage tab selection and filter notification items.
Refactor NotificationListItem to load image URLs using AsyncImage and display an unread badge on top-end of the image.
Update NotificationScreen to use a top bar with a back button and show dividers between items. Add unit and UI tests for verification.
@coderabbitai

coderabbitai Bot commented Jul 15, 2026

Copy link
Copy Markdown

Review Change Stack

Important

Review skipped

No new commits to review since the last review.

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 67ea2dbe-3e59-4d5e-8aae-c8ce351189cf

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review
📝 Walkthrough

Walkthrough

Adds a notifications destination with Compose UI, tab-driven ViewModel state, empty and populated views, read indicators, deleted-note dialog handling, navigation wiring, previews, and unit/instrumentation tests.

Changes

Notification feature

Layer / File(s) Summary
Notification state and tab behavior
app/src/main/.../notification/NotificationUiState.kt, app/src/main/.../notification/NotificationViewModel.kt, app/src/test/.../notification/NotificationViewModelTest.kt
Defines notification models and validates tab selection, item clearing, and item restoration.
Notification item and empty-state components
app/src/main/.../notification/component/*, app/src/androidTest/.../notification/component/NotificationListItemTest.kt
Adds empty-state and list-item composables with read-state styling, unread indicators, click handling, previews, and tests.
Notification screen composition
app/src/main/.../notification/NotificationScreen.kt, app/src/androidTest/.../notification/NotificationScreenTest.kt
Adds the scaffold, tabs, list, dividers, empty state, deleted-note dialog, previews, and screen tests.
Notification navigation entry point
app/src/main/.../navigation/FeelinDestination.kt, app/src/main/.../navigation/FeelinNavHost.kt, app/src/main/.../navigation/HomeNavigation.kt
Adds the notification route and connects Home notification clicks to the rendered screen.

Estimated code review effort: 3 (Moderate) | ~25 minutes

Possibly related PRs

Suggested labels: design

🚥 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
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly summarizes the main change: adding a notification screen.
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

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.

@gdaegeun539 gdaegeun539 self-assigned this Jul 15, 2026
@gdaegeun539 gdaegeun539 added the design 디자인 관련 수정 label Jul 15, 2026

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: b81715b522

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In
`@app/src/main/java/com/lyrics/feelin/presentation/view/notification/component/NotificationListItem.kt`:
- Around line 37-42: Reorder the parameters of the composable
NotificationListItem so the optional modifier parameter comes before the onClick
lambda, while preserving their types, defaults, and existing behavior to enable
trailing-lambda call syntax.

In
`@app/src/main/java/com/lyrics/feelin/presentation/view/notification/NotificationScreen.kt`:
- Around line 32-40: Reorder NotificationScreen parameters so modifier is the
first optional parameter after the required uiState, followed by the lambda
parameters, while preserving their names and types to keep named callers
compatible.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

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

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: db71aa5d-71c4-436c-905a-1562f3af376a

📥 Commits

Reviewing files that changed from the base of the PR and between 142f98b and b81715b.

📒 Files selected for processing (11)
  • app/src/androidTest/java/com/lyrics/feelin/presentation/view/notification/NotificationScreenTest.kt
  • app/src/androidTest/java/com/lyrics/feelin/presentation/view/notification/component/NotificationListItemTest.kt
  • app/src/main/java/com/lyrics/feelin/navigation/FeelinDestination.kt
  • app/src/main/java/com/lyrics/feelin/navigation/FeelinNavHost.kt
  • app/src/main/java/com/lyrics/feelin/navigation/HomeNavigation.kt
  • app/src/main/java/com/lyrics/feelin/presentation/view/notification/NotificationScreen.kt
  • app/src/main/java/com/lyrics/feelin/presentation/view/notification/NotificationUiState.kt
  • app/src/main/java/com/lyrics/feelin/presentation/view/notification/NotificationViewModel.kt
  • app/src/main/java/com/lyrics/feelin/presentation/view/notification/component/NotificationEmptyState.kt
  • app/src/main/java/com/lyrics/feelin/presentation/view/notification/component/NotificationListItem.kt
  • app/src/test/java/com/lyrics/feelin/presentation/view/notification/NotificationViewModelTest.kt

@gdaegeun539

Copy link
Copy Markdown
Member Author

@codex re-review this except latest review comments.

@gdaegeun539

Copy link
Copy Markdown
Member Author

@coderabbitai re-review this except latest review comments.

@coderabbitai

coderabbitai Bot commented Jul 16, 2026

Copy link
Copy Markdown

The PR description images show four screenshots of the notification screen in the Feelin app:

  1. Screenshot_20260715_231014 (light mode, "내 소식" tab): Top app bar with back arrow and centered title "알림" (Notification), two tabs "내 소식" (My News, selected/underlined in blue) and "전체" (All). A list of notification items with circular thumbnail images, message text (e.g., "새 노트에 좋아요가 달렸어요.", "친구가 당신의 노트에 댓글을 남겼어요.", etc.), timestamps ("방금 전", "10분 전", "1시간 전", "어제", "2일 전"), and small red unread-indicator dots next to the first two thumbnails.
  2. Screenshot_20260715_231017 (light mode, "전체" tab): Same top bar and tabs, but "전체" is now selected, showing an empty state with centered gray text "새로운 알림이 없어요" (No new notifications).
  3. Screenshot_20260715_231024 (dark mode, "내 소식" tab): Same list as screenshot 1, rendered in dark theme with light text on black background.
  4. Screenshot_20260715_231027 (dark mode, "전체" tab): Same empty state as screenshot 2, rendered in dark theme.

These confirm the notification screen's tabs, list items, unread indicators, and empty states render correctly in both light and dark modes as described in the PR objectives.


@gdaegeun539, got it — I'll kick off a fresh review of the current state of the PR, excluding the points already raised in the most recent review comments.

✅ Action performed

Review finished.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: b81715b522

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

@gdaegeun539

Copy link
Copy Markdown
Member Author

병합하겠습니다.

@gdaegeun539
gdaegeun539 merged commit 1627bb6 into project-lyrics:develop Jul 17, 2026
3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

design 디자인 관련 수정

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant