How to make an onClick event on interactive map Leaflet?

Question

I created interactive map. It work quite good but I cannot send currentId or Name of volveship I click. I get error that this property is undefined and I do not know how to fix this. I use this date https://github.com/ppatrzyk/polska-geojson/blob/master/wojewodztwa/wojewodztwa-min.geojson?short_path=898b1e2

import React, { useState } from 'react';
import {
  MapContainer,
  TileLayer,
  Polygon
} from 'react-leaflet';
import 'leaflet/dist/leaflet.css';
import { statesData } from './data';
import './App.css';

const center = [52.237049, 21.017532];

export default function App() {
const [currentID, setCurrentID] = useState();

  return (
<>
    <MapContainer
      center={center}
      zoom={6}
      style={{ width: '100vw', height: '100vh' }}
    >
      <TileLayer
        url="https://api.maptiler.com/maps/basic/tiles.json?key=MyKey"
        attribution='<a href="https://www.maptiler.com/copyright/" target="_blank">&copy; MapTiler</a> <a href="https://www.openstreetmap.org/copyright" target="_blank">&copy; OpenStreetMap contributors</a>'
      />
      {
        statesData.features.map((state) => {
          const coordinates = state.geometry.coordinates[0].map((item) => [item[1], item[0]]);

          return (<Polygon
            pathOptions={{
              fillColor: '#ae4a84',
              fillOpacity: 0.7,
              weight: 2,
              opacity: 1,
              dashArray: 3,
              color: 'white'
            }}
            positions={coordinates}
            eventHandlers={{
              mouseover: (e) => {
                const layer = e.target;
                layer.setStyle({
                  dashArray: "",
                  fillColor: "#003263",
                  fillOpacity: 0.7,
                  weight: 2,
                  opacity: 1,
                  color: "white",
                })
              },
              mouseout: (e) => {
                const layer = e.target;
                layer.setStyle({
                  fillOpacity: 0.7,
                  weight: 2,
                  dashArray: "3",
                  color: 'white',
                  fillColor: '#ae4a84'
                });
              },
              click: (e) => {
               setCurrentID(e.target.id)           }
            }}
          />)
        })
      }
    </MapContainer>
   
    </>
  );
}