+ {visibleCards
+ .slice(1, 3)
+ .reverse()
+ .map((movie, reversedIdx) => {
+ const stackIdx = visibleCards.length <= 2 ? 1 : 2 - reversedIdx
+ const style = CARD_STYLES[stackIdx] ?? CARD_STYLES[2]
+
+ return (
+
+ {movie.poster_path && (
+
+ )}
+
+ )
+ })}
+
+ {currentMovie && !exitingCard && (
+
{
+ setShowHint(false)
+ startIdleTimer()
+ handleSwipe(dir, vel)
+ }}
+ onDirectionChange={(dir, progress) => {
+ if (dir) {
+ setShowHint(false)
+ if (idleTimerRef.current) clearTimeout(idleTimerRef.current)
+ }
+ handleDirectionChange(dir, progress)
+ }}
+ />
+ )}
+
+
+ {showHint && !exitingCard && !swipeDirection && (
+
+ )}
+
+
+
+ {exitingCard && (
+
+ )}
+
+
+
+ {swipeDirection && swipeProgress > 0.3 && !exitingCard && (
+
+ )}
+
+