Fixes Issue #12421 - Change page title based on the site section being viewed (#12627)

* Update title for tabs not including challenges, guild and team

* add section titles to challenges, guilds, and groups

* Update dynamic title to use vuex action

* Remove duplicate key

* Actually remove duplicate key

* Fix section sub section in group

* Add note to implement setTitle when adding a page

* Add missing sections to dynamic title

* Features string not translated

* Use onGroupUpdate to update group titles

* Add watcher to challenges for dynamic title updates

* Small fixes

* Add register and login to title, remove duplicate keys

* Add home page dynamic title functionality

* Minor name changes

* remove wrong i18n strings from front.js

* refactor router note

Co-authored-by: Matteo Pagliazzi <matteopagliazzi@gmail.com>

website/client/src/components/inventory/equipment/index.vue

@@ -508,6 +508,11 @@ export default {
     this.costumeMode = getLocalSetting(
       CONSTANTS.keyConstants.CURRENT_EQUIPMENT_DRAWER_TAB,
     ) === CONSTANTS.equipmentDrawerTabValues.COSTUME_TAB;
+
+    this.$store.dispatch('common:setTitle', {
+      subSection: this.$t('equipment'),
+      section: this.$t('inventory'),
+    });
   },
   methods: {
     selectDrawerTab (tabName) {

website/client/src/components/inventory/items/index.vue

@@ -491,6 +491,12 @@ export default {
       return this.groups.some(g => g.selected);
     },
   },
+  mounted () {
+    this.$store.dispatch('common:setTitle', {
+      subSection: this.$t('items'),
+      section: this.$t('inventory'),
+    });
+  },
   watch: {
     searchText: throttle(function throttleSearch () {
       this.searchTextThrottled = this.searchText.toLowerCase();

website/client/src/components/inventory/stable/index.vue

@@ -645,6 +645,12 @@ export default {
       return Object.values(this.viewOptions).some(g => g.selected);
     },
   },
+  mounted () {
+    this.$store.dispatch('common:setTitle', {
+      subSection: this.$t('stable'),
+      section: this.$t('inventory'),
+    });
+  },
   watch: {
     searchText: _throttle(function throttleSearch () {
       const search = this.searchText.toLowerCase();