How to update map coordinates after zooming in Leaflet?

I am new to working with maps. I have currently implemented a feature that allows users to draw an area on the map, which gets marked. What I need is for, when the user zooms in on the map while drawing, the geographic coordinates to be updated to reflect the new visible area on the map.

Currently, when the user zooms in while drawing, the final mark refers to the initial coordinates before the zoom, resulting in a marked area that is different from what the drawing currently shows.

I am working with Leaflet and Leaflet.draw.

My intention was to capture the pixel points of the drawing before the zoom and then convert them back to geographic coordinates after the zoom. However, it seems that this is not working, as the coordinates remain the same. Below is a part of the code where the coordinates are captured before creating the marker.

Basically, I need latlngs to contain the updated coordinates after the zoom, so I can pass them as parameters to create the marker.

        let isZoomed = false;

        map.on("zoomend", () => {
          isZoomed = true;
        });


        freeDraw.on('markers', (event: any) => {
          if (event.eventType == 'create' && event.target.map.drawLatLngs) {
            var latlngs = event.target.map.drawLatLngs;
            handleNewPolyline(latlngs);
          }

          if (event.eventType == 'create' && event.latLngs && event.latLngs.length > 0) {
            let latlngs: any = event.latLngs;
            let newPoints:any = [];

            let initialPoints = latlngs
            .flatMap((polygon: any) =>
              polygon.map((coord: any)=> map.latLngToLayerPoint(coord))
            );

            if (isZoomed) {
              newPoints = initialPoints.map((point: any) => map.layerPointToLatLng(point));
              latlngs = newPoints;             
              isZoomed = false;
              newPoints = [];
            } else {
              latlngs = event.latLngs;
            }