chore: development → main 동기화 및 Vercel 배포 파이프라인 구축 by Yeonny0723 · Pull Request #266 · pfplay/pfplay-web

Yeonny0723 · 2026-03-22T02:08:29Z

Summary

main 브랜치가 2023/02 이후 관리되지 않아 development 브랜치와 차이가 발생하였고,
이번 PR을 통해 main을 운영 브랜치로 재정비하고, Vercel 기반 배포 파이프라인을 구축하고자 합니다.

주요 변경사항

CI/CD

Vercel preview/production 배포 워크플로우 신규 구축

테스트

Jest → Vitest 전면 마이그레이션

기능

볼륨 컨트롤, 비디오 컨트롤 컴포넌트 추가
partyroom display board 대형 컴포넌트 분리
WebSocket 이벤트 타입 AsyncAPI 스펙 기반으로 재구성

버그 수정

1차 QA 목록 수정

Test plan

main 머지 후 Vercel production 배포 성공 확인
주요 페이지(partyroom, settings) 정상 동작 확인
*필요한 사전 작업: 소셜 로그인 이후 동작 테스트를 위해 Vercel custom domain (pfplay.xyz) 연결

- + TextButton이 icon만 받을 수 있도록 children 옵셔널 처리 - + 곡 검색 시 버벅이며 리스팅되는 문제 수정

- 나 강조 - 나 옆에 플레이리스트 변경 버튼 표시 - 대기 등록 버튼 대신 대기 등록 취소 버튼 표시

* refactor: zustand store를 provider로 제공하도록 변경 - RSC의 오용을 방지하기 위해 (pmndrs/zustand#2200) * refactor: 레이어간 의존성 방향 규칙을 지키기 위해 store context를 shared로 내림

… 나열 (#145) fix: DJ를 단순 index가 아닌 orderNumber 순으로 나열

* fix: 다이얼로그 내에서 Store 컨텍스트 사용 못하는 문제 * chore: 스토리북을 위한 MockStoreProvider 작성 * feat: 파티룸 전광판 스토어 연동 - 공지사항 제외 * feat: 파티룸 Playback, Deactivation, Aggregation 이벤트 핸들러 구현

* chore: useDidMountEffect >> useDidUpdateEffect 이름 적절하게 변경 * feat: 파티룸 멤버 랜덤 배치 컴포넌트 작성

- PlaylistTrack.linkId: number → string (유튜브 비디오 ID) - DjingQueue.isRegistered → registered (Swagger 필드명 일치) - getCrews 미사용 엔드포인트 및 관련 타입 삭제 - AvatarCompositionType enum 추가, PartyroomCrew·GetMyProfileSummaryResponse에 적용 - Avatar 컴포넌트 분기를 faceUri 존재 여부 → compositionType 기반으로 개선 - playlist-action.context removeTrack 파라미터 타입 수정 (linkId → trackId) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

DJ-004 추가, CACHE_MISS_SESSION(PTR-005) 제거, PTR 코드 재번호 부여 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

- partyroom enter/exit: /enter → /crews, /exit → DELETE /crews/me - DJ queue: /djs → /dj-queue, skip: POST → DELETE /playbacks/current - playlist mutation 응답: void(204)로 변경, 불필요한 응답 타입 제거 - MSW 핸들러 및 통합 테스트 14개 파일 갱신 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

discriminated union(success/failure) 제거 → 플랫 응답 타입으로 변경 response.success 분기 로직 제거, try/catch 기반으로 전환 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

- PartyroomEventType enum: 과거형 네이밍으로 통일 (PARTYROOM_CLOSED 등) - WebSocketEventBase 도입 (flat partyroomId, id, timestamp) - CrewAvatar 중첩 타입 도입, flattenCrewFromEvent 헬퍼 추가 - PARTYROOM_ACCESS → CREW_ENTERED/CREW_EXITED 분리 - PLAYBACK_SKIP 제거 (DELETE /playbacks/current로 대체) - Playback 타입에서 likeCount/dislikeCount/grabCount 제거 - 콜백 훅 13개 갱신, 테스트 12개 suite 갱신 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

PLAYBACK_STARTED, PLAYBACK_DEACTIVATED 핸들러에서 invalidateDjingQueue 호출을 제거하고, 사용처가 없어진 useInvalidateDjingQueue 유틸을 삭제한다. DJ 큐 상태 변경은 DJ_QUEUE_CHANGED 이벤트 핸들러가 유일한 진입점이 된다. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

MeHydration(SSR prefetch)이 쿠키 없이 요청하여 항상 401 실패하던 문제 해소. 개인 데이터는 클라이언트에서 직접 fetch하는 것이 적절하므로 제거한다. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

RootLayout에 있던 PartyroomConnectionProvider(useFetchMe 호출)를 parties/layout.tsx로 내려 인증 흐름(callback 등)에서 불필요한 Me fetch가 발생하지 않도록 한다. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

parseHtmlToReact가 HTML attrs를 React createElement에 그대로 전달하므로 React DOM 호환을 위해 className을 사용해야 한다. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

dynamic import 컴포넌트에 ref를 전달하면 forwardRef 경고가 발생한다. onReady 콜백에서 이미 playerRef를 설정하고 있으므로 ref prop은 불필요. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

useState 초기화 함수는 SSR에서도 실행되어 서버에서 STOMP 클라이언트가 생성되고 WebSocket 연결 시도 후 3000 (Unauthorized) 에러가 발생했다. 브라우저 환경에서만 인스턴스를 생성하도록 변경한다. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

WalletConnect가 SSR에서 WebSocket relay 연결을 시도하여 3000 (Unauthorized) 에러가 발생하던 문제 해소. 지갑 기능은 parties, settings 경로에서만 사용된다. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

DialogProvider가 RootLayout에 있어 다이얼로그 내용이 WalletProvider 바깥에서 렌더링되는 문제가 있었다. WalletProvider를 RootLayout으로 복원하고 wagmi의 ssr: true 옵션으로 SSR WebSocket 문제를 해결한다. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

- parties/layout: profileUpdated 미완료 시 하위 컴포넌트 마운트 차단 - SelectedAvatarStateProvider: useEffect dependency에서 selectedFacePos 제거하여 무한루프 해소 - PartyroomConnectionProvider: SSR에서 PartyroomClient 초기화 방지 (useRef + useEffect) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

ReactElement → ReactNode로 수정하여 Next.js layout children과 호환되도록 함 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

- vitest.config.ts, vitest.setup.ts 생성 - jest.config.js, jest.resolver.js, jest.setup.js, tsconfig.test.json 제거 - jest-msw-env.ts 커스텀 환경 제거 (Vitest jsdom이 fetch 네이티브 지원) - 199개 테스트 파일에서 jest.* → vi.* 일괄 치환 - eslint-plugin-jest → 제거 (eslint.config.js 정리) - Mock 타입을 글로벌 선언으로 제공 (types/vitest.d.ts) - 미사용 의존성 제거: jest, @swc/jest, jest-environment-jsdom, @types/jest, @types/jest-plugin-context, jest-plugin-context, given2 - 의존성 추가: vitest, @vitest/coverage-v8, jsdom - 201 파일, 999 테스트 전체 통과 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

tsc --noEmit 시 테스트 파일의 vitest 글로벌(describe, test, vi 등) 타입 인식을 위해 types에 vitest/globals를 추가하고, 기존 타입 에러가 있는 테스트 파일은 exclude로 복원 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

* chore: standalone 출력 모드 및 관련 스크립트 제거 Vercel 배포 전환으로 output: standalone 불필요 * chore: .vercel/project.json 커밋 및 gitignore 규칙 업데이트 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * ci: build-check를 vercel build 기반으로 교체 * ci: Vercel preview/production 배포 워크플로우 추가 * ci: VERCEL_TOKEN을 env 변수로 전달하여 보안 강화 * fix: build 스크립트에서 setup-standalone.sh 참조 제거 * fix: lint-check Node 버전을 20.19.0으로 업데이트 (jsdom@28 호환) * ci: 워크플로우 재트리거 --------- Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>

vercel · 2026-03-22T02:08:35Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
pfplay-web	Ready	Preview, Comment	Mar 22, 2026 2:40am

will-kim-querypie added 30 commits July 21, 2024 10:23

chore: 자잘한 변경들

8592533

feat(djing): 디제잉 등록을 위한 플레이리스트 선택 기능 작성

0726344

feat: djing을 위한 플리 선택 시 플리 드로워가 열리게 하기 위해 플리 드로워 상태를 글로벌 state로 변경

fc9a098

fix: 구독 제대로 안되는 문제 (destination 앞에 '/'가 붙어야 함)

71edd33

feat(socket): 변경된 하트비트 명세 반영

e287ce4

feat: 드로워를 다이얼로그 위에 띄우기 위해 portal 적용

7a32b38

refactor: useQuery의 select 옵션 활용하여 리턴 형상 단순화

afb7a92

feat: playlist 드로워 내 액션 다이얼로그들의 zIndex가 항상 드로워 zIndex보다 높도록 설정

992eb29

feat: DJ 모달 내 동작에 따라 playlist 드로워가 여닫히도록 설정

f25b56a

chore: UI 피그마 맞춰 수정

0877a72

feat(playlist): 기획 변경 따라 플레이리스트 뮤직 목록 리스팅을 아코디언에서 페이징 형식으로 변경

ed3596c

- + TextButton이 icon만 받을 수 있도록 children 옵셔널 처리 - + 곡 검색 시 버벅이며 리스팅되는 문제 수정

feat(playlist): interactable 대응

8a397f9

feat: 파티룸 api 최신 명세 반영

c5a0458

feat(shared/api): dj service 추가

36f65d9

feat: 파티룸 입 퇴장시 enter, exit 실행되도록 설정

c66ceec

feat: 디제잉 큐를 서버 상태로 변경하고 fetch 및 register API 적용

5a058a3

refactor: enter와 exit feature로 분리, react-query 적용

0822cd2

refactor: 스토어 구독 범위 제한

9baec83

feat: DJ 대기열에 '나'가 있을 때 예외 처리

79a1853

- 나 강조 - 나 옆에 플레이리스트 변경 버튼 표시 - 대기 등록 버튼 대신 대기 등록 취소 버튼 표시

refactor: MyPlaylist를 별도 위젯으로 분리

001b006

chore: 변경된 소켓 API 명세 반영

0902c77

refactor: 파티룸 destination 관련 로직 entities 내 config으로 이동

a393241

feat: 파티룸 이벤트 핸들러 뼈대 작성 및 연결

90b38eb

feat(shared/lib): 선언적으로 promise를 처리하기 위한 유틸 추가

ba7f6ba

chore: API 명세 맞춰 수정 (isPlaybackActivated >> playbackActivated)

f946588

feat: 파티룸 입/퇴장 시 파티 정보 업데이트/초기화 처리

d77a7e0

fix(widgets/partyroom-djing-dialog): DJ를 단순 index가 아닌 orderNumber 순으로…

bdbb77d

… 나열 (#145) fix: DJ를 단순 index가 아닌 orderNumber 순으로 나열

feat: 파티룸 멤버 랜덤 배치 컴포넌트 작성 (#143)

7f1a243

* chore: useDidMountEffect >> useDidUpdateEffect 이름 적절하게 변경 * feat: 파티룸 멤버 랜덤 배치 컴포넌트 작성

LivingLikeKrillin and others added 25 commits March 9, 2026 21:06

refactor: 에러 코드 enum을 백엔드 API 스펙에 맞게 정렬

cf89cff

DJ-004 추가, CACHE_MISS_SESSION(PTR-005) 제거, PTR 코드 재번호 부여 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

refactor: OAuth 인증 응답 타입을 단일 구조로 단순화

5cf46ea

discriminated union(success/failure) 제거 → 플랫 응답 타입으로 변경 response.success 분기 로직 제거, try/catch 기반으로 전환 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

fix: BoldProcessor의 class 속성을 className으로 수정

953d325

parseHtmlToReact가 HTML attrs를 React createElement에 그대로 전달하므로 React DOM 호환을 위해 className을 사용해야 한다. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

fix: DialogProvider children 타입을 ReactNode로 변경

eb5f93a

ReactElement → ReactNode로 수정하여 Next.js layout children과 호환되도록 함 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

feat: preference에 volume/muted 추가 및 ui-state에 cinema 뷰 상태 추가

4abbd86

feat: 볼륨 컨트롤, 비디오 컨트롤 컴포넌트 및 hover popup 훅 추가

b5b2dbb

refactor: partyroom display board 대형 컴포넌트 분리

c5c59e3

test: VolumeControl, CinemaFooter 테스트 추가

5b9e5ea

hotfix: 전광판 관련 신규 아이콘 svgr로 재생성

55bdd89

fix: vercel CLI v50 token 전달 방식 수정 (env → --token flag)

b76f894

fix: vercel production 워크플로우 token 전달 방식 수정 (env → --token flag)

a423e59

Yeonny0723 self-assigned this Mar 22, 2026

ci: vercel preview 수동 트리거 추가

63f7762

vercel bot deployed to Preview – pfplay-web March 22, 2026 02:40 View deployment

Yeonny0723 merged commit f4edf5a into main Mar 22, 2026
4 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

chore: development → main 동기화 및 Vercel 배포 파이프라인 구축#266

chore: development → main 동기화 및 Vercel 배포 파이프라인 구축#266
Yeonny0723 merged 720 commits intomainfrom
development

Yeonny0723 commented Mar 22, 2026 •

edited

Loading

Uh oh!

vercel bot commented Mar 22, 2026 •

edited

Loading

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Conversation

Yeonny0723 commented Mar 22, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

주요 변경사항

Test plan

Uh oh!

vercel bot commented Mar 22, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Yeonny0723 commented Mar 22, 2026 •

edited

Loading

vercel bot commented Mar 22, 2026 •

edited

Loading