setWaypointToEdit: (state, action: PayloadAction<WaypointToEditPayload>) => {

  let gridPolygonsData: GridPolygonsData;

  const { currentArea } = state.areas;      

  gridPolygonsData = {

    ...state.areas.gridPolygonsData,

  };

  gridPolygonsData[currentArea] = {

    ...gridPolygonsData[currentArea],

    waypointToEdit: action.payload.waypoint,

  };

 state = {

    ...state,

    areas: {

      ...state.areas,

      gridPolygonsData,

    },

 }

}, 

export interface WaypointToEditPayload {

 waypoint: Waypoint | RequiredWaypoint | null;

}

setWaypointToEdit(this.getWaypoint(areaNumber, waypointId))

private getWaypoint(areaNumber: number, waypointId: number) {

const {

    areas: { gridPolygonsData }

} = useAppSelector((state) => state.project); 

const waypoints = gridPolygonsData[areaNumber].gridWaypoints;

if (waypoints)

  return waypoints.find((waypoint) => waypoint.id === waypointId) ?? null;

return null;

}

setWaypointToEdit({ waypoint: this.getWaypoint(areaNumber, waypointId) })

export type WaypointToEditPayload = Waypoint | RequiredWaypoint | null;

gridPolygonsData[currentArea] = {

  ...gridPolygonsData[currentArea],

  waypointToEdit: action.payload,  // change

};