diff --git a/src/components/Attachments/AttachmentCarousel/index.native.js b/src/components/Attachments/AttachmentCarousel/index.native.js index bd12020341be..bcea50698b3b 100644 --- a/src/components/Attachments/AttachmentCarousel/index.native.js +++ b/src/components/Attachments/AttachmentCarousel/index.native.js @@ -104,10 +104,10 @@ function AttachmentCarousel({report, reportActions, source, onNavigate, onClose, * @returns {JSX.Element} */ const renderItem = useCallback( - ({item}) => ( + ({item, isActive}) => ( setShouldShowArrows(!shouldShowArrows)} /> ), diff --git a/src/components/PDFView/PDFPasswordForm.js b/src/components/PDFView/PDFPasswordForm.js index 42d2202de8b7..58a4e64a28a5 100644 --- a/src/components/PDFView/PDFPasswordForm.js +++ b/src/components/PDFView/PDFPasswordForm.js @@ -50,6 +50,8 @@ function PDFPasswordForm({isFocused, isPasswordInvalid, shouldShowLoadingIndicat const [shouldShowForm, setShouldShowForm] = useState(false); const textInputRef = useRef(null); + const focusTimeoutRef = useRef(null); + const errorText = useMemo(() => { if (isPasswordInvalid) { return translate('attachmentView.passwordIncorrect'); @@ -67,7 +69,19 @@ function PDFPasswordForm({isFocused, isPasswordInvalid, shouldShowLoadingIndicat if (!textInputRef.current) { return; } - textInputRef.current.focus(); + /** + * We recommend using setTimeout to wait for the animation to finish and then focus on the input + * Relevant thread: https://expensify.slack.com/archives/C01GTK53T8Q/p1694660990479979 + */ + focusTimeoutRef.current = setTimeout(() => { + textInputRef.current.focus(); + }, CONST.ANIMATED_TRANSITION); + return () => { + if (!focusTimeoutRef.current) { + return; + } + clearTimeout(focusTimeoutRef.current); + }; }, [isFocused]); const updatePassword = (newPassword) => {