Proyectos de Subversion LeadersLinked - SPA

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 = {}

        console.log(query, addressObject)

        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
                }
            })

            console.log(address)

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

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

    return { ...addresObject, error }
}

export default useLocationAutocomplete