Complete refactor on push menu plugin

[dfsmania]

Refactor Push Menu Plugin (AdminLTE v4)

This PR delivers a complete refactor of the Push Menu plugin, focusing on correctness, maintainability, and behavioral alignment with AdminLTE v3.

Summary of changes

1. Improved code documentation

• Added detailed code comments across the Push Menu implementation.
• The goal is to make the control flow and state transitions explicit and easier to reason about.
• This is especially important for a component that mixes responsive logic, persistence, and DOM state.

---

2. Clear separation of responsibilities

• Refactored the plugin logic into smaller, well-defined methods.
• Each method now has a single responsibility (responsive handling, persistence, toggling, etc.).
• This significantly improves readability and reduces the likelihood of regressions when modifying behavior.

---

3. Sidebar behavior aligned with AdminLTE v3

• The sidebar-open class is now explicitly added when the sidebar is opened on mobile viewports.
• This restores the behavior used in AdminLTE v3 and fixes inconsistencies introduced in v4.
• Overall responsive logic now more closely mimics the v3 implementation, reducing unexpected behavior during resizing and navigation.

---

4. Sidebar state persistence is now opt-in

• Sidebar state persistence is disabled by default.
• Persistence can be enabled via a data attribute on the sidebar element:

<aside class="app-sidebar" data-enable-persistence="true"></aside>

• This avoids unexpected UI state restoration and gives developers explicit control over the feature.

---

5. Single PushMenu instance

• The plugin now creates and manages a single PushMenu instance.
• Previously, multiple instances were created in different event handlers, leading to duplicated logic and harder-to-track state.
• This change results in cleaner event handling and more predictable behavior.

---

Why this refactor?

The Push Menu is a core UI component that combines:

• responsive behavior
• DOM state
• optional persistence
• user interaction

This refactor aims to:

• make the logic easier to follow
• reduce side effects
• restore proven v3 behavior
• provide a stable foundation for future improvements

No visual regressions are expected, only more consistent and predictable behavior.

[netlify]

✅ Deploy Preview for adminlte-v4 ready!

Name	Link
🔨 Latest commit	5d0b376
🔍 Latest deploy log	https://app.netlify.com/projects/adminlte-v4/deploys/694c329afe3ec1000835d712
😎 Deploy Preview	https://deploy-preview-5954--adminlte-v4.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[dfsmania]

@puikinsh The Bundlewatch faill will dissapear when merging the #5953 PR. If you want to review the logic, I'll recommend to view the new raw file, instead of comparing differences, since this PR introduces a complete rework of the push menu plugin.

[puikinsh]

Thanks @dfsmania! Merged into master (commit f2b34bb). The single-instance approach and opt-in persistence are the right architectural choices. We'll note the persistence default change in the release notes. 👍

[dfsmania]

@puikinsh Your welcome, however the merged commit related to this work does not contains all the code commentaries that explains the decision of each logic implemented, and makes the code clear for a future maintainer. I don't get why you didn't just merge this PR directly. For example:

This is some code I submitted here:

   /**
   * Update the sidebar state based on the current screen size and the
   * sidebarBreakpoint config value.
   */
  updateStateByResponsiveLogic(): void {
    if (this.isMobileSize()) {
      // On mobile sizes, keep the sidebar collapsed unless explicitly opened
      // by the user to prevent unintended collapse on scroll or resize events.

      if (!this.isExplicitlyOpen()) {
        this.collapse()
      }
    } else {
      // On big screen sizes, keep the sidebar expanded unless in mini mode and
      // explicitly collapsed.

      if (!(this.isMiniMode() && this.isCollapsed())) {
        this.expand()
      }
    }
  }

And now it's just like this (shorten, but harder to understand why that logic was applied):

/**
   * Update the sidebar state based on the current screen size and the
   * sidebarBreakpoint config value.
   */
  updateStateByResponsiveLogic(): void {
    if (this.isMobileSize()) {
      if (!this.isExplicitlyOpen()) {
        this.collapse()
      }
    } else {
      if (!(this.isMiniMode() && this.isCollapsed())) {
        this.expand()
      }
    }
  }

[puikinsh]

@dfsmania You're absolutely right — those inline comments explain the reasoning behind each logic branch and are valuable for future maintainers. I should have merged the PR directly instead of rewriting the commit.

I've just restored all the inline comments from your original PR in commit coming up next. Thanks for flagging this!

[dfsmania]

@puikinsh Thanks for considering this! When I get some time I will review the other Typescripts files to improve them.