React, Material-UI - onClick() get always last item as argument - reactjs

Question

I hit a wall.
Problem is that handleDeleteItem() always receives last item._id instead of given.
On the other hand goToEdit() is working properly. So far I have tried placing key property in different components, deleting node_modules and rebuilding app.
I have no idea what causes this situation.
I have component like this:
export class List extends Component {
render() {
const {
classes,
items,
anchorEl,
handleDeleteItem,
openItemMenu,
closeItemMenu,
goToEdit,
} = this.props;
return (
<main className={classes.content}>
<div className={classes.toolbar} />
<Typography
variant="h3"
color="textSecondary"
gutterBottom
align="center"
>
Items
</Typography>
<Grid container spacing={3}>
<Grid item xs={12} align="right">
<Button
variant="outlined"
color="primary"
startIcon={<AddIcon />}
onClick={(e) => goToEdit(e, 0)}
>
Add new
</Button>
</Grid>
{!items.length && (
<Grid item xs={12} align="center">
<Typography variant="overline">
List empty!
</Typography>
</Grid>
)}
{items.map((item) => (
<Grid item key={item._id} xs={12}>
<Paper
elevation={3}
style={{
borderLeft: `5px solid ${item.color}`,
}}
onClick={(e) => goToEdit(e, item._id)}
className={classes.paper}
>
<Grid container>
<Grid item xs={11}>
<Typography variant="subtitle1" color="textSecondary">
{item.name}
</Typography>
</Grid>
<Grid item xs={1} align="right">
<IconButton
className={classes.showOnHover}
size="small"
edge="end"
aria-label="delete"
onClick={(e) => openItemMenu(e)}
>
<MoreVertIcon />
</IconButton>
<Menu
id="item-menu"
anchorEl={anchorEl}
keepMounted
open={Boolean(anchorEl)}
onClose={(e) => closeItemMenu(e)}
TransitionComponent={Fade}
>
<MenuItem
onClick={(e) => handleDeleteItem(e, item._id)}
>
Usuń bajkę
</MenuItem>
</Menu>
</Grid>
<Grid item xs={12}>
<Box
component="div"
my={2}
textOverflow="ellipsis"
overflow="hidden"
>
<Typography noWrap variant="body2">
{item.description}
</Typography>
</Box>
</Grid>
</Grid>
</Paper>
</Grid>
))}
</Grid>
</main>
);
}
}