FaridSafi / react-native-google-places-autocomplete

Customizable Google Places autocomplete component for iOS and Android React-Native apps
MIT License
2k stars 848 forks source link

[FEATURE REQUEST] Add onPredictionsChanged to access the predictions returned by Google #796

Open avencat opened 2 years ago

avencat commented 2 years ago

Hi! πŸ‘‹

Firstly, thanks for your work on this project! πŸ™‚

Today I used patch-package to patch react-native-google-places-autocomplete@2.4.1 for the project I'm working on.

I wanted to be able to access to the results of the predictions so I could update my design accordingly.

Here is the diff that solved my problem:

diff --git a/node_modules/react-native-google-places-autocomplete/GooglePlacesAutocomplete.d.ts b/node_modules/react-native-google-places-autocomplete/GooglePlacesAutocomplete.d.ts
index 1fbd5f9..b9aca76 100644
--- a/node_modules/react-native-google-places-autocomplete/GooglePlacesAutocomplete.d.ts
+++ b/node_modules/react-native-google-places-autocomplete/GooglePlacesAutocomplete.d.ts
@@ -406,6 +406,7 @@ interface GooglePlacesAutocompleteProps {
   onNotFound?: () => void;
   onPress?: (data: GooglePlaceData, detail: GooglePlaceDetail | null) => void;
   onTimeout?: () => void;
+  onPredictionsChanged?: (predictions: GooglePlaceData[]) => void;
   placeholder: string;
   predefinedPlaces?: Place[];
   predefinedPlacesAlwaysVisible?: boolean;
diff --git a/node_modules/react-native-google-places-autocomplete/GooglePlacesAutocomplete.js b/node_modules/react-native-google-places-autocomplete/GooglePlacesAutocomplete.js
index cd03253..ac7f133 100644
--- a/node_modules/react-native-google-places-autocomplete/GooglePlacesAutocomplete.js
+++ b/node_modules/react-native-google-places-autocomplete/GooglePlacesAutocomplete.js
@@ -134,12 +134,20 @@ export const GooglePlacesAutocomplete = forwardRef((props, ref) => {
   };

   const [stateText, setStateText] = useState('');
-  const [dataSource, setDataSource] = useState(buildRowsFromResults([]));
+  const [dataSource, setDataSourceState] = useState(buildRowsFromResults([]));
   const [listViewDisplayed, setListViewDisplayed] = useState(
     props.listViewDisplayed === 'auto' ? false : props.listViewDisplayed,
   );
   const [url] = useState(getRequestUrl(props.requestUrl));

+  const setDataSource = (dataSource) => {
+    if (props.onPredictionsChanged) {
+      props.onPredictionsChanged(dataSource)
+    }
+
+    setDataSourceState(dataSource)
+  };
+
   const inputRef = useRef();

   useEffect(() => {

This issue body was partially generated by patch-package.

nornewman commented 2 years ago

Thanks @avencat I really think this should be added to the library!