The expected native behavior of scrollable components is to respond to events from navigation that will scroll to top when tapping on the active tab as you would expect from native tab bars. Works with react-native-navigation.

useScrollToTop.ts

import { useEffect, useRef } from 'react';
import { ScrollView } from 'react-native';
import { Navigation } from 'react-native-navigation';

const useScrollToTop = ({
    selectedTabIndex,
}: {
    selectedTabIndex: number;
}): React.RefObject<ScrollView> => {
    const scrollViewRef = useRef<ScrollView>(null);

    useEffect(() => {
        const subscription = Navigation.events().registerBottomTabSelectedListener(
            event => {
                if (
                    event.selectedTabIndex === selectedTabIndex &&
                    event.unselectedTabIndex === selectedTabIndex
                ) {
                    if (scrollViewRef && scrollViewRef.current) {
                        scrollViewRef.current.scrollTo({
                            x: 0,
                            y: 0,
                            animated: true,
                        });
                    }
                }
            },
        );

        return () => {
            subscription.remove();
        };
    }, [selectedTabIndex]);

    return scrollViewRef;
};

export default useScrollToTop;