Skip to content

Commit

Permalink
fix: re-create GestureDetector after freeze being enabled/disabled
Browse files Browse the repository at this point in the history
  • Loading branch information
kirillzyusko committed Jul 12, 2024
1 parent a600ac5 commit 3f7cd2a
Showing 1 changed file with 13 additions and 2 deletions.
15 changes: 13 additions & 2 deletions src/pages/home/report/ReportActionCompose/SendButton.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React, {memo} from 'react';
import React, {memo, useCallback, useState} from 'react';
import {View} from 'react-native';
import {Gesture, GestureDetector} from 'react-native-gesture-handler';
import Icon from '@components/Icon';
Expand All @@ -10,6 +10,7 @@ import useResponsiveLayout from '@hooks/useResponsiveLayout';
import useTheme from '@hooks/useTheme';
import useThemeStyles from '@hooks/useThemeStyles';
import CONST from '@src/CONST';
import {useFocusEffect} from '@react-navigation/native';

type SendButtonProps = {
/** Whether the button is disabled */
Expand All @@ -24,10 +25,18 @@ function SendButton({isDisabled: isDisabledProp, handleSendMessage}: SendButtonP
const styles = useThemeStyles();
const {translate} = useLocalize();
const {isSmallScreenWidth} = useResponsiveLayout();
const [uniqueRenderId, setUniqueRenderId] = useState(0);

const Tap = Gesture.Tap().onEnd(() => {
handleSendMessage();
});

useFocusEffect(
useCallback(() => {
setUniqueRenderId((c) => c + 1);
}, []),
);

return (
<View
style={styles.justifyContentEnd}
Expand All @@ -37,7 +46,9 @@ function SendButton({isDisabled: isDisabledProp, handleSendMessage}: SendButtonP
<GestureDetector
// A new GestureDetector instance must be created when switching from a large screen to a small screen
// if not, the GestureDetector may not function correctly.
key={`send-button-${isSmallScreenWidth ? 'small-screen' : 'normal-screen'}`}
// The same is applicable when parent enables/disables freeze - after that we need to re-create
// the gesture detector. Otherwise `onEnd` will not be
key={`send-button-${isSmallScreenWidth ? 'small-screen' : 'normal-screen'}-${uniqueRenderId}`}
gesture={Tap}
>
<Tooltip text={translate('common.send')}>
Expand Down

0 comments on commit 3f7cd2a

Please sign in to comment.