feat: Add resetActiveIndexOnUnmount config to Neo.tab.Container (#8812)

This introduces a generic mechanism to prevent 'phantom mounts' in router-driven
TabContainers. By setting this config to true, the activeIndex is automatically
reset to null when the component unmounts, ensuring it mounts in a clean state
awaiting the Router's instruction.

Updated Portal.view.news.TabContainer to use this new config instead of the
manual workaround.

Author: tobiu

apps/portal/view/news/TabContainer.mjs

@@ -61,18 +61,11 @@ class NewsTabContainer extends TabContainer {
                 route  : '/news/releases',
                 text   : 'Release Notes'
             }
-        }]
-    }
-    /**
-     * @param {Boolean} value
-     * @param {Boolean} oldValue
-     */
-    afterSetMounted(value, oldValue) {
-        super.afterSetMounted(value, oldValue);
-
-        if (value === false) {
-            this.activeIndex = null
-        }
+        }],
+        /**
+         * @member {Boolean} resetActiveIndexOnUnmount=true
+         */
+        resetActiveIndexOnUnmount: true
     }
 }
 

src/tab/Container.mjs

@@ -95,6 +95,13 @@ class Container extends BaseContainer {
          * @member {Boolean} removeInactiveCards=true
          */
         removeInactiveCards: true,
+        /**
+         * If true, the activeIndex will be reset to null when the component is unmounted.
+         * This is useful for router-driven tab containers to prevent "phantom mounts"
+         * of the previous state before the router updates the active index.
+         * @member {Boolean} resetActiveIndexOnUnmount=false
+         */
+        resetActiveIndexOnUnmount: false,
         /**
          * @member {String|null} tabBarId=null
          */
@@ -197,6 +204,18 @@ class Container extends BaseContainer {
         }
     }
 
+    /**
+     * @param {Boolean} value
+     * @param {Boolean} oldValue
+     */
+    afterSetMounted(value, oldValue) {
+        super.afterSetMounted(value, oldValue);
+
+        if (!value && this.resetActiveIndexOnUnmount) {
+            this.activeIndex = null
+        }
+    }
+
     /**
      * Adjusts the container's layout and CSS classes when the tab bar position changes.
      * This method ensures that the `HeaderToolbar` is docked correctly and that the overall