dpdpdndn 블로그

FE-15-app-wiring-flags-integration

NEW4 min read

[FE-15] 앱 와이어업·기능 플래그·전역 배지 통합

작업 내용 (설계 의도)

변경 사항

근거: 설계 문서 “라우팅·내비게이션 흐름”·“기능 플래그·점진 공개”. 공통 파일 단독 수정 — 마지막 wave 통합 티켓(Single Writer 보장).

이 티켓만 공통 파일(app/_layout.tsx·app/(tabs)/_layout.tsx)을 수정한다. 앞선 화면 티켓들은 자기 파일만 만졌다.

  • app/_layout.tsx: ThemeProvider(FE-01)와 ChatSocketProvider(FE-06, 있으면)로 앱 트리 래핑. 기존 QueryClientProvider·AuthGuard 유지. 신규 Stack.Screen 등록(communities, invite/[roomId], invitations).
  • app/(tabs)/_layout.tsx: 커뮤니티/채팅 진입점 정비 + 전역 안읽은 배지(useTotalUnread — useUnreadCounts 합산) 탭 아이콘 배지. 탭 활성색을 accent 토큰으로 치환(하드코딩 #007AFF 제거).
  • lib/feature-flags.ts(신규): chat.realtime.enabled/chat.community.enabled/chat.goods.enabled를 EXPO_PUBLIC_* 환경변수에서 읽는 단일 함수. 각 화면/훅이 이 함수로 게이트. chat.goods.enabled 플래그는 값 정의(노출)만 이 티켓 책임 — 이 플래그를 소비하는 FE-14(상품 채팅 CTA, 2단계/P1) 화면 완료를 기다리지 않는다. 이 티켓은 1단계 P0 wiring이므로 2단계 화면 티켓과 결합하지 않는다.
  • BE Release Scenario 정합: Phase 1 전부 OFF → Phase 2 realtime·community ON → Phase 3(2단계) goods ON.

기존 post 게시판 커뮤니티 탭((tabs)/community.tsx)은 유지 — 동아리는 별도 진입점(communities/). goods 채팅 진입점(FE-14)은 기존 product/[id] 라우트에 이미 등록돼 있어 이 티켓의 신규 라우트 등록 대상이 아니다 — FE-15는 goods 플래그 정의만 제공하고 FE-14와 파일·화면상 결합이 없다. 색 하드코딩 제거는 이 티켓이 만지는 공통 파일 범위 내에서만.

롤백: 모든 플래그 OFF → 실시간·커뮤니티·초대·goods 채팅 진입점 숨김, 기존 REST 채팅만 동작.

의존

  • FE-09, FE-10, FE-11, FE-12, FE-13 (1단계 화면)
  • (FE-14는 의존 아님 — goods는 chat.goods.enabled 플래그 게이팅일 뿐, 2단계 화면 완료를 기다리지 않는다)

다이어그램

클래스 의존

flowchart LR
    RootLayout[_layout] --> ThemeProvider
    RootLayout --> ChatSocketProvider
    RootLayout --> QueryClientProvider
    TabsLayout[tabs/_layout] --> useTotalUnread
    Screens --> featureFlags[feature-flags]
    Hooks --> featureFlags

테스트 케이스

  • 앱 루트가 ThemeProvider로 래핑되어 하위 화면이 테마 토큰을 소비한다
  • 전역 안읽은 수 합계가 탭 배지에 표시되고 0이면 배지가 없다
  • chat.community.enabled OFF면 커뮤니티/초대 진입점이 숨겨진다
  • chat.realtime.enabled OFF면 소켓 연결 없이 REST 채팅만 동작한다
  • 신규 라우트(communities/invite/invitations)가 정상 등록되어 내비게이션이 동작한다
  • 탭 활성색이 하드코딩이 아닌 accent 토큰으로 렌더된다

그래프 뷰