Update WalletTransactions.tsx

This commit is contained in:
Marcos Rodriguez Velez 2025-03-01 14:36:42 -04:00
parent e23f233f25
commit 05491387ff

View file

@ -1,4 +1,4 @@
import { RouteProp, useFocusEffect, useRoute } from '@react-navigation/native';
import { RouteProp, useFocusEffect, useRoute, useIsFocused } from '@react-navigation/native';
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import {
ActivityIndicator,
@ -80,6 +80,8 @@ const WalletTransactions: React.FC<WalletTransactionsProps> = ({ route }) => {
outputRange: [0, -HEADER_HEIGHT],
extrapolate: 'clamp',
});
const flatListRef = useRef<Animated.FlatList>(null);
const isFocused = useIsFocused();
const stylesHook = StyleSheet.create({
listHeaderText: {
@ -93,6 +95,21 @@ const WalletTransactions: React.FC<WalletTransactionsProps> = ({ route }) => {
}, [route, setOptions]),
);
// Reset header position when navigating away from screen
useFocusEffect(
useCallback(() => {
return () => {
// This will run when screen loses focus
scrollY.setValue(0);
// Reset FlatList scroll position to top
if (flatListRef.current) {
flatListRef.current.scrollToOffset({ offset: 0, animated: false });
}
setOptions(getWalletTransactionsOptions({ route }));
};
}, [scrollY, setOptions, route]),
);
const onBarCodeRead = useCallback(
(ret?: { data?: any }) => {
if (!isLoading) {
@ -421,7 +438,7 @@ const WalletTransactions: React.FC<WalletTransactionsProps> = ({ route }) => {
}, [wallet, wallet?.hideBalance, wallet?.preferredBalanceUnit, balance]);
const handleScroll = useCallback(
(event: any) => {
(event: any) => {
const offsetY = event.nativeEvent.contentOffset.y;
const combinedHeight = 180;
if (offsetY < combinedHeight) {
@ -491,6 +508,7 @@ const WalletTransactions: React.FC<WalletTransactionsProps> = ({ route }) => {
</View>
</Animated.View>
<Animated.FlatList<Transaction>
ref={flatListRef}
getItemLayout={getItemLayout}
updateCellsBatchingPeriod={30}
onEndReachedThreshold={0.3}