diff --git a/src/components/OptionRow.js b/src/components/OptionRow.js index 225ef6054e64..c4ac6439fb83 100644 --- a/src/components/OptionRow.js +++ b/src/components/OptionRow.js @@ -160,7 +160,7 @@ class OptionRow extends Component { result = Promise.resolve(); } InteractionManager.runAfterInteractions(() => { - result.then(() => this.setState({isDisabled: this.props.isDisabled})); + result.finally(() => this.setState({isDisabled: this.props.isDisabled})); }); }} disabled={this.state.isDisabled} diff --git a/src/components/Pressable/GenericPressable/BaseGenericPressable.js b/src/components/Pressable/GenericPressable/BaseGenericPressable.js index 50c933823e63..6b9fa8654a29 100644 --- a/src/components/Pressable/GenericPressable/BaseGenericPressable.js +++ b/src/components/Pressable/GenericPressable/BaseGenericPressable.js @@ -1,4 +1,4 @@ -import React, {useCallback, useEffect, useMemo, forwardRef} from 'react'; +import React, {useCallback, useEffect, useState, useMemo, forwardRef} from 'react'; import {Pressable} from 'react-native'; import _ from 'underscore'; import Accessibility from '../../../libs/Accessibility'; @@ -63,6 +63,8 @@ const GenericPressable = forwardRef((props, ref) => { return props.disabled || shouldBeDisabledByScreenReader; }, [isScreenReaderActive, enableInScreenReaderStates, props.disabled]); + const [shouldUseDisabledCursor, setShouldUseDisabledCursor] = useState(isDisabled); + const onLongPressHandler = useCallback( (event) => { if (isDisabled) { @@ -112,6 +114,14 @@ const GenericPressable = forwardRef((props, ref) => { [onPressHandler], ); + useEffect(() => { + if (isDisabled) { + const timer = setTimeout(() => setShouldUseDisabledCursor(true), 1000); + return () => clearTimeout(timer); + } + setShouldUseDisabledCursor(false); + }, [isDisabled]); + useEffect(() => { if (!keyboardShortcut) { return () => {}; @@ -131,7 +141,7 @@ const GenericPressable = forwardRef((props, ref) => { onPressIn={!isDisabled ? onPressIn : undefined} onPressOut={!isDisabled ? onPressOut : undefined} style={(state) => [ - getCursorStyle(isDisabled, [props.accessibilityRole, props.role].includes('text')), + getCursorStyle(shouldUseDisabledCursor, [props.accessibilityRole, props.role].includes('text')), StyleUtils.parseStyleFromFunction(props.style, state), isScreenReaderActive && StyleUtils.parseStyleFromFunction(props.screenReaderActiveStyle, state), state.focused && StyleUtils.parseStyleFromFunction(props.focusStyle, state), diff --git a/src/components/Pressable/PressableWithFeedback.js b/src/components/Pressable/PressableWithFeedback.js index d113798e9c6e..20eb30d21ef6 100644 --- a/src/components/Pressable/PressableWithFeedback.js +++ b/src/components/Pressable/PressableWithFeedback.js @@ -46,9 +46,10 @@ const PressableWithFeedback = forwardRef((props, ref) => { setDisabled(props.disabled); return; } - onPress.then(() => { - setDisabled(props.disabled); - }); + onPress + .finally(() => { + setDisabled(props.disabled); + }); }); }} >