Added possibility to pass a function to filter suggestions

README.md

@@ -62,14 +62,15 @@ export default Component;
 1. Fork this repo
 2. Clone your fork
 3. Code 🤓
-4. Test your changes
+4. Run `npm install`
+5. Test your changes
 
     For this, I like to use [yalc](https://github.com/whitecolor/yalc), as it allows to emulate the process of using npm/yarn.
 
     1. Install [yalc](https://github.com/whitecolor/yalc)
     2. Build project with `yarn build` or `npm run build`
     3. Publish the package with yalc: `yalc publish`
-    4. Add the package to your test project `yalc add react-google-places-automocomplete`
+    4. Add the package to your test project `yalc add react-google-places-autocomplete`
     5. If needed, to update the package on your test project: `yalc update react-google-places-autocomplete`
 
 

package.json

@@ -1,10 +1,11 @@
 {
   "name": "react-google-places-autocomplete",
-  "version": "4.0.1",
+  "version": "4.0.6",
   "description": "Google places autocomplete input for ReactJS.",
   "main": "build/index.js",
   "module": "build/index.es.js",
   "scripts": {
+    "prepare": "npm run build",
     "build": "rollup -c",
     "postbuild": "node ./build-utils/postBuild",
     "lint": "eslint . --ext ts,tsx ."
@@ -51,7 +52,7 @@
   },
   "dependencies": {
     "@googlemaps/js-api-loader": "^1.14.3",
-    "@types/google.maps": "^3.50.4",
+    "@types/google.maps": "^3.53.4",
     "react-select": "^5.7.2",
     "use-debounce": "^3.4.3"
   },

src/google-places-autocomplete.tsx

@@ -22,6 +22,7 @@ const GooglePlacesAutocomplete: React.ForwardRefRenderFunction<GooglePlacesAutoc
     placesService,
     sessionToken,
     withSessionToken: args.withSessionToken ?? false,
+    suggestionsFilter: args.suggestionsFilter,
   });
 
   useImperativeHandle(ref, () => ({

src/helpers/autocompletion-request-builder.ts

@@ -5,7 +5,7 @@ export default (
   input: string,
   sessionToken?: google.maps.places.AutocompleteSessionToken,
 ): google.maps.places.AutocompletionRequest => {
-  const { bounds, location, ...rest } = autocompletionRequest;
+  const { locationRestriction, locationBias, locationBiasRadius, ...rest } = autocompletionRequest;
 
   const res: google.maps.places.AutocompletionRequest= {
     input,
@@ -16,12 +16,19 @@ export default (
     res.sessionToken = sessionToken;
   }
 
-  if (bounds) {
-    res.bounds = new google.maps.LatLngBounds(...bounds);
+  if (locationRestriction) {
+    res.locationRestriction = new google.maps.LatLngBounds(...locationRestriction);
   }
+
+  if (locationBias) {
 
-  if (location) {
-    res.location = new google.maps.LatLng(location);
+    if(!locationBiasRadius)
+      throw new Error('If you are defining a location bias, you must define the location bias radius');
+
+    res.locationBias = new google.maps.Circle({
+      radius: locationBiasRadius, 
+      center: new google.maps.LatLng(locationBias)
+    });
   }
 
   return res;

src/hooks/use-fetch-suggestions.ts

@@ -12,6 +12,7 @@ type UseFetchSuggestionsArg = {
   placesService?: google.maps.places.AutocompleteService;
   sessionToken?: google.maps.places.AutocompleteSessionToken;
   withSessionToken: boolean;
+  suggestionsFilter?: (suggestions: google.maps.places.AutocompletePrediction[]) => google.maps.places.AutocompletePrediction[];
 }
 
 const useFetchSuggestions = (arg: UseFetchSuggestionsArg): ((value: string, cb: CBType) => void) => {
@@ -22,6 +23,7 @@ const useFetchSuggestions = (arg: UseFetchSuggestionsArg): ((value: string, cb:
     placesService,
     sessionToken,
     withSessionToken,
+    suggestionsFilter,
   } = arg;
 
   const [fetchSuggestions] = useDebouncedCallback((value: string, cb: CBType): void => {
@@ -36,7 +38,9 @@ const useFetchSuggestions = (arg: UseFetchSuggestionsArg): ((value: string, cb:
         value,
         withSessionToken && sessionToken,
       ), (suggestions) => {
-        cb((suggestions || []).map(suggestion => ({ label: suggestion.description, value: suggestion })));
+        let filteredSuggestions = suggestions || [];
+        if(suggestionsFilter && suggestions) filteredSuggestions = suggestionsFilter(suggestions);
+        cb((filteredSuggestions).map(suggestion => ({ label: suggestion.description, value: suggestion })));
       },
     );
   }, debounce);

src/types.ts

@@ -13,9 +13,10 @@ export interface LatLng {
 }
 
 export interface AutocompletionRequest {
-  bounds?: [LatLng, LatLng];
+  locationRestriction?: [LatLng, LatLng];
   componentRestrictions?: { country: string | string[] };
-  location?: LatLng;
+  locationBias?: LatLng;
+  locationBiasRadius?: number;
   offset?: number;
   radius?: number;
   types?: string[];
@@ -35,4 +36,7 @@ export default interface GooglePlacesAutocompleteProps {
   onLoadFailed?: (error: Error) => void;
   selectProps?: AsyncProps<Option, false, GroupBase<Option>>;
   withSessionToken?: boolean;
+  suggestionsFilter?: (suggestions: google.maps.places.AutocompletePrediction[]) => google.maps.places.AutocompletePrediction[];
+  locationBias?: LatLng;
+  locationBiasRadius?: number;
 }

tsconfig.json

@@ -16,7 +16,6 @@
     "outDir": "build",
     "sourceMap": true,
     "strictNullChecks": true,
-    "suppressImplicitAnyIndexErrors": true,
     "target": "es5"
   },
   "include": ["src/**/*"],