Tintef / react-google-places-autocomplete

React Google Places Autocomplete input -- fully customizable
https://tintef.github.io/react-google-places-autocomplete
MIT License
376 stars 161 forks source link

window is not defined at geocodeByPlaceId #316

Closed diegogb-08 closed 1 year ago

diegogb-08 commented 1 year ago

I am using Remix.run and whenever I try to use geocodeByPlaceId I get the following error:

ReferenceError: window is not defined at exports.geocodeByPlaceId (/my-project/node_modules/react-google-places-autocomplete/src/utils/geocodeByPlaceId.ts:2:20) at action5 (/my-project/build/index.js:2376:183) at runMicrotasks (<anonymous>) at processTicksAndRejections (node:internal/process/task_queues:96:5) at Object.callRouteActionRR (/my-project/node_modules/@remix-run/server-runtime/dist/data.js:24:16) at callLoaderOrAction (/my-project/node_modules/@remix-run/router/router.ts:3061:14) at submit (/my-project/node_modules/@remix-run/router/router.ts:2568:16) at queryImpl (/my-project/node_modules/@remix-run/router/router.ts:2503:22) at Object.queryRoute (/my-project/node_modules/@remix-run/router/router.ts:2453:18) at handleDataRequestRR (/my-projectnode_modules/@remix-run/server-runtime/dist/server.js:81:20)

Here is the implementation in the action method:

export const action = async ({ request }: DataFunctionArgs) => {
  const { data, error } = await validator.validate(await request.formData())
  if (error) {
    return validationError(error)
  }

  const { placeId } = data

  let locationName: string = ''
  const location: Location = await geocodeByPlaceId(placeId)
    .then((results) => {
      locationName = results[0].formatted_address
      return getLatLng(results[0])
    })
    .then(({ lat, lng }) => {
      return {
        name: locationName,
        coordinates: [lng, lat],
        type: 'Point'
      }
    })

// Do something in the DB

return redirect('/events')
}

Is there a way to do this operation server side?

Tintef commented 1 year ago

I think you would need to use the API directly, not by loading it on the window 🤔

See the docs here