fix: carousel cards snap

This commit is contained in:
li0nd3v 2026-04-22 17:25:18 +02:00
parent 66cf16fba3
commit c98173471e
2 changed files with 15 additions and 4 deletions

View File

@ -540,7 +540,13 @@ const WalletsCarousel = forwardRef<FlatListRefType, WalletsCarouselProps>((props
} = props;
const { width } = useWindowDimensions();
const itemWidth = React.useMemo(() => (width * 0.82 > 375 ? 375 : width * 0.82), [width]);
const itemWidth = React.useMemo(() => Math.round(width * 0.82 > 375 ? 375 : width * 0.82), [width]);
const snapInterval = React.useMemo(() => itemWidth, [itemWidth]);
const snapOffsets = React.useMemo(() => {
if (!horizontal) return undefined;
const cardsCount = data.length + (onNewWalletPress ? 1 : 0);
return Array.from({ length: cardsCount }, (_, index) => index * snapInterval);
}, [horizontal, data.length, onNewWalletPress, snapInterval]);
const layoutTransition = useMemo(() => LinearTransition.duration(240).easing(Easing.inOut(Easing.quad)), []);
const enteringTransition = useMemo(() => FadeIn.duration(180), []);
const exitingTransition = useMemo(() => FadeOut.duration(150), []);
@ -858,9 +864,11 @@ const WalletsCarousel = forwardRef<FlatListRefType, WalletsCarouselProps>((props
extraData={[data, animateChanges, newWalletsMap.current, selectedWallet, lastAddedWalletId.current]}
keyExtractor={keyExtractor}
showsVerticalScrollIndicator={false}
pagingEnabled={horizontal}
pagingEnabled={false}
disableIntervalMomentum={horizontal}
snapToInterval={horizontal ? itemWidth - CARD_OVERLAP : undefined}
snapToInterval={undefined}
snapToOffsets={snapOffsets}
snapToAlignment={horizontal ? 'start' : undefined}
decelerationRate="fast"
contentContainerStyle={cStyles.content}
directionalLockEnabled

View File

@ -237,10 +237,13 @@ const WalletsList: React.FC = () => {
if (!isFocused) return;
const contentOffset = e.nativeEvent.contentOffset;
const index = Math.ceil(contentOffset.x / width);
const cardWidth = Math.round(width * 0.82 > 375 ? 375 : width * 0.82);
const snapStep = cardWidth; // keep in sync with WalletsCarousel snap interval
const index = Math.max(0, Math.round(contentOffset.x / snapStep));
if (currentWalletIndex.current !== index) {
console.debug('onSnapToItem', wallets.length === index ? 'NewWallet/Importing card' : index);
triggerHapticFeedback(HapticFeedbackTypes.Selection);
if (wallets[index] && (wallets[index].timeToRefreshBalance() || wallets[index].timeToRefreshTransaction())) {
refreshWallets(index, false, false);
}