diff --git a/native/components/clearable-text-input.react.js b/native/components/clearable-text-input.react.js index 2017d056c..d4cf3ff84 100644 --- a/native/components/clearable-text-input.react.js +++ b/native/components/clearable-text-input.react.js @@ -1,93 +1,94 @@ // @flow import * as React from 'react'; import { TextInput as BaseTextInput, View, StyleSheet } from 'react-native'; import sleep from 'lib/utils/sleep.js'; import type { ClearableTextInputProps } from './clearable-text-input.js'; import TextInput from './text-input.react.js'; import { waitForInteractions } from '../utils/timers.js'; class ClearableTextInput extends React.PureComponent { textInput: ?React.ElementRef; lastMessageSent: ?string; queuedResolve: ?() => mixed; onChangeText: (inputText: string) => void = inputText => { let text; + const { lastMessageSent } = this; if ( - this.lastMessageSent && - this.lastMessageSent.length < inputText.length && - inputText.startsWith(this.lastMessageSent) + lastMessageSent && + lastMessageSent.length < inputText.length && + inputText.startsWith(lastMessageSent) ) { - text = inputText.substring(this.lastMessageSent.length); + text = inputText.substring(lastMessageSent.length); } else { text = inputText; this.lastMessageSent = null; } this.props.onChangeText(text); }; getValueAndReset(): Promise { this.props.onChangeText(''); // We are doing something very naughty here, which is that we are // constructing a fake nativeEvent. We are certainly not including all the // fields that the type is expected to have, which is why we need to // any-type it. We know this is okay because the code that uses // ClearableTextInput only accesses event.nativeEvent.selection const fakeSelectionEvent: any = { nativeEvent: { selection: { end: 0, start: 0 } }, }; this.props.onSelectionChange?.(fakeSelectionEvent); const { value } = this.props; this.lastMessageSent = value; if (this.textInput) { this.textInput.clear(); } return new Promise(resolve => { this.queuedResolve = async () => { await waitForInteractions(); await sleep(5); resolve(value); }; }); } componentDidUpdate(prevProps: ClearableTextInputProps) { if (!this.props.value && prevProps.value && this.queuedResolve) { const resolve = this.queuedResolve; this.queuedResolve = null; resolve(); } } render(): React.Node { const { textInputRef, ...props } = this.props; return ( ); } textInputRef: (textInput: ?React.ElementRef) => void = textInput => { this.textInput = textInput; this.props.textInputRef(textInput); }; } const styles = StyleSheet.create({ textInputContainer: { flex: 1, }, }); export default ClearableTextInput;