Merge pull request #6345 from developvsn/fix-tabpressing-addressinput

Fix : Pressing Tab button in AddressSearch inputs
Expensify · Nov 19, 2021 · 8293550 · 8293550
2 parents 1737897 + 7cc6588
commit 8293550
Showing 1 changed file with 15 additions and 0 deletions.
diff --git a/src/components/AddressSearch.js b/src/components/AddressSearch.js
@@ -41,6 +41,7 @@ const defaultProps = {
 const AddressSearch = (props) => {
     const googlePlacesRef = useRef();
     const [displayListViewBorder, setDisplayListViewBorder] = useState(false);
+    const [isSelected, setIsSelected] = useState(true);
     useEffect(() => {
         if (!googlePlacesRef.current) {
             return;
@@ -86,10 +87,17 @@ const AddressSearch = (props) => {
         <GooglePlacesAutocomplete
             ref={googlePlacesRef}
             fetchDetails
+            onBlur={() => {
+                if (isSelected) {
+                    return;
+                }
+                googlePlacesRef.current.setAddressText('');
+            }}
             suppressDefaultStyles
             enablePoweredByContainer={false}
             onPress={(data, details) => {
                 saveLocationDetails(details);
+                setIsSelected(true);
 
                 // After we select an option, we set displayListViewBorder to false to prevent UI flickering
                 setDisplayListViewBorder(false);
@@ -109,8 +117,15 @@ const AddressSearch = (props) => {
                 label: props.label,
                 containerStyles: props.containerStyles,
                 errorText: props.errorText,
+                onKeyPress: (event) => {
+                    if (event.key !== 'Tab' || isSelected) {
+                        return;
+                    }
+                    googlePlacesRef.current.setAddressText('');
+                },
                 onChangeText: (text) => {
                     const isTextValid = !_.isEmpty(text) && _.isEqual(text, props.value);
+                    setIsSelected(false);
 
                     // Ensure whether an address is selected already or has address value initialized.
                     if (!_.isEmpty(googlePlacesRef.current.getAddressText()) && !isTextValid) {