diff --git a/framework/core/js/admin/dist/app.js b/framework/core/js/admin/dist/app.js
index 72a201ae5..c51d28004 100644
--- a/framework/core/js/admin/dist/app.js
+++ b/framework/core/js/admin/dist/app.js
@@ -17419,6 +17419,14 @@ System.register('flarum/components/AlertManager', ['flarum/Component', 'flarum/c
               })
             );
           }
+        }, {
+          key: 'config',
+          value: function config(isInitialized, context) {
+            // Since this component is 'above' the content of the page (that is, it is a
+            // part of the global UI that persists between routes), we will flag the DOM
+            // to be retained across route changes.
+            context.retain = true;
+          }
         }, {
           key: 'show',
           value: function show(component) {
@@ -18703,6 +18711,14 @@ System.register('flarum/components/HeaderPrimary', ['flarum/Component', 'flarum/
               listItems(this.items().toArray())
             );
           }
+        }, {
+          key: 'config',
+          value: function config(isInitialized, context) {
+            // Since this component is 'above' the content of the page (that is, it is a
+            // part of the global UI that persists between routes), we will flag the DOM
+            // to be retained across route changes.
+            context.retain = true;
+          }
         }, {
           key: 'items',
           value: function items() {
@@ -18748,6 +18764,14 @@ System.register('flarum/components/HeaderSecondary', ['flarum/Component', 'flaru
               listItems(this.items().toArray())
             );
           }
+        }, {
+          key: 'config',
+          value: function config(isInitialized, context) {
+            // Since this component is 'above' the content of the page (that is, it is a
+            // part of the global UI that persists between routes), we will flag the DOM
+            // to be retained across route changes.
+            context.retain = true;
+          }
         }, {
           key: 'items',
           value: function items() {
@@ -19073,6 +19097,9 @@ System.register('flarum/components/ModalManager', ['flarum/Component', 'flarum/c
           value: function config(isInitialized, context) {
             if (isInitialized) return;
 
+            // Since this component is 'above' the content of the page (that is, it is a
+            // part of the global UI that persists between routes), we will flag the DOM
+            // to be retained across route changes.
             context.retain = true;
 
             this.$().on('hidden.bs.modal', this.clear.bind(this)).on('shown.bs.modal', this.onready.bind(this));
diff --git a/framework/core/js/admin/src/components/HeaderPrimary.js b/framework/core/js/admin/src/components/HeaderPrimary.js
index 34ffc203c..7113a8eeb 100644
--- a/framework/core/js/admin/src/components/HeaderPrimary.js
+++ b/framework/core/js/admin/src/components/HeaderPrimary.js
@@ -15,6 +15,13 @@ export default class HeaderPrimary extends Component {
     );
   }
 
+  config(isInitialized, context) {
+    // Since this component is 'above' the content of the page (that is, it is a
+    // part of the global UI that persists between routes), we will flag the DOM
+    // to be retained across route changes.
+    context.retain = true;
+  }
+
   /**
    * Build an item list for the controls.
    *
diff --git a/framework/core/js/admin/src/components/HeaderSecondary.js b/framework/core/js/admin/src/components/HeaderSecondary.js
index cc1f0b268..0f1d19c3a 100644
--- a/framework/core/js/admin/src/components/HeaderSecondary.js
+++ b/framework/core/js/admin/src/components/HeaderSecondary.js
@@ -15,6 +15,13 @@ export default class HeaderSecondary extends Component {
     );
   }
 
+  config(isInitialized, context) {
+    // Since this component is 'above' the content of the page (that is, it is a
+    // part of the global UI that persists between routes), we will flag the DOM
+    // to be retained across route changes.
+    context.retain = true;
+  }
+
   /**
    * Build an item list for the controls.
    *
diff --git a/framework/core/js/forum/dist/app.js b/framework/core/js/forum/dist/app.js
index 774b1fcda..d9bff75d4 100644
--- a/framework/core/js/forum/dist/app.js
+++ b/framework/core/js/forum/dist/app.js
@@ -18901,6 +18901,14 @@ System.register('flarum/components/AlertManager', ['flarum/Component', 'flarum/c
               })
             );
           }
+        }, {
+          key: 'config',
+          value: function config(isInitialized, context) {
+            // Since this component is 'above' the content of the page (that is, it is a
+            // part of the global UI that persists between routes), we will flag the DOM
+            // to be retained across route changes.
+            context.retain = true;
+          }
         }, {
           key: 'show',
           value: function show(component) {
@@ -22192,8 +22200,8 @@ System.register('flarum/components/GroupBadge', ['flarum/components/Badge'], fun
 });;
 'use strict';
 
-System.register('flarum/components/HeaderPrimary', ['flarum/Component', 'flarum/utils/ItemList', 'flarum/helpers/listItems', 'flarum/components/SelectDropdown', 'flarum/components/Button'], function (_export, _context) {
-  var Component, ItemList, listItems, SelectDropdown, Button, HeaderPrimary;
+System.register('flarum/components/HeaderPrimary', ['flarum/Component', 'flarum/utils/ItemList', 'flarum/helpers/listItems'], function (_export, _context) {
+  var Component, ItemList, listItems, HeaderPrimary;
   return {
     setters: [function (_flarumComponent) {
       Component = _flarumComponent.default;
@@ -22201,10 +22209,6 @@ System.register('flarum/components/HeaderPrimary', ['flarum/Component', 'flarum/
       ItemList = _flarumUtilsItemList.default;
     }, function (_flarumHelpersListItems) {
       listItems = _flarumHelpersListItems.default;
-    }, function (_flarumComponentsSelectDropdown) {
-      SelectDropdown = _flarumComponentsSelectDropdown.default;
-    }, function (_flarumComponentsButton) {
-      Button = _flarumComponentsButton.default;
     }],
     execute: function () {
       HeaderPrimary = function (_Component) {
@@ -22224,6 +22228,14 @@ System.register('flarum/components/HeaderPrimary', ['flarum/Component', 'flarum/
               listItems(this.items().toArray())
             );
           }
+        }, {
+          key: 'config',
+          value: function config(isInitialized, context) {
+            // Since this component is 'above' the content of the page (that is, it is a
+            // part of the global UI that persists between routes), we will flag the DOM
+            // to be retained across route changes.
+            context.retain = true;
+          }
         }, {
           key: 'items',
           value: function items() {
@@ -22279,6 +22291,14 @@ System.register('flarum/components/HeaderSecondary', ['flarum/Component', 'flaru
               listItems(this.items().toArray())
             );
           }
+        }, {
+          key: 'config',
+          value: function config(isInitialized, context) {
+            // Since this component is 'above' the content of the page (that is, it is a
+            // part of the global UI that persists between routes), we will flag the DOM
+            // to be retained across route changes.
+            context.retain = true;
+          }
         }, {
           key: 'items',
           value: function items() {
@@ -23264,6 +23284,9 @@ System.register('flarum/components/ModalManager', ['flarum/Component', 'flarum/c
           value: function config(isInitialized, context) {
             if (isInitialized) return;
 
+            // Since this component is 'above' the content of the page (that is, it is a
+            // part of the global UI that persists between routes), we will flag the DOM
+            // to be retained across route changes.
             context.retain = true;
 
             this.$().on('hidden.bs.modal', this.clear.bind(this)).on('shown.bs.modal', this.onready.bind(this));
diff --git a/framework/core/js/forum/src/components/HeaderPrimary.js b/framework/core/js/forum/src/components/HeaderPrimary.js
index 7cace6dba..7113a8eeb 100644
--- a/framework/core/js/forum/src/components/HeaderPrimary.js
+++ b/framework/core/js/forum/src/components/HeaderPrimary.js
@@ -1,8 +1,6 @@
 import Component from 'flarum/Component';
 import ItemList from 'flarum/utils/ItemList';
 import listItems from 'flarum/helpers/listItems';
-import SelectDropdown from 'flarum/components/SelectDropdown';
-import Button from 'flarum/components/Button';
 
 /**
  * The `HeaderPrimary` component displays primary header controls. On the
@@ -17,6 +15,13 @@ export default class HeaderPrimary extends Component {
     );
   }
 
+  config(isInitialized, context) {
+    // Since this component is 'above' the content of the page (that is, it is a
+    // part of the global UI that persists between routes), we will flag the DOM
+    // to be retained across route changes.
+    context.retain = true;
+  }
+
   /**
    * Build an item list for the controls.
    *
diff --git a/framework/core/js/forum/src/components/HeaderSecondary.js b/framework/core/js/forum/src/components/HeaderSecondary.js
index 2cdfa38ec..750f868d9 100644
--- a/framework/core/js/forum/src/components/HeaderSecondary.js
+++ b/framework/core/js/forum/src/components/HeaderSecondary.js
@@ -22,6 +22,13 @@ export default class HeaderSecondary extends Component {
     );
   }
 
+  config(isInitialized, context) {
+    // Since this component is 'above' the content of the page (that is, it is a
+    // part of the global UI that persists between routes), we will flag the DOM
+    // to be retained across route changes.
+    context.retain = true;
+  }
+
   /**
    * Build an item list for the controls.
    *
diff --git a/framework/core/js/lib/components/AlertManager.js b/framework/core/js/lib/components/AlertManager.js
index f0d8b2a48..4c6a284dc 100644
--- a/framework/core/js/lib/components/AlertManager.js
+++ b/framework/core/js/lib/components/AlertManager.js
@@ -24,6 +24,13 @@ export default class AlertManager extends Component {
     );
   }
 
+  config(isInitialized, context) {
+    // Since this component is 'above' the content of the page (that is, it is a
+    // part of the global UI that persists between routes), we will flag the DOM
+    // to be retained across route changes.
+    context.retain = true;
+  }
+
   /**
    * Show an Alert in the alerts area.
    *
diff --git a/framework/core/js/lib/components/ModalManager.js b/framework/core/js/lib/components/ModalManager.js
index 575fee2e9..4d6a485b2 100644
--- a/framework/core/js/lib/components/ModalManager.js
+++ b/framework/core/js/lib/components/ModalManager.js
@@ -23,6 +23,9 @@ export default class ModalManager extends Component {
   config(isInitialized, context) {
     if (isInitialized) return;
 
+    // Since this component is 'above' the content of the page (that is, it is a
+    // part of the global UI that persists between routes), we will flag the DOM
+    // to be retained across route changes.
     context.retain = true;
 
     this.$()