feat(web/hero): add view editorial CTA + skip entry on revisit#543
Merged
Conversation
홈 히어로 카드 클릭 시 모달처럼 가운데 확대만 되고 끝나던 문제를 해결한다. - focus 상태에서 카드 하단 바깥에 "View editorial" CTA 표시 (카드 회전을 상쇄해 항상 수평 유지). pointerdown 발생 위치를 ref로 기억해 GSAP Draggable의 onClick 콜백에서 navigate 분기 — React stopPropagation은 native bubble 단계보다 늦게 발화해 안전하지 않음. - MainHero가 마운트 시점의 sessionStorage(`hero-cover-seen`) 값을 기억해 skipEntry로 내려준다. 디테일에서 돌아온 같은 세션에서는 burst 진입 애니메이션을 건너뛰고 카드를 즉시 제자리에 두어 "셔플" 인상을 제거한다. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
홈 히어로 섹션에서 카드를 눌렀을 때 가운데로 확대만 되고 끝나는 문제 해결.
Why the CTA navigation needs special handling
GSAP Draggable은 native bubble 단계에서 카드 element에 직접 이벤트를 attach한다. React 합성 이벤트는 root에서 dispatch되어 native보다 늦게 발화하므로, Link 자체에 `stopPropagation`을 걸어도 Draggable의 `onClick` 콜백이 먼저 fire되어 focus toggle이 발생한다.
해결: CTA의 `onPointerDown`에서 `ctaPressedRef = true`를 세팅하고, Draggable `onClick` 콜백 안에서 이 ref를 보고 `router.push`로 분기. drag 발생 시 `onDrag`에서 ref를 리셋해 stale 상태 방지.
Test plan
🤖 Generated with Claude Code