[UI] Persist current settings page on the URL.

platypush/backend/http/webapp/src/components/Nav.vue

@@ -19,7 +19,7 @@
       <li v-for="config, name in configSections" :key="name" class="entry"
           :class="{selected: name === selectedConfigPanel}"
           :title="config.name" @click="$emit('select-config', name)">
-        <a href="/#settings">
+        <a :href="`/#settings?page=${name}`">
         <span class="icon">
           <i :class="config.icon['class']" v-if="config.icon?.['class']" />
           <img :src="config.icon?.imgUrl" v-else-if="config.icon?.imgUrl" alt="name"/>

platypush/backend/http/webapp/src/components/panels/Settings/Index.vue

@@ -20,6 +20,7 @@ export default {
   name: "Settings",
   components: {Application, Users, Token},
   mixins: [Utils],
+  emits: ['change-page'],
 
   props: {
     selectedPanel: {
@@ -41,8 +42,24 @@ export default {
     }
   },
 
-  mounted() {
-    this.refresh()
+  watch: {
+    selectedPanel(value) {
+      this.setUrlArgs({page: value})
+    },
+  },
+
+  async mounted() {
+    const args = this.getUrlArgs()
+    let page = null
+    if (args.page?.length) {
+      page = args.page
+    } else {
+      page = this.selectedPanel?.length ? this.selectedPanel : 'users'
+    }
+
+    this.$emit('change-page', page)
+    await this.refresh()
+    this.setUrlArgs({page: this.selectedPanel})
   }
 }
 </script>

platypush/backend/http/webapp/src/views/Panel.vue

@@ -12,7 +12,7 @@
 
     <div class="canvas" v-if="selectedPanel === 'settings'">
       <div class="panel">
-        <Settings :selected-panel="selectedConfigPanel" />
+        <Settings :selected-panel="selectedConfigPanel" @change-page="selectedConfigPanel = $event" />
       </div>
     </div>