From 74efe45d05d7cbe9d81432457a65e614960523c7 Mon Sep 17 00:00:00 2001 From: klaus Date: Tue, 23 Jun 2026 00:16:12 +0900 Subject: [PATCH] =?UTF-8?q?docs(creator):=20FanTalk=20empty=20=EB=B3=B4?= =?UTF-8?q?=EC=A0=95=20=EA=B2=80=EC=A6=9D=EC=9D=84=20=EA=B8=B0=EB=A1=9D?= =?UTF-8?q?=ED=95=9C=EB=8B=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/20260622_FanTalk_탭/plan-task.md | 64 +++++++++++++++++++++++++++ docs/20260622_FanTalk_탭/prd.md | 8 ++-- 2 files changed, 68 insertions(+), 4 deletions(-) diff --git a/docs/20260622_FanTalk_탭/plan-task.md b/docs/20260622_FanTalk_탭/plan-task.md index 0fd44982..5f102efa 100644 --- a/docs/20260622_FanTalk_탭/plan-task.md +++ b/docs/20260622_FanTalk_탭/plan-task.md @@ -592,6 +592,69 @@ --- +### Phase 7: FanTalk Empty View 위치와 Figma 색상 보정 + +- [x] **Task 7.1: Figma empty 기준과 기존 탭 배치 비교** + - 확인: + - Figma node `290:9001` + - `app/src/main/res/layout/fragment_creator_channel_fantalk.xml` + - `app/src/main/res/layout/fragment_creator_channel_audio.xml` + - `app/src/main/res/layout/fragment_creator_channel_series.xml` + - `app/src/main/res/layout/fragment_creator_channel_community.xml` + - `app/src/main/java/kr/co/vividnext/sodalive/v2/creator/channel/fantalk/CreatorChannelFanTalkFragment.kt` + - 작업: + - FanTalk empty container의 `minHeight`/부모 전체 center 배치 여부를 확인한다. + - 오디오/시리즈/커뮤니티 탭의 empty container 위치 패턴을 확인한다. + - Figma node `290:9001`의 empty 문구 색상, button 배경, button text 색상, spacing을 확인한다. + - 검증 기준: + - Figma 기준: 문구 `gray/500`(`#959595`), button 배경 `gray/800`(`#343434`), button text `white`, 문구-button gap 14dp, icon-text gap 6dp. + - 기존 탭 기준: empty container는 `wrap_content`, `paddingTop=@dimen/spacing_48`, `paddingBottom=@dimen/spacing_32`, `Top_toTopOf=parent`, bottom constraint 없음. + - 검증 기록: + - 2026-06-22: Figma `290:9001`을 확인했다. empty 문구는 Pretendard regular 16sp, line-height 1.45, `gray/500 #959595`이고, button은 `gray/800 #343434` 배경, radius 100, 20dp icon, 16sp medium white text, 문구-button gap 14dp, icon-text gap 6dp임을 확인했다. + - 2026-06-22: 오디오/시리즈/커뮤니티 탭 empty container는 `FrameLayout`, `layout_height=wrap_content`, `paddingTop=@dimen/spacing_48`, `paddingBottom=@dimen/spacing_32`, `Top_toTopOf=parent` 패턴이고 bottom constraint를 사용하지 않음을 확인했다. + - 2026-06-22: FanTalk empty container는 `layout_height=0dp`, parent bottom constraint, center gravity를 사용하고, Fragment가 `binding.root.minimumHeight = minHeight`를 적용하고 있어 다른 탭과 다르게 추가 높이를 만든다는 점을 확인했다. + +- [x] **Task 7.2: FanTalk layout/source 테스트 RED 갱신** + - 수정: + - `app/src/test/java/kr/co/vividnext/sodalive/v2/creator/channel/fantalk/CreatorChannelFanTalkFragmentLayoutTest.kt` + - 작업: + - FanTalk empty container가 오디오/시리즈/커뮤니티와 같은 상단 가시 영역 배치를 따르도록 테스트 기대값을 변경한다. + - `binding.root.minimumHeight = minHeight`를 사용하지 않도록 source 테스트 기대값을 변경한다. + - Figma 기준 색상/spacing 리소스가 적용되는지 테스트에 포함한다. + - 검증 명령: + - `./gradlew --no-daemon :app:testDebugUnitTest --tests "kr.co.vividnext.sodalive.v2.creator.channel.fantalk.CreatorChannelFanTalkFragmentLayoutTest"` + - 기대 결과: + - 구현 수정 전에는 layout/source 기대값 차이로 RED 실패한다. + - 검증 기록: + - 2026-06-22: 테스트를 먼저 갱신한 뒤 위 명령을 실행했고 `팬톡 fragment layout은 count list empty error retry floating write를 제공하고 sort UI는 제외한다`, `팬톡 fragment source는 Phase 5 상태 신고 삭제 Host 계약을 포함한다` 2건이 예상대로 실패했다. + +- [x] **Task 7.3: FanTalk Empty View 최소 수정** + - 수정: + - `app/src/main/res/layout/fragment_creator_channel_fantalk.xml` + - `app/src/main/java/kr/co/vividnext/sodalive/v2/creator/channel/fantalk/CreatorChannelFanTalkFragment.kt` + - 작업: + - empty container를 `FrameLayout`/`wrap_content` 기반으로 바꾸고 `paddingTop=@dimen/spacing_48`, `paddingBottom=@dimen/spacing_32`, top constraint만 남긴다. + - empty 문구/버튼 내부 vertical layout을 Figma 기준으로 유지하되 문구-button gap을 14dp로 맞춘다. + - button icon-text gap을 6dp로 맞춘다. + - `onCreatorChannelFanTalkViewportHeightChanged(minHeight: Int)`는 다른 탭처럼 no-op으로 변경해 root `minimumHeight` 설정을 제거한다. + - 검증 명령: + - `./gradlew --no-daemon :app:testDebugUnitTest --tests "kr.co.vividnext.sodalive.v2.creator.channel.fantalk.CreatorChannelFanTalkFragmentLayoutTest"` + - `./gradlew --no-daemon :app:mergeDebugResources` + - `./gradlew --no-daemon :app:compileDebugKotlin` + - `git diff --check` + - 기대 결과: + - FanTalk layout 테스트, resource merge, Kotlin compile, whitespace check가 PASS한다. + - 검증 기록: + - 2026-06-22: `fragment_creator_channel_fantalk.xml`에서 empty container를 `FrameLayout`/`wrap_content`로 변경하고 `paddingTop=@dimen/spacing_48`, `paddingBottom=@dimen/spacing_32`, top constraint만 남겼다. + - 2026-06-22: empty content 내부 button spacing을 Figma 기준에 맞춰 문구-button gap 14dp, icon-text gap 6dp로 조정했다. empty 문구 `gray_500`, button 배경 `gray_800`, button text `white`는 테스트로 확인했다. + - 2026-06-22: `CreatorChannelFanTalkFragment.onCreatorChannelFanTalkViewportHeightChanged(minHeight: Int)`를 다른 탭처럼 no-op으로 변경해 root `minimumHeight` 설정을 제거했다. + - 2026-06-22: `./gradlew --no-daemon :app:testDebugUnitTest --tests "kr.co.vividnext.sodalive.v2.creator.channel.fantalk.CreatorChannelFanTalkFragmentLayoutTest"` 최초 GREEN 시도에서 floating write button의 bottom constraint까지 전체 XML 기준으로 검사해 1건이 실패했다. Empty container 블록만 검사하도록 테스트를 좁힌 뒤 재실행 결과 PASS. + - 2026-06-22: `./gradlew --no-daemon :app:mergeDebugResources` 실행 결과 PASS. + - 2026-06-22: `./gradlew --no-daemon :app:compileDebugKotlin` 실행 결과 PASS. + - 2026-06-22: `git diff --check` 실행 결과 출력 없이 PASS. + +--- + ## Verification Log - 문서 작성 시점에는 구현을 수행하지 않았으므로 빌드/테스트 검증 기록이 없다. @@ -600,3 +663,4 @@ - 2026-06-22: Phase 4, 5 코드 리뷰를 수행했다. Figma `290:9139`, `290:9000` 기준으로 count bar, sort UI 부재, 원글/답글 item, 권한별 action, more popup, floating/empty write button, empty 문구를 구현과 대조했고 blocking finding은 발견하지 못했다. - 2026-06-22: Phase 4, 5 재검증으로 `./gradlew :app:testDebugUnitTest --tests "kr.co.vividnext.sodalive.v2.creator.channel.fantalk.CreatorChannelFanTalkFragmentLayoutTest"`, `./gradlew :app:testDebugUnitTest --tests "kr.co.vividnext.sodalive.v2.creator.channel.CreatorChannelActivitySourceTest" --tests "kr.co.vividnext.sodalive.v2.creator.channel.CreatorChannelPagerAdapterTest"`, `./gradlew :app:mergeDebugResources`, `./gradlew :app:compileDebugKotlin`, `./gradlew :app:ktlintCheck`, `./gradlew :app:testDebugUnitTest --tests "kr.co.vividnext.sodalive.v2.creator.channel.fantalk.*"`, `git diff --check`를 실행했고 모두 PASS했다. 최초 `mergeDebugResources`는 Gradle wrapper lock 파일 샌드박스 접근 제한으로 실패했으며, 동일 명령을 승인 실행해 PASS를 확인했다. - 2026-06-22: Phase 6 통합 검증으로 `./gradlew :app:testDebugUnitTest --tests "kr.co.vividnext.sodalive.v2.creator.channel.fantalk.*"`, `./gradlew :app:testDebugUnitTest --tests "kr.co.vividnext.sodalive.v2.creator.channel.*FanTalk*"`, `./gradlew :app:testDebugUnitTest --tests "kr.co.vividnext.sodalive.v2.creator.channel.*"`, `./gradlew :app:mergeDebugResources`, `./gradlew :app:compileDebugKotlin`, `./gradlew :app:ktlintCheck`, `git diff --check`를 실행했다. 전체 Creator Channel 테스트 최초 실행에서 `CreatorChannelHomeViewModelTest > 채널 후원 성공은 기존 후원 API를 호출하고 홈을 다시 로드한다` 1건이 일시 실패했으나, 해당 테스트 단독 재실행과 전체 Creator Channel 테스트 재실행은 모두 PASS했다. +- 2026-06-22: Phase 7 FanTalk Empty View 보정 검증으로 `./gradlew --no-daemon :app:testDebugUnitTest --tests "kr.co.vividnext.sodalive.v2.creator.channel.fantalk.CreatorChannelFanTalkFragmentLayoutTest"`, `./gradlew --no-daemon :app:mergeDebugResources`, `./gradlew --no-daemon :app:compileDebugKotlin`, `git diff --check`를 실행했고 모두 PASS했다. diff --git a/docs/20260622_FanTalk_탭/prd.md b/docs/20260622_FanTalk_탭/prd.md index d22a3627..82f306ef 100644 --- a/docs/20260622_FanTalk_탭/prd.md +++ b/docs/20260622_FanTalk_탭/prd.md @@ -242,13 +242,13 @@ FanTalk가 없으면 목록 대신 empty 상태를 표시한다. - `fanTalkCount == 0` 또는 표시 가능한 `fanTalks`가 없는 전체 empty 상태이면 empty 상태를 표시한다. - empty 상태에서는 FanTalk 목록을 표시하지 않는다. - empty 상태에서는 Figma empty 화면 `290:9000` 기준으로 Sort-bar를 표시하지 않는다. -- empty 문구는 화면 중앙에 16sp regular, `gray/500` 계열, center 정렬로 표시한다. +- empty 문구는 Figma node `290:9001` 기준으로 16sp regular, line-height 1.45, `gray/500`(`#959595`), center 정렬로 표시한다. - empty 문구 한국어는 `아직 응원이 없습니다.\n처음으로 크리에이터를 응원해 보세요!`이다. - empty 문구 영어는 `No cheers yet.\nBe the first to cheer for the creator!`이다. - empty 문구 일본어는 `まだ応援がありません。\n最初にクリエイターを応援してみましょう!`이다. - empty 문구는 한국어/영어/일본어 다국어 문자열 리소스로 관리한다. -- empty 상태에서는 Figma `290:9000`처럼 문구 아래에 `응원 남기기` capsule button을 표시한다. -- empty 상태의 `응원 남기기` button은 `gray/800` 배경, 100dp 수준 radius, 20dp icon, 16sp medium white text를 기준으로 한다. +- empty 상태에서는 Figma node `290:9001`처럼 문구 아래에 14dp 간격으로 `응원 남기기` capsule button을 표시한다. +- empty 상태의 `응원 남기기` button은 `gray/800`(`#343434`) 배경, 100dp 수준 radius, 20dp icon, icon-text 6dp gap, 16sp medium white text를 기준으로 한다. - empty 상태의 `응원 남기기` button 터치 액션은 후속 FanTalk 글쓰기 페이지 구현 후 연결한다. - 이번 범위에서는 empty 상태의 `응원 남기기` button 터치 시 실제 글쓰기 화면을 열지 않고 별도 API도 호출하지 않는다. @@ -269,7 +269,7 @@ FanTalk가 없으면 목록 대신 empty 상태를 표시한다. - 우측 액션 영역은 더보기 icon 또는 신고 text 중 하나만 표시한다. - popup 메뉴는 Figma처럼 원글 우측 액션 근처에 표시하고 `수정하기`, `삭제하기` 항목을 세로로 배치한다. - floating 글쓰기 버튼은 우측 하단 14dp margin 수준으로 표시하고 목록 스크롤과 독립적으로 유지한다. -- empty 상태는 Figma `290:9000`처럼 tab-bar 아래 black background 중앙에 empty 문구와 `응원 남기기` capsule button을 세로로 배치한다. +- empty 상태는 오디오/시리즈/커뮤니티 탭과 같은 상단 가시 영역 배치 패턴을 따른다. 별도 `minHeight`로 부모 높이를 늘리지 않고, tab content 상단 기준 48dp padding 아래에 empty 문구와 `응원 남기기` capsule button을 세로로 배치한다. ---