feat: 시설 후기 화면 2종을 게시글 디자인 언어로 통일 — 쇼츠형 상세·작성 문법 정리

[seizeh]

배경

게시글 상세/작성의 통일된 디자인 언어(쇼츠형 풀스크린, σ8 사본+마스크 블러, 댓글 바텀시트, 본문 탭 확장)를 시설(업체) 후기 화면 2종에 확장.

A. 후기 상세 (lib/screen/review_detail_screen.dart 재작성)

미디어 페이징

• 사진(≤5) + 영상(≤2)을 화면 전체 + 좌우 스와이프 PageView 로. 상단 중앙 1/N 인디케이터(2장 이상일 때만).
• 영상 페이지는 게시글 문법 그대로: 현재 페이지일 때만 자동재생·루프(페이지 전환 시 이전 영상 일시정지), 탭 = 재생/일시정지(일시정지 시에만 중앙 ▶), 최하단 얇은 진행바(스크럽 가능). 컨트롤러는 화면이 소유·해제.
• 미디어 없는 후기: 후기 카드의 블롭 배경 + 본문 센터 배치를 풀스크린으로(BlobHeroContent 재사용, 본문 탭 확장 포함).

하단 오버레이 (카드 미러 타이포)

• 상단 행: '업체 혜택 받고 작성한 후기' 배지(표시광고법 — 흰 필름 알약, 항상 노출) · 'N번째 방문' · '내 후기' 필 + 날짜.
• 별점(게시글 제목 자리) → 본문(2줄 말줄임 + 탭 확장, ExpandableOverlayText 공유 — 위 요소가 밀려 올라가고 블러 패널이 함께 위로 확장, 초과분 내부 스크롤) → 닉네임(탭 → 프로필) · 댓글 아이콘.
• 블러: 게시글과 동일한 MediaOverlayPanel(현재 페이지의 사진/영상 사본 σ8 + 세로 마스크 + 스크림). 블롭 후기는 카드처럼 블러 없이 스크림만.

전환·액션

• 기존 라우트 문법 유지(후기 그리드 타일 → CollapseRoute + CollapsibleView, 곡률 14). 축소 시 미디어가 타일(1:1) 상단 박스로 줄고(150ms) 패널·인디케이터·진행바는 페이드아웃(타일에 없는 요소) 후 실제 타일로 크로스페이드.
• 내 후기 삭제는 투명 앱바 오버레이 아이콘 유지. 딥링크 업체 모드 전환 제안 유지.

B. 댓글 바텀시트 공용화 (lib/widgets/comments_sheet.dart 신규)

• showCommentsSheet(키보드 배리어 off/복구) + CommentsSheetShell(그랩바·카운트 헤더·드래그 확장 리스트·입력바·포커스 중 시트 드래그 잠금·리스트 탭 키보드 닫기) 추출.
• 게시글 상세의 _CommentsSheet 를 셸 기반으로 전환(동작 동일), 후기 상세도 동일 셸 사용 — 후기 댓글(내 댓글 길게 눌러 삭제, 업체 얼굴 프로필)은 리스트 빌더로 주입, 열람은 게스트 허용·입력바는 로그인 시에만. 기존 인라인 댓글 섹션·하단 입력바 제거.

C. 후기 작성 (lib/screen/facility_review_screen.dart)

• 기능·서버 계약 그대로: add_facility_review 인자(별점·본문·사진≤5·영상≤2·has_incentive), 사진 자유 비율 다중(크롭 없음), 영상 uploadVideo 흐름, 카페 승격, own_facility 안내 모두 유지.
• 시각 문법만 게시글 작성과 통일: 앱바 '등록/수정' TextButton(스피너), 섹션 라벨·간격·타이포, 첨부 바텀시트(사진 '자유 비율·최대 5장' / 동영상 '최대 60초·100MB·2개', 한도 도달 시 비활성), 썸네일 76px + 업로드 스피너 + 삭제 X, 별점 Pressable 스프링 촉감, 대가성 체크는 선택 카드형(선택 시 색 채움·테두리 강조 — 게시글의 펫 선택 카드 문법)으로 더 잘 보이게.

공용화 정리

• MediaOverlayPanel·BlobHeroContent(post_media_hero), ExpandableOverlayText(post_card)를 공개로 전환해 후기 상세가 재사용 — 블러·본문 확장 구현이 단일 출처.

검증

• flutter analyze 새 이슈 0, dart format 적용
• flutter build ios --no-codesign --debug 성공

판단 사항

• 후기 상세의 축소 미러: 후기 타일은 정사각 그리드(오버레이 구조가 카드와 다름)라 게시글처럼 픽셀 미러 대신 "미디어 1:1 축소 + 부가 요소 페이드아웃 + 타일 크로스페이드"로 처리.
• 영상 페이지 블러 사본은 게시글과 동일하게 초기화 후 라이브 VideoPlayer 사본, 초기화 전엔 포스터.
• 댓글 시트 상태 갱신은 후기 화면의 로컬 상태라 ValueNotifier 리비전으로 셸에 전달(게시글은 기존 PostDetailState 그대로).

🤖 Generated with Claude Code