Multiple active menus and treeview not expanding when pasting link into new tab

Question

I'm currently working on a web application that features a sidebar menu with expandable treeviews. I've implemented functionality to maintain the active state of the menu item across different tabs using session storage. However, I've encountered two issues:

Multiple Active Menus: When pasting the link into a new tab, multiple menus become active simultaneously, which is not the intended behavior.

Treeview Not Expanding: Additionally, the treeview associated with the active menu item does not expand automatically when the link is pasted into a new tab, even though it should.

Here's a snippet of my code:

$(document).ready(function() {
    // Toggle expand/collapse on treeview click
    $('.treeview').on('click', function() {
      $(this).toggleClass('is-expanded');
    });

    // Check session storage for active link
    var active_link = sessionStorage.getItem("activeLink");
    if (active_link && active_link !== "") {
      // Remove active class from all treeviews
      $('.treeview').removeClass('active');
      // Add active class to the stored active link if it exists
      var activeLinkElement = $('#menu-' + active_link);
      if (activeLinkElement.length) {
        activeLinkElement.addClass('active');
        // Expand parent treeview
        activeLinkElement.closest('.treeview').addClass('is-expanded');
      }
    } else {
      // Remove active class from all treeviews
      $('.treeview').removeClass('active');
      // Set dashboard link as active by default
      $('#menu-dashboard').addClass('active');
    }
  })

I expect only one menu to be active at a time, and I also expect the associated treeview to expand when the link is pasted into a new tab. Could someone help me identify what's causing these issues and suggest how to fix them?

Thank you for your assistance!