I'm doing a push to the array with the data, but when I set the array to the state I got several objects in the console, with the same content.

When the data clicked on map isn't equal to the first data on the array, the user still can click on other coordinates. :

    const [showPolygonForm, setShowPolygonForm] = useState(false)
    const [polyData, setPolyData] = useState([])

    const revealPolygonForm = () => {
        setShowPolygonForm(!showPolygonForm)
    }

const createPolygon = () => {

        let arrayValores = []

        if(showPolygonForm === true){
            map.on('click', e => {
                
                const data = {
                    lat: e.latlng.lat,
                    lng: e.latlng.lng
                }

                arrayValores.push(data)
                setPolyData(arrayValores)
                console.log(arrayValores)
        })}
        
        if(polyData[0] != polyData[(polyData.length - 1)]){
            console.log("it's in")
                map.on('click', e => {
                arrayValores.push(e.latlng)
            })}
    }

        createPolygon()