Proyectos de Subversion LeadersLinked - SPA

import { useState, useEffect, useRef } from 'react'

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

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

    function handlePlaceSelect() {
        setAddressObject({})
        const addressPlace = autoComplete.getPlace()
        const formattedAddress = addressPlace.formatted_address
        const addressComponents = [
            ...addressPlace.address_components,
            {
                latitude: addressPlace.geometry.location.lat(),
                longitude: addressPlace.geometry.location.lng(),
                types: ['geometry'],
            },
        ]
        const address = {}

        if (formattedAddress) {
            setError(null)
            addressComponents?.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: formattedAddress })
        } else {
            setError('Ha ocurrido un error')
        }
    }

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

    return { address: addresObject, error, ref: inputRef }
}

export default useLocationAutocomplete