feat(refresh): Lottie 새로고침 표시를 적용한다

docs/20260818_메인_탭_당겨서_새로고침/prd.md

@@ -4,10 +4,10 @@
 
 | 항목 | 내용 |
 |---|---|
-| 문서 상태 | 구현 완료 |
+| 문서 상태 | 후속 변경 구현 완료 / 사용자 수동 검증 대기 |
 | 작성일 | `2026-08-18` |
-| 최종 수정일 | `2026-08-18` |
-| 대상 제품 | 메인 홈, 콘텐츠, 대화 탭 당겨서 새로고침 |
+| 최종 수정일 | `2026-08-25` |
+| 대상 제품 | 메인 홈, 콘텐츠, 대화 탭 당겨서 새로고침 및 Lottie 표시 영역 |
 | 작성자·결정권자 | 사용자, Sisyphus |
 | 관련 API Contract | 기존 각 탭 API 계약 재사용, 신규 endpoint 없음 |
 | 관련 구현 계획 | `docs/20260818_메인_탭_당겨서_새로고침/plan-task.md` |
@@ -234,6 +234,7 @@ MainView
 | `HOME-REFRESH-001~003` | 홈 기존 Repository | 1 | `P1-T1`, `P1-GATE` | 빌드 | 홈 내부 탭별 새로고침 |
 | `CONTENT-REFRESH-001~003` | 콘텐츠 기존 Repository | 2 | `P2-T1`, `P2-GATE` | 빌드 | 콘텐츠 내부 탭/필터별 새로고침 |
 | `CHAT-REFRESH-001~002` | `/api/v2/chat/rooms` | 3 | `P3-T1`, `P3-GATE` | 빌드 | 대화 필터별 새로고침 |
+| `REFRESH-ANIMATION-001~005` | local Lottie asset, 신규 API 없음 | 4 | `P4-T1`, `P4-T2`, `P4-GATE` | asset 검사, 두 scheme 빌드 | Lottie 재생·크기·Reduce Motion·범위 제외 |
 
 ## 17. Decision Log
 
@@ -251,3 +252,80 @@ MainView
 - [x] 관련 요구사항 상태·본문·수용 기준을 갱신했다.
 - [x] `plan-task.md`의 범위·Files·체크박스·완료 증거를 코드 변경 전에 갱신했다.
 - [x] 기존 Progress·review·검증 기록을 삭제하거나 덮어쓰지 않았다.
+
+## 19. 후속 변경 확정: Lottie 새로고침 표시
+
+### 19.1 확인된 현재 상태
+
+- `2026-08-25` 사용자 요청은 기존 pull-to-refresh 동작의 표시 영역을 `Resources/pull-to-refresh.json` 기반 Lottie animation으로 변경하는 것이다.
+- 구현 전 pull-to-refresh는 메인 홈·콘텐츠·대화의 7개 SwiftUI View에 있고, loading·empty·error·content 분기를 합쳐 `.refreshable` modifier가 20곳에 적용되어 있었다.
+- Lottie `4.6.1` Swift Package가 `SodaLive`, `SodaLive-dev` 두 target에 연결되어 있다.
+- 공식 Lottie iOS API는 SwiftUI용 `LottieView`와 local JSON loading, playback mode 및 progress 제어를 제공한다.
+- `SodaLive/Resources/pull-to-refresh.json`은 `150×150`, `30fps`, frame `0..<45`, marker 없음인 local Lottie asset이며 `SodaLive`, `SodaLive-dev` 두 target의 Resources build phase에 포함되어 있다.
+- asset의 frame `0`은 trim path 시작·끝 값이 모두 `3`이라 비어 있고, frame `1`부터 stroke가 표시된다.
+- Phase 4 요구사항 인터뷰 요청에서는 문서 작성만 수행했고, 이후 사용자 승인으로 코드 구현과 자동 검증을 완료했다.
+
+### 19.2 후속 요구사항
+
+| ID | 상태 | 요구사항 | 수용 기준 | 계약/Goal 연결 |
+|---|---|---|---|---|
+| `REFRESH-ANIMATION-001` | 확정 | 기존 메인 홈·콘텐츠·대화의 pull-to-refresh 표시 영역에 지정된 Lottie animation을 사용한다. | 기존 7개 View의 모든 refresh 가능 상태에서 동일한 Lottie asset이 표시되고 기존 데이터 새로고침 동작은 유지된다. | `P4-T1`, `P4-T2` |
+| `REFRESH-ANIMATION-002` | 확정 | 당김 영역이 보이면 Lottie animation을 반복 재생하고, 새로고침 완료 또는 당김 취소로 영역이 사라질 때 정지·처음 frame으로 초기화한다. | 당기는 거리에 따른 progress 제어 없이 영역 노출 중 반복 재생하며, 영역이 사라졌다가 다시 나타나면 처음부터 재생한다. | `DEC-006`, `P4-T1` |
+| `REFRESH-ANIMATION-003` | 확정 | Lottie animation을 원본 비율을 유지한 최대 `48×48pt`로 중앙 정렬하고 상하 `8pt` 여백을 둔다. | 총 `64pt` 높이의 refresh 영역에서 animation이 늘어나거나 잘리지 않고 iPhone·iPad에 동일하게 표시된다. | `DEC-007`, `P4-T1`, `P4-GATE` |
+| `REFRESH-ANIMATION-004` | 확정 | Reduce Motion 활성화 시 반복 재생하지 않고 asset의 첫 번째 유효 frame인 frame `1`을 표시한다. | 동작 줄이기가 켜지면 animation이 재생되지 않으며, frame `1`의 stroke가 영역 노출 중 정지 상태로 표시된다. | `DEC-008`, `DEC-009`, `P4-T1`, `P4-GATE` |
+| `REFRESH-ANIMATION-005` | 확정 | Lottie 표시를 기존 PRD 범위인 메인 홈·콘텐츠·대화 7개 View에만 적용한다. | 7개 View의 20개 refresh 가능 상태에서 Lottie만 표시하고 기존 indicator를 함께 노출하지 않으며, `LiveNowAllView`와 `ContentDetailView`는 변경되지 않는다. | `DEC-010`, `P4-T2`, `P4-GATE` |
+
+### 19.3 후속 Open Questions
+
+| ID | 상태 | 결정 필요 사항 | 현재 권고 | 결정 주체 | 결정 기한/시점 | 영향 Goal |
+|---|---|---|---|---|---|---|
+| `OQ-002` | 확정 | 당기는 중과 refresh 실행 중 Lottie playback을 각각 어떻게 제어할지 | 영역 노출 중 반복 재생, 영역 종료 시 정지·초기화 | 사용자 | 2026-08-25 | 후속 Phase 전체 |
+| `OQ-003` | 확정 | Lottie 표시 크기, refresh 영역 높이와 수평·수직 정렬 | 최대 `48×48pt`, 원본 비율 유지, 중앙 정렬, 상하 `8pt` 여백 | 사용자 | 2026-08-25 | 후속 UI Gate |
+| `OQ-004` | 확정 | iOS Reduce Motion 활성화 시 표시할 정지 frame | 비어 있는 frame `0` 대신 첫 번째 유효 frame `1` 표시 | 사용자 | 2026-08-25 | 후속 접근성 Gate |
+| `OQ-005` | 확정 | 메인 7개 View만 적용할지, 다른 기존 pull-to-refresh 화면도 포함할지 | 기존 PRD 범위인 메인 7개 View만 적용 | 사용자 | 2026-08-25 | 후속 Phase 전체 |
+
+### 19.4 후속 변경 제약
+
+- 기존 `refresh()` 호출, 선택 탭·필터 유지, pagination 초기화와 오류 처리 동작은 변경하지 않는다.
+- Lottie `4.6.1` 외에 새 dependency를 추가하지 않는다.
+- 20개 modifier마다 구현을 복제하지 않고, 기존 7개 View의 공통 요구를 충족하는 최소 재사용 단위만 구현한다.
+- SwiftUI `.refreshable`의 기본 indicator는 custom Lottie로 교체할 공개 API가 없으므로, V2 공용 refresh component 한 개에서 당김 offset·비동기 refresh 상태·Lottie 표시를 관리한다.
+- 기존 `RefreshableScrollView` `1.1.1`은 indicator가 내부에 고정되어 있으므로 후속 V2 component의 기반으로 사용하지 않고, package source도 수정하지 않는다.
+- Lottie visual은 접근성 트리에서 숨기고, 공용 refresh component는 기존 `I18n.LiveNow.refreshButton` 문구를 재사용한 명시적 accessibility refresh action을 제공한다.
+- `SodaLive.xcodeproj/project.pbxproj`, `SodaLive.xcworkspace/xcshareddata/swiftpm/Package.resolved`의 현재 Lottie 관련 변경은 사용자 작업으로 보존한다.
+- `SodaLive/Sources/Live/Now/All/LiveNowAllView.swift`, `SodaLive/Sources/Content/Detail/ContentDetailView.swift`의 기존 pull-to-refresh는 이번 범위에서 제외한다.
+
+### 19.5 후속 변경 Decision Log
+
+| 날짜 | ID | 상태 | 결정 | 근거 | 영향 요구사항·계약·Goal |
+|---|---|---|---|---|---|
+| 2026-08-25 | `DEC-004` | 확정 | 기존 iOS 기본 refresh 표시를 지정된 Lottie animation으로 변경하고, 이미 추가된 Lottie `4.6.1`을 사용한다. | 사용자 직접 요청과 현재 Swift Package 설정 | `REFRESH-ANIMATION-001~004` |
+| 2026-08-25 | `DEC-005` | 확정 | Phase 4 요구사항 인터뷰 실행에서는 문서 작성만 수행하고 코드 구현은 하지 않는다. | 사용자 직접 요청 | 후속 Phase 전체 |
+| 2026-08-25 | `DEC-006` | 확정 | Lottie는 당김 영역이 보이는 동안 반복 재생하고, 영역이 사라질 때 정지 후 처음 frame으로 초기화한다. | 사용자 인터뷰 A안 선택 | `REFRESH-ANIMATION-002`, `OQ-002` |
+| 2026-08-25 | `DEC-007` | 확정 | Lottie는 원본 비율을 유지한 최대 `48×48pt`로 중앙 정렬하고, 상하 `8pt` 여백을 포함한 총 `64pt` refresh 영역에 표시한다. | 사용자 인터뷰 A안 선택과 기존 `SodaSpacing` 값 | `REFRESH-ANIMATION-003`, `OQ-003` |
+| 2026-08-25 | `DEC-008` | 확정 | iOS Reduce Motion이 활성화되면 Lottie를 반복 재생하지 않고 정지 frame을 표시한다. | 사용자 인터뷰 A안 선택 | `REFRESH-ANIMATION-004`, `OQ-004` |
+| 2026-08-25 | `DEC-009` | 확정 | Reduce Motion 정지 화면은 비어 있는 frame `0`을 건너뛰고 asset의 첫 번째 유효 frame인 frame `1`을 사용한다. | 사용자 인터뷰 A안 선택과 asset frame 확인 | `REFRESH-ANIMATION-004`, `OQ-004` |
+| 2026-08-25 | `DEC-010` | 확정 | Lottie 적용 범위는 기존 PRD의 메인 홈·콘텐츠·대화 7개 View로 제한하고 legacy pull-to-refresh 2개 화면은 제외한다. | 사용자 인터뷰 A안 선택 | `REFRESH-ANIMATION-005`, `OQ-005` |
+| 2026-08-25 | `DEC-011` | 정정 | `DEC-003`의 공통 refresh abstraction 제외는 Phase 1~3에 유지하되, Phase 4에서는 7개 View·20개 상태의 표시 중복을 막기 위한 V2 공용 component 한 개만 허용한다. | 동일한 Lottie 상태·접근성·비동기 guard를 한 곳에서 유지하기 위한 최소 재사용 단위 | `P4-T1`, `P4-T2` |
+
+### 19.6 인터뷰 종료 결과
+
+| 차원 | 명확성 |
+|---|---:|
+| Goal | `1.00` |
+| Scope | `1.00` |
+| Constraints | `0.90` |
+| Success | `1.00` |
+| Context | `0.90` |
+
+- 최종 모호성: `0.03`
+- 결정사항: `DEC-004~011`에 Lottie asset·재생·크기·Reduce Motion·적용 범위·최소 공용 component를 기록했다.
+- 열린 질문: 없음.
+
+### 19.7 후속 성공 기준
+
+- [x] V2 공용 Lottie refresh component 2개가 `SodaLive`, `SodaLive-dev` 두 target에서 빌드된다. (`REFRESH-ANIMATION-001~004`)
+- [x] 메인 7개 View의 기존 `.refreshable` 20곳이 공용 component로 교체되고 기본 indicator 경로가 남아 있지 않다. (`REFRESH-ANIMATION-001`, `REFRESH-ANIMATION-005`)
+- [x] 기존 7개 ViewModel과 `LiveNowAllView`, `ContentDetailView`에 구현 diff가 없다. (`REFRESH-ANIMATION-005`)
+- [ ] 실제 당김·취소·새로고침 완료에서 Lottie 반복·초기화와 단일 요청 동작을 확인한다. (`REFRESH-ANIMATION-002`)
+- [ ] Reduce Motion frame `1`, 최대 `48×48pt`, 총 `64pt` 영역과 iPhone·iPad 레이아웃을 확인한다. (`REFRESH-ANIMATION-003~004`)