Mouseenter 和 Mouseleave 下拉菜单

Question

I'm trying to have this dropdown menu to show the submenu when mouse is hover it and stay hover when on top of the submenu as well, but when the mouse leaves, I want it to hide it.

The following link, I was only able to change the javascript to mouseenter, but I don't know how to create the mouseleave function.

It's probably super easy for anyone who knows how to code, but I don't:(

Here is the link: https://codepen.io/ok2ju/pen/MwyvWY

And here is the code:

document.querySelector('.mini-photo-wrapper').addEventListener('mouseenter', function() {
  document.querySelector('.menu-container').classList.toggle('active');
});