[feature] 대동제 공연시간표 페이지 및 탭/슬라이드 ab테스트추가#1518
Conversation
performances, festivalDate를 optional props로 추가해 다른 축제 페이지에서도 재사용 가능하도록 개선. 기존 IntroductionPage는 기본값으로 동작이 유지된다.
songs가 비어있을 때 '🎵 추후 공개 예정' 텍스트를 표시하고, chevron 아이콘 숨김 및 카드 클릭 비활성화 처리.
- /festival-busking 라우트 추가 - 날짜 네비게이션 A/B 실험 구현 (tabs vs arrows, 50:50) - framer-motion onPanEnd 기반 swipe 제스처 지원 - interaction: 'click' | 'swipe' 속성으로 Mixpanel 이벤트 구분 - performances가 없는 날짜는 탭에서 자동 제외 - 미사용 실험(mainBanner, applyButtonCopy) 제거
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Caution Review failedThe pull request is closed. Warning
|
| Layer / File(s) | Summary |
|---|---|
데이터 모델 frontend/src/pages/FestivalPage/data/performances.ts, frontend/src/pages/FestivalPage/data/buskingDays.ts |
Performance의 clubName을 name으로 변경하고 FestivalDay 타입 및 4일치 BUSKING_DAYS 상수를 추가합니다. |
추적 이벤트 frontend/src/constants/eventName.ts |
버스킹 페이지 조회(PAGE_VIEW) 및 일자 변경·체류 시간(USER_EVENT) 상수를 추가합니다. |
A/B 테스트 frontend/src/experiments/definitions.ts |
festival_timetable_nav_v1을 추가(variants: tabs/arrows, 50:50)하고 이전 두 실험을 제거합니다. |
페이지 스타일 frontend/src/pages/FestivalPage/BuskingPage/BuskingPage.styles.ts |
Container, NavWrapper, TimetableSection/Header/Date/Location, SectionLabel 등 스타일 컴포넌트를 추가합니다. |
Tabs 네비게이션 frontend/src/pages/FestivalPage/components/DayTabsNav/DayTabsNav.tsx |
UnderlineTabs 래퍼로 day 탭 네비게이션을 구현합니다. |
Arrows 네비게이션 frontend/src/pages/FestivalPage/components/DayArrowsNav/* |
이전/다음 화살표와 중앙 레이블 버튼 네비게이션을 구현하고 관련 스타일을 추가합니다. |
BuskingPage 컴포넌트 frontend/src/pages/FestivalPage/BuskingPage/BuskingPage.tsx |
availableDays 필터, 초기 activeDay 결정(오늘 우선), Mixpanel 추적(페이지뷰/일자 변경/체류시간), onPanEnd 스와이프 처리, 탭/화살표 분기 렌더링, 클럽/메인 스테이지 두 섹션 렌더링을 구현합니다. |
Performance 컴포넌트 수정 frontend/src/pages/FestivalPage/components/PerformanceCard/PerformanceCard.tsx |
hideSongs?: boolean 추가, hasSongs로 상호작용·chevron·곡 목록 조건부 렌더링, 제목에 performance.name 사용으로 변경합니다. |
PerformanceList 파라미터화 frontend/src/pages/FestivalPage/components/PerformanceList/PerformanceList.tsx |
performances, festivalDate, hideSongs를 props로 받도록 변경하고 날짜 비교 로직을 파라미터화합니다. |
라우팅 / 문서 frontend/src/routes/AppRoutes.tsx, frontend/docs/features/festival/busking-timetable.md |
/festival-busking 라우트를 추가하고 페이지 구조·실험·추적·데이터 규칙을 문서화합니다. |
Filter 통합 frontend/src/components/common/Filter/Filter.tsx |
웹·웹뷰 필터 옵션에 '대동제' 항목을 추가하여 해당 경로로 이동할 수 있게 하고 sessionStorage로 dot 상태를 관리합니다. |
Popup 리팩터 frontend/src/pages/MainPage/components/Popup/*, frontend/src/utils/popupUtils.ts, frontend/src/pages/MainPage/components/Popup/popupConfigs.ts |
Popup를 PopupConfig[] 기반으로 리팩터: PopupConfig 타입·isPopupHidden 유틸 추가, APP_DOWNLOAD_POPUP/DAEDONG_POPUP 구성 추가, Popup 컴포넌트/스토리/테스트 갱신. |
MainPage / Webview 통합 frontend/src/pages/MainPage/MainPage.tsx, frontend/src/pages/WebviewMainPage/WebviewMainPage.tsx |
MainPage/WebviewMainPage에서 DAEDONG_POPUP 구성 전달하여 Popup 렌더링; 관련 스토리/테스트/스타일 조정. |
Sequence Diagram(s)
sequenceDiagram
participant User
participant BuskingPage
participant Experiment
participant PerformanceList
participant Mixpanel
User->>BuskingPage: 페이지 진입
BuskingPage->>Mixpanel: PAGE_VIEW: DAEDONG2026_BUSKING_PAGE
BuskingPage->>Experiment: 네비게이션 변형 조회
Experiment-->>BuskingPage: tabs/arrows
BuskingPage->>PerformanceList: activeDay 전달 (클럽/메인 스테이지)
User->>BuskingPage: 탭/화살표/스와이프로 일자 변경
BuskingPage->>Mixpanel: USER_EVENT: DAEDONG2026_DAY_CHANGED (from_day,to_day,interaction)
BuskingPage->>Mixpanel: USER_EVENT: DAEDONG2026_DAY_DURATION (day,duration_seconds,nav_variant)
BuskingPage->>PerformanceList: 새 일자 데이터 렌더
Estimated code review effort
🎯 3 (Moderate) | ⏱️ ~25 minutes
Possibly related PRs
- Moadong/moadong#1301: Popup 구현 및 추적 상수 관련 변경이 겹칩니다.
- Moadong/moadong#1041: Popup visibility/session 로직(세션/로컬 스토리지) 관련하여 코드 수준 충돌 가능성이 있습니다.
- Moadong/moadong#1519: DAEDONG_POPUP 및 Popup configs/통합 관련 변경과 직접적으로 연관됩니다.
Suggested labels
🔨 Refactor
Suggested reviewers
- lepitaaar
- suhyun113
- oesnuj
🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
| Check name | Status | Explanation |
|---|---|---|
| Description Check | ✅ Passed | Check skipped - CodeRabbit’s high-level summary is enabled. |
| Title check | ✅ Passed | PR 제목은 변경 사항의 핵심을 명확히 반영하고 있으며, 새로운 대동제 공연시간표 페이지와 탭/슬라이드 A/B 테스트 추가라는 주요 변경 내용을 간결하게 설명합니다. |
| Docstring Coverage | ✅ Passed | No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. |
| Linked Issues check | ✅ Passed | Check skipped because no linked issues were found for this pull request. |
| Out of Scope Changes check | ✅ Passed | Check skipped because no linked issues were found for this pull request. |
✏️ Tip: You can configure your own custom pre-merge checks in the settings.
✨ Finishing Touches
📝 Generate docstrings
- Create stacked PR
- Commit on current branch
🧪 Generate unit tests (beta)
- Create PR with unit tests
- Commit unit tests in branch
feature/#1517-performance-schedule-page-MOA-835
Tip
💬 Introducing Slack Agent: The best way for teams to turn conversations into code.
Slack Agent is built on CodeRabbit's deep understanding of your code, so your team can collaborate across the entire SDLC without losing context.
- Generate code and open pull requests
- Plan features and break down work
- Investigate incidents and troubleshoot customer tickets together
- Automate recurring tasks and respond to alerts with triggers
- Summarize progress and report instantly
Built for teams:
- Shared memory across your entire org—no repeating context
- Per-thread sandboxes to safely plan and execute work
- Governance built-in—scoped access, auditability, and budget controls
One agent for your entire SDLC. Right inside Slack.
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.
Comment @coderabbitai help to get the list of available commands and usage tips.
🎨 UI 변경사항을 확인해주세요
13개 스토리 변경 · 전체 56개 스토리 · 22개 컴포넌트 |
There was a problem hiding this comment.
Actionable comments posted: 3
🧹 Nitpick comments (6)
frontend/src/pages/FestivalPage/components/DayTabsNav/DayTabsNav.tsx (1)
2-2: ⚡ Quick win
FestivalDayimport 경로를 alias로 바꿔주세요.상대경로 대신
@/*를 사용해 파일 이동 시 경로 깨짐을 줄이는 게 좋습니다.경로 통일 예시
-import type { FestivalDay } from '../../data/buskingDays'; +import type { FestivalDay } from '@/pages/FestivalPage/data/buskingDays';As per coding guidelines, "Use path alias
@/*to import fromsrc/*in all TypeScript files".🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@frontend/src/pages/FestivalPage/components/DayTabsNav/DayTabsNav.tsx` at line 2, The import in DayTabsNav.tsx currently uses a relative path for the FestivalDay type; change the import for FestivalDay to use the path alias from src (e.g. import type { FestivalDay } from '@/pages/FestivalPage/components/data/buskingDays' or the correct '@/...' path matching your project structure) so the FestivalDay type is imported via the `@/`* alias instead of a relative path; update the import statement that references FestivalDay accordingly to maintain consistent alias usage across TypeScript files.frontend/src/pages/FestivalPage/components/PerformanceList/PerformanceList.tsx (1)
3-4: ⚡ Quick win
performances관련 import를 alias 기반으로 바꿔주세요.상대경로 import가 늘어나면 리팩토링 시 경로 변경 비용이 커집니다.
경로 통일 예시
-import type { Performance } from '../../data/performances'; -import { performances as defaultPerformances } from '../../data/performances'; +import type { Performance } from '@/pages/FestivalPage/data/performances'; +import { performances as defaultPerformances } from '@/pages/FestivalPage/data/performances';As per coding guidelines, "Use path alias
@/*to import fromsrc/*in all TypeScript files".🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@frontend/src/pages/FestivalPage/components/PerformanceList/PerformanceList.tsx` around lines 3 - 4, The imports for Performance and performances should use the project path alias instead of relative paths; update the two import statements that reference '../../data/performances' so they import from '@/pages/FestivalPage/data/performances' (or the correct alias path that maps to the original module) and keep the same imported symbols (Performance and performances as defaultPerformances) so usages of Performance and defaultPerformances in PerformanceList.tsx remain unchanged.frontend/src/pages/FestivalPage/components/DayArrowsNav/DayArrowsNav.tsx (1)
1-1: ⚡ Quick win여기도 import alias 규칙으로 맞춰주세요.
신규 컴포넌트에서
@/*별칭을 사용하면 전체 경로 규칙이 일관됩니다.경로 통일 예시
-import type { FestivalDay } from '../../data/buskingDays'; +import type { FestivalDay } from '@/pages/FestivalPage/data/buskingDays';As per coding guidelines, "Use path alias
@/*to import fromsrc/*in all TypeScript files".🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@frontend/src/pages/FestivalPage/components/DayArrowsNav/DayArrowsNav.tsx` at line 1, The import in DayArrowsNav.tsx uses a relative path; update it to use the project path alias so imports follow the '@/...' convention. Replace the relative import of FestivalDay (currently "import type { FestivalDay } from '../../data/buskingDays'") with the equivalent alias import using "@/.../data/buskingDays" (keeping the FestivalDay type name) so the component DayArrowsNav follows the path-alias rule.frontend/src/pages/FestivalPage/data/buskingDays.ts (1)
1-1: ⚡ Quick win상대 경로 import 대신
@/*별칭으로 통일해주세요.신규 파일에서도 alias 규칙을 맞추면 경로 유지보수가 쉬워집니다.
경로 통일 예시
-import type { Performance } from './performances'; +import type { Performance } from '@/pages/FestivalPage/data/performances';As per coding guidelines, "Use path alias
@/*to import fromsrc/*in all TypeScript files".🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@frontend/src/pages/FestivalPage/data/buskingDays.ts` at line 1, Replace the relative import of the Performance type in this module—currently "import type { Performance } from './performances';"—with the project path-alias form that starts with "@/". Update the import to use the alias (keeping the same exported symbol Performance) so the file follows the "Use path alias `@/*`" guideline and future renames/moves are easier to maintain.frontend/src/pages/FestivalPage/BuskingPage/BuskingPage.tsx (2)
105-111: 💤 Low valueSWIPE_THRESHOLD를 상수로 추출하는 것을 고려하세요.
매직 넘버 50을 파일 상단의 상수로 추출하면 가독성과 유지보수성이 향상됩니다.
♻️ 제안하는 개선 방안
+const SWIPE_THRESHOLD = 50; + const BuskingPage = () => { // ... <motion.div onPanEnd={(_, info) => { - const SWIPE_THRESHOLD = 50; if (info.offset.x < -SWIPE_THRESHOLD) handleSwipe('left'); else if (info.offset.x > SWIPE_THRESHOLD) handleSwipe('right'); }} >🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@frontend/src/pages/FestivalPage/BuskingPage/BuskingPage.tsx` around lines 105 - 111, Extract the magic number 50 used in the onPanEnd handler of the BuskingPage component into a top-level constant (e.g., SWIPE_THRESHOLD) at the top of the file; update the motion.div onPanEnd logic to reference that constant instead of the literal so handleSwipe('left') / handleSwipe('right') use the named threshold for improved readability and maintainability.
44-54: ⚡ Quick wincleanup 효과의 의존성 배열 검토가 필요합니다.
빈 의존성 배열로 인해
trackEvent와navVariant가 초기 렌더링 시점의 값으로 고정됩니다. 일반적으로 이러한 값들은 변경되지 않지만, 의존성 배열에 명시적으로 포함하거나 ref 패턴을 사용하는 것이 더 안전합니다.♻️ 제안하는 개선 방안
useEffect(() => { return () => { const duration = Date.now() - dayStartTime.current; trackEvent(USER_EVENT.DAEDONG2026_DAY_DURATION, { day: activeDayIdRef.current, nav_variant: navVariant, duration, duration_seconds: Math.round(duration / 1000), }); }; - }, []); + }, [trackEvent, navVariant]);🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@frontend/src/pages/FestivalPage/BuskingPage/BuskingPage.tsx` around lines 44 - 54, The cleanup effect captures stale values because useEffect has an empty dependency array; update the code so the cleanup uses stable refs instead of closed-over variables: create refs (e.g., navVariantRef and trackEventRef), update navVariantRef.current = navVariant and trackEventRef.current = trackEvent in a short effect or inside the component render, and then read navVariantRef.current and trackEventRef.current in the useEffect cleanup (which can remain with an empty dependency array) when computing duration with dayStartTime.current and activeDayIdRef.current and calling trackEvent(USER_EVENT.DAEDONG2026_DAY_DURATION, ...). This preserves the unmount-only behavior while ensuring the cleanup uses the latest navVariant and trackEvent.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/docs/features/festival/busking-timetable.md`:
- Around line 11-17: The fenced code block describing the component tree
(BuskingPage, DayTabsNav, DayArrowsNav, PerformanceList, TimelineRow,
PerformanceCard) lacks a language identifier; update the markdown by adding a
language tag like ```text or ```plaintext right after the opening fence so the
linter stops flagging it—e.g., change ``` to ```text and keep the existing
indentation and content intact.
In `@frontend/src/pages/FestivalPage/BuskingPage/BuskingPage.tsx`:
- Around line 19-27: The getInitialDayId function builds todayStr manually;
switch it to use date-fns by importing format from 'date-fns' and replace the
manual construction with format(new Date(), 'yyyy-MM-dd') inside getInitialDayId
so availableDays.find((d) => d.date === todayStr)?.id logic remains the same;
keep the existing fallback to availableDays[0]?.id and BUSKING_DAYS[0].id.
In `@frontend/src/pages/FestivalPage/components/DayArrowsNav/DayArrowsNav.tsx`:
- Around line 11-29: The component DayArrowsNav currently assumes activeDayId
exists and days is non-empty; guard against days.length === 0 and currentIndex
=== -1 before using activeDay or indexing neighbors. In the DayArrowsNav
component compute currentIndex as you do, then if days.length === 0 or
currentIndex === -1 render a safe fallback: disable both Styled.ArrowButton
controls, avoid calling onChange with undefined indices, and render a default
label (e.g., "날짜 없음") instead of activeDay.fullDateLabel; ensure onClick
handlers only reference days[currentIndex ± 1].id after verifying those indices
are in range.
---
Nitpick comments:
In `@frontend/src/pages/FestivalPage/BuskingPage/BuskingPage.tsx`:
- Around line 105-111: Extract the magic number 50 used in the onPanEnd handler
of the BuskingPage component into a top-level constant (e.g., SWIPE_THRESHOLD)
at the top of the file; update the motion.div onPanEnd logic to reference that
constant instead of the literal so handleSwipe('left') / handleSwipe('right')
use the named threshold for improved readability and maintainability.
- Around line 44-54: The cleanup effect captures stale values because useEffect
has an empty dependency array; update the code so the cleanup uses stable refs
instead of closed-over variables: create refs (e.g., navVariantRef and
trackEventRef), update navVariantRef.current = navVariant and
trackEventRef.current = trackEvent in a short effect or inside the component
render, and then read navVariantRef.current and trackEventRef.current in the
useEffect cleanup (which can remain with an empty dependency array) when
computing duration with dayStartTime.current and activeDayIdRef.current and
calling trackEvent(USER_EVENT.DAEDONG2026_DAY_DURATION, ...). This preserves the
unmount-only behavior while ensuring the cleanup uses the latest navVariant and
trackEvent.
In `@frontend/src/pages/FestivalPage/components/DayArrowsNav/DayArrowsNav.tsx`:
- Line 1: The import in DayArrowsNav.tsx uses a relative path; update it to use
the project path alias so imports follow the '@/...' convention. Replace the
relative import of FestivalDay (currently "import type { FestivalDay } from
'../../data/buskingDays'") with the equivalent alias import using
"@/.../data/buskingDays" (keeping the FestivalDay type name) so the component
DayArrowsNav follows the path-alias rule.
In `@frontend/src/pages/FestivalPage/components/DayTabsNav/DayTabsNav.tsx`:
- Line 2: The import in DayTabsNav.tsx currently uses a relative path for the
FestivalDay type; change the import for FestivalDay to use the path alias from
src (e.g. import type { FestivalDay } from
'@/pages/FestivalPage/components/data/buskingDays' or the correct '@/...' path
matching your project structure) so the FestivalDay type is imported via the `@/`*
alias instead of a relative path; update the import statement that references
FestivalDay accordingly to maintain consistent alias usage across TypeScript
files.
In
`@frontend/src/pages/FestivalPage/components/PerformanceList/PerformanceList.tsx`:
- Around line 3-4: The imports for Performance and performances should use the
project path alias instead of relative paths; update the two import statements
that reference '../../data/performances' so they import from
'@/pages/FestivalPage/data/performances' (or the correct alias path that maps to
the original module) and keep the same imported symbols (Performance and
performances as defaultPerformances) so usages of Performance and
defaultPerformances in PerformanceList.tsx remain unchanged.
In `@frontend/src/pages/FestivalPage/data/buskingDays.ts`:
- Line 1: Replace the relative import of the Performance type in this
module—currently "import type { Performance } from './performances';"—with the
project path-alias form that starts with "@/". Update the import to use the
alias (keeping the same exported symbol Performance) so the file follows the
"Use path alias `@/*`" guideline and future renames/moves are easier to
maintain.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: ab539fb3-7dcd-402d-bd64-17fec89064b3
📒 Files selected for processing (12)
frontend/docs/features/festival/busking-timetable.mdfrontend/src/constants/eventName.tsfrontend/src/experiments/definitions.tsfrontend/src/pages/FestivalPage/BuskingPage/BuskingPage.styles.tsfrontend/src/pages/FestivalPage/BuskingPage/BuskingPage.tsxfrontend/src/pages/FestivalPage/components/DayArrowsNav/DayArrowsNav.styles.tsfrontend/src/pages/FestivalPage/components/DayArrowsNav/DayArrowsNav.tsxfrontend/src/pages/FestivalPage/components/DayTabsNav/DayTabsNav.tsxfrontend/src/pages/FestivalPage/components/PerformanceCard/PerformanceCard.tsxfrontend/src/pages/FestivalPage/components/PerformanceList/PerformanceList.tsxfrontend/src/pages/FestivalPage/data/buskingDays.tsfrontend/src/routes/AppRoutes.tsx
- FestivalDay에 mainStagePerformances 추가 (Day1~4 아티스트 라인업) - 동아리/아티스트 섹션 구분선(SectionLabel) 렌더링 - PerformanceCard/List에 hideSongs prop 추가 (아티스트 카드 곡목 숨김) - Performance.clubName → name 리팩토링
- Filter에 대동제 칩 추가 (/festival-busking, /webview/festival-busking) - BuskingPage에 Filter 렌더링 (홍보 알림 dot 동적 처리) - Filter 추가로 인한 상단 여백 조정
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/pages/FestivalPage/BuskingPage/BuskingPage.tsx`:
- Line 45: The lookup for activeDay using BUSKING_DAYS.find((d) => d.id ===
activeDayId) uses a non-null assertion which can crash if not found; change this
to a safe guard by checking the result and providing a fallback (e.g., const
activeDay = BUSKING_DAYS.find(d => d.id === activeDayId) ?? BUSKING_DAYS[0] or
handle the null case explicitly with a default object or early return), updating
any code that assumes activeDay to handle the fallback path; reference
identifiers: activeDay, BUSKING_DAYS, activeDayId in BuskingPage.tsx.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 358afc4d-2adb-4823-b21a-3b501a1497a5
📒 Files selected for processing (6)
frontend/src/components/common/Filter/Filter.tsxfrontend/src/constants/eventName.tsfrontend/src/pages/FestivalPage/BuskingPage/BuskingPage.styles.tsfrontend/src/pages/FestivalPage/BuskingPage/BuskingPage.tsxfrontend/src/pages/FestivalPage/components/DayArrowsNav/DayArrowsNav.tsxfrontend/src/pages/FestivalPage/data/buskingDays.ts
✅ Files skipped from review due to trivial changes (1)
- frontend/src/constants/eventName.ts
🚧 Files skipped from review as they are similar to previous changes (1)
- frontend/src/pages/FestivalPage/data/buskingDays.ts
- PopupConfig 인터페이스 도입으로 팝업별 storageKey/sessionKey/daysToHide 분리 - configs: PopupConfig[] prop으로 첫 번째 eligible 팝업 자동 표시 - onImageClick에 trackEvent 주입하여 팝업별 트래킹 로직 자체 정의 가능 - isPopupHidden/DAYS_TO_HIDE를 src/utils/popupUtils.ts로 추출 - popupConfigs.ts에 APP_DOWNLOAD_POPUP config 분리 - daysToHide: 0 설정 시 항상 표시되는 버그 수정
- isPopupHidden(config) 시그니처에 맞게 mock config 도입 - sessionStorage 초기화 및 sessionKey 관련 테스트 케이스 추가 - daysToHide: 0 엣지 케이스 테스트 추가
- PopupConfig에 to?: string 필드 추가 - Popup 컴포넌트에 useNavigate 연결, 이미지 클릭 시 React Router로 이동
- DAEDONG_POPUP 추가 (이미지 클릭 시 /festival-busking 이동) - MainPage를 DAEDONG_POPUP으로 교체 (축제 기간 임시)
suhyun113
left a comment
There was a problem hiding this comment.
기존 컴포턴트를 공통화한 리팩토링이 깔끔하고, A/B 실험 설계도 Mixpanel 이벤트 속성이 잘 설계되어있는 것 같아요! 빠른 추가 좋습니다!!
PopupConfig 기반 리팩터 과정에서 누락된 MAIN_POPUP_NOT_SHOWN 이벤트 트래킹을 복구. eligible한 팝업이 없을 때 해당 이벤트를 전송.
[feature] 대동제 팝업 추가 및 팝업 로직 개선
sessionStorage를 활용해 대동제 필터 칩의 dot을 세션 내 최초 방문 시 표시하고, 클릭 시 사라지도록 Filter 컴포넌트 내부에서 자체 관리
- WebviewMainPage에 DAEDONG_POPUP 추가 (대동제 종료 후 제거 예정) - PopupImage에 scale(1.1) 적용으로 이미지 내 흰 여백 크롭 처리
#️⃣연관된 이슈
📝작업 내용
/festival-busking라우트에 2026 대동제 버스킹 시간표 페이지 신규 구현tabsvsarrows, 50:50) 도입 대동제 AB테스트 문서PerformanceList공통화 및PerformanceCard곡 미공개 상태 처리feat
BuskingPage— 4일치 버스킹 시간표 페이지 (/festival-busking)DayTabsNav— Variant A: UnderlineTabs로 날짜 4개 탭DayArrowsNav— Variant B: ‹ › 화살표 날짜 네비게이션buskingDays.ts— 4일치 공연 데이터 (2일차~4일차 곡 목록 포함)framer-motion onPanEnd),interaction: 'click' | 'swipe'이벤트 구분festivalTimetableNavExperimentA/B 실험 추가, 미사용 실험 2개 제거DAEDONG2026_DAY_CHANGED,DAEDONG2026_DAY_DURATION)대동제필터칩 추가 및 라우팅 적용refactor
PerformanceList—performances,festivalDate를 optional props로 추가해 재사용 가능하도록 개선 (기존IntroductionPage동작 유지)fix
PerformanceCard—songs: []일 때 "🎵 추후 공개 예정" 표시, chevron 숨김, 클릭 비활성화중점적으로 리뷰받고 싶은 부분(선택)
논의하고 싶은 부분(선택)
🫡 참고사항
Summary by CodeRabbit
새로운 기능
동작/UI 변경
분석(트래킹)
문서