klaus/sodalive-ios
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(home): 순위 변화 배지를 추가한다

Browse Source
This commit is contained in:
Yu Sung
2026-06-30 15:30:39 +09:00
parent c4e83c3aef
commit 6e3a7b21f7
3 changed files with 122 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
docs/20260630_메인_홈_랭킹_탭/plan-task.md
View File

@@ -156,7 +156,7 @@
### Phase 4: 순위 변화 UI 컴포넌트
- [ ] **Task 4.1: 순위 변화 badge 컴포넌트 생성**
- [x] **Task 4.1: 순위 변화 badge 컴포넌트 생성**
- 대상 파일:
- 생성: `SodaLive/Sources/V2/Main/Home/Ranking/Components/MainHomeRankChangeBadge.swift`
- 작업 내용:
@@ -167,10 +167,11 @@
- `rankChange < 0`이면 절댓값 숫자와 `Image("ic_rank_caret_decrease")`를 표시한다.
- `rankChange == 0`이면 숫자 없이 `Image("ic_rank_caret_stay")`만 표시한다.
- `rankChange == nil && isNew == false`이면 아무것도 표시하지 않는다.
- Figma 기준 rank 변화 badge는 컴포넌트 내부에서 `Color.gray900`(`#202020`) 배경, horizontal padding 4, corner radius 4를 적용한다.
- Preview에는 상승, 하락, 변동 없음, 신규 진입, `showRankChange == false`, `rankChange == nil && isNew == false` 상태를 모두 배치해 한 화면에서 UI 차이를 확인할 수 있게 한다.
- 검증 기준:
- 실행 명령: `rg "struct MainHomeRankChangeBadge|ic_rank_new|ic_rank_caret_increase|ic_rank_caret_decrease|ic_rank_caret_stay|abs\\(|PreviewProvider|showRankChange: false|rankChange: nil|isNew: true|rankChange: 0" SodaLive/Sources/V2/Main/Home/Ranking/Components/MainHomeRankChangeBadge.swift`
- 기대 결과: PRD의 순위 변화 표시 규칙, 아이콘명, 조건별 Preview가 모두 확인된다.
- 실행 명령: `rg "struct MainHomeRankChangeBadge|ic_rank_new|ic_rank_caret_increase|ic_rank_caret_decrease|ic_rank_caret_stay|abs\\(|Color.gray900|cornerRadius\\(4\\)|padding\\(\\.horizontal, 4\\)|PreviewProvider|showRankChange: false|rankChange: nil|isNew: true|rankChange: 0" SodaLive/Sources/V2/Main/Home/Ranking/Components/MainHomeRankChangeBadge.swift`
- 기대 결과: PRD의 순위 변화 표시 규칙, Figma badge 배경/라운드/패딩, 아이콘명, 조건별 Preview가 모두 확인된다.
### Phase 5: 순위별 랭킹 UI 컴포넌트
@@ -348,3 +349,13 @@
- `I18n.HomeRanking.emptyStateMessage` 추가
- 검증 메모:
- 현재 저장소 가이드상 테스트 번들 타깃이 확인되지 않아 신규 단위 테스트는 추가하지 않고 정적 검색 및 빌드 검증으로 확인
- 2026-06-30 Phase 4 진행:
- 목적: 랭킹 카드/row에서 재사용할 순위 변화 badge 컴포넌트 추가
- 변경 내용:
- `MainHomeRankChangeBadge` 추가
- `showRankChange`, `isNew`, `rankChange` 조건에 따라 신규/상승/하락/변동 없음/미표시 상태 분기
- Phase 4 Preview에 상승, 하락, 변동 없음, 신규 진입, 순위 변화 숨김, `rankChange == nil && isNew == false` 상태 추가
- 검증 메모:
- 문서의 Phase 4 정적 검색 기준으로 아이콘명, 조건별 Preview, `abs()` 사용을 확인
- Figma badge 배경 기준 확인 후 `Color.gray900`(`#202020`) 배경, horizontal padding 4, corner radius 4를 `MainHomeRankChangeBadge`에 반영