Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 473 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |

import { useState, useEffect } from 'react'

const useLocationAutocomplete = ({
    inputRef,
}) => {
    const [addresObject, setAddressObject] = useState({})
    const [error, setError] = useState(null)
    let autoComplete

    function handleScriptLoad(input) {
        autoComplete = new window.google.maps.places.Autocomplete(
            input,
            { types: ['(cities)'] }
        )
        autoComplete.setFields([
            'address_components',
            'formatted_address',
            'geometry',
        ])
        autoComplete.addListener('place_changed', handlePlaceSelect)
    }

    function handlePlaceSelect() {
        const addressObject = autoComplete.getPlace()
        const query = addressObject.formatted_address
        const address = {}

        if (query) {
            setError(null)
            addresObject.address_components?.map((address_component) => {
                const address_component_name = address_component.long_name
                const address_component_type = address_component.types[0]

                switch (address_component_type) {
                    case "route":
                        address["address1"] = address_component_name
                        break
                    case "sublocality":
                        address["address2"] = address_component_name
                        break
                    case "locality":
                        address["city1"] = address_component_name
                        break
                    case "administrative_area_level_2":
                        address["city2"] = address_component_name
                        break
                    case "administrative_area_level_1":
                        address["state"] = address_component_name
                        break
                    case "country":
                        address["country"] = address_component_name
                        break
                    case "postal_code":
                        address["postal_code"] = address_component_name
                        break
                    case "geometry":
                        address["latitude"] = address_component.latitude
                        address["longitude"] = address_component.longitude
                        break
                    default:
                        break
                }
            })

            setAddressObject({ ...address, formatted_address: query })
        }
        else {
            setError('Ha ocurrido un error')
        }
    }

    useEffect(() => {
        handleScriptLoad(inputRef)
    }, [inputRef])

    return { ...addresObject, error }
}

export default useLocationAutocomplete