How do I turn an arrow function into an if/else statement?

I've run into a slight problem with my toggle menu. The hamburger animation works fine, and once a link is clicked it takes you to that section of my page, and removes my CSS helper class "lockscreen" - this hides my overflow so that you can't scroll on the toggle menu. However, if you want to look at the menu, then close it without clicking on a menu item - the "lockscreen" class remains applied. I'm a bit a JavaScript newb, do I need to event listener into an if/else statment of add a new variable/function to enable scroll if no link is click once the menu has been closed?

const navToggle = document.querySelector(".nav-toggle");
const navLinks = document.querySelectorAll(".nav__link");

navToggle.addEventListener("click", () => {
  document.body.classList.toggle("nav-open");
  document.body.classList.add("lockscreen");
});

navLinks.forEach((link) => {
  link.addEventListener("click", () => {
    document.body.classList.remove("nav-open");
    document.body.classList.remove("lockscreen");
  });
});