How to setState within panResponder's release event?

Question

Inside a class component, I have a panResponder and during the onPanResponderRelease event, I want to update the state of the class component. However, the state never gets updated after the setState is called.

type ExampleState = {
    duration: number
};

class Example extends Component<ExampleProps, ExampleState> {
    constructor(props: ExampleProps) {
        super(props);
        this.state = {
            duration: 0
        };

        this.setupPanResponder();
    }

    setupPanResponder = (): void => {
        this.panResponder = PanResponder.create({
            onPanResponderTerminationRequest: () => false,
            onStartShouldSetPanResponder: () => true,
            onPanResponderGrant: () => {
                // grant code here
            },
            onPanResponderMove: (event, gestureState) => {
                // move code here
            },
            onPanResponderRelease: () => {
                this.setState({ duration: 0 }); // does not seem to actually be setting the state
            }
        });
    };
}

Why is the setState not working? If I use setState inside another event, like onPanResponderMove, it does seem to work which is strange to me.