Scroll to active tab

[bsshreesha]

Auto scroll to active tab present, instead of user scrolling to find the active tab
In the file path
src/html/components/_scripts.astro

Place the below code attached

<!--begin::Auto-scroll Active Sidebar Item-->
<script is:inline>
  document.addEventListener("DOMContentLoaded", function () {
    const wrapper = document.querySelector(".sidebar-wrapper");

    if (!wrapper) return;

    // Find active menu item (AdminLTE adds 'active' class)
    const activeItem =
      wrapper.querySelector(".nav-link.active") ||
      wrapper.querySelector(".menu-open > .nav-link") ||
      wrapper.querySelector("a.active");

    if (!activeItem) return;

    // Wait a bit to ensure OverlayScrollbars kinks are fixed
    setTimeout(() => {
      try {
        // If OverlayScrollbars is enabled
        const osInstance = OverlayScrollbarsGlobal?.OverlayScrollbars(wrapper);

        if (osInstance) {
          // Scroll so that active item is centered
          osInstance.elements().viewport.scrollTo({
            top: activeItem.offsetTop - wrapper.clientHeight / 2,
            behavior: "smooth"
          });
          return;
        }
      } catch {
        // Ignore OverlayScrollbars errors and fallback
      }

      // Fallback for mobile or disabled OverlayScrollbars
      wrapper.scrollTo({
        top: activeItem.offsetTop - wrapper.clientHeight / 2,
        behavior: "smooth"
      });
    }, 150);
  });
</script>
<!--end::Auto-scroll Active Sidebar Item-->

This is will autoscroll to the active tab