DEV: save/restore the previous sidebar panel state (#25899)

In this PR, the admin panel remembers the previous state and restores it when the admin panel is deactivated.
https://github.com/discourse/discourse/pull/25781

However, it would be better to have a more generic solution. When the panel is changed, the previous state is saved in the sidebarState. When a user returns to the specific panel, a previously remembered state is restored.

app/assets/javascripts/admin/addon/routes/admin.js

@@ -1,11 +1,6 @@
 import { tracked } from "@glimmer/tracking";
 import { inject as service } from "@ember/service";
-import {
+import { ADMIN_PANEL, MAIN_PANEL } from "discourse/lib/sidebar/panels";
-  ADMIN_PANEL,
-  COMBINED_MODE,
-  MAIN_PANEL,
-  SEPARATED_MODE,
-} from "discourse/lib/sidebar/panels";
 import DiscourseRoute from "discourse/routes/discourse";
 import I18n from "discourse-i18n";
 
@@ -21,11 +16,6 @@ export default class AdminRoute extends DiscourseRoute {
 
   activate() {
     if (this.currentUser.use_admin_sidebar) {
-      this.initialSidebarState = {
-        mode: this.sidebarState.mode,
-        displaySwitchPanelButtons: this.sidebarState.displaySwitchPanelButtons,
-      };
-
       this.sidebarState.setPanel(ADMIN_PANEL);
       this.sidebarState.setSeparatedMode();
       this.sidebarState.hideSwitchPanelButtons();
@@ -41,18 +31,6 @@ export default class AdminRoute extends DiscourseRoute {
 
     if (this.currentUser.use_admin_sidebar) {
       if (!transition?.to.name.startsWith("admin")) {
-        if (this.initialSidebarState.mode === SEPARATED_MODE) {
-          this.sidebarState.setSeparatedMode();
-        } else if (this.initialSidebarState.mode === COMBINED_MODE) {
-          this.sidebarState.setCombinedMode();
-        }
-
-        if (this.initialSidebarState.displaySwitchPanelButtons) {
-          this.sidebarState.showSwitchPanelButtons();
-        } else {
-          this.sidebarState.hideSwitchPanelButtons();
-        }
-
         this.sidebarState.setPanel(MAIN_PANEL);
       }
     }

app/assets/javascripts/discourse/app/services/sidebar-state.js

@@ -18,6 +18,7 @@ export default class SidebarState extends Service {
   @tracked mode = COMBINED_MODE;
   @tracked displaySwitchPanelButtons = false;
   @tracked filter = "";
+  previousState = {};
 
   constructor() {
     super(...arguments);
@@ -25,7 +26,11 @@ export default class SidebarState extends Service {
   }
 
   setPanel(name) {
+    if (this.currentPanelKey) {
+      this.setPreviousState();
+    }
     this.currentPanelKey = name;
+    this.restorePreviousState();
   }
 
   get currentPanel() {
@@ -51,6 +56,32 @@ export default class SidebarState extends Service {
     this.displaySwitchPanelButtons = false;
   }
 
+  setPreviousState() {
+    this.previousState[this.currentPanelKey] = {
+      mode: this.mode,
+      displaySwitchPanelButtons: this.displaySwitchPanelButtons,
+    };
+  }
+
+  restorePreviousState() {
+    const state = this.previousState[this.currentPanelKey];
+    if (!state) {
+      return;
+    }
+
+    if (state.mode === SEPARATED_MODE) {
+      this.setSeparatedMode();
+    } else if (state.mode === COMBINED_MODE) {
+      this.setCombinedMode();
+    }
+
+    if (state.displaySwitchPanelButtons) {
+      this.showSwitchPanelButtons();
+    } else {
+      this.hideSwitchPanelButtons();
+    }
+  }
+
   get combinedMode() {
     return this.mode === COMBINED_MODE;
   }

app/assets/javascripts/discourse/tests/acceptance/sidebar-plugin-api-test.js

@@ -843,6 +843,7 @@ acceptance("Sidebar - Plugin API", function (needs) {
         },
         "new-panel"
       );
+      api.setSeparatedSidebarMode();
       api.setSidebarPanel("new-panel");
       api.setSeparatedSidebarMode();
     });