reverted old changes and fixed library switching

client/components/app/BookShelfToolbar.vue

@@ -87,12 +87,6 @@
 
         <ui-context-menu-dropdown v-if="contextMenuItems.length" :items="contextMenuItems" :menu-width="110" class="ml-2" @action="contextMenuAction" />
       </template>
-      <!-- library stats page -->
-      <template v-else-if="isLibraryStatsPage">
-        <div class="flex-grow" />
-        <ui-btn color="primary" small @click="updateLibraryStats">
-          {{ this.showAllLibraryStats ? currentLibraryName : $strings.LabelShowAll }}</ui-btn>
-      </template>
       <!-- search page -->
       <template v-else-if="page === 'search'">
         <div class="flex-grow" />
@@ -269,9 +263,6 @@ export default {
     isPlaylistsPage() {
       return this.page === 'playlists'
     },
-    isLibraryStatsPage() {
-      return this.page === 'library-stats'
-    },
     isHomePage() {
       return this.$route.name === 'library-library'
     },
@@ -619,12 +610,6 @@ export default {
     updateAuthorSort() {
       this.saveSettings()
     },
-    updateLibraryStats() {
-      this.$emit('library-stats-updated', !this.showAllLibraryStats)
-      this.$nextTick(() => {
-        this.showAllLibraryStats = !this.showAllLibraryStats
-      })
-    },
     saveSettings() {
       this.$store.dispatch('user/updateUserSettings', this.settings)
     },

client/pages/config/server-stats.vue

@@ -20,9 +20,9 @@
         <tr v-for="library in bookLibraryListStats">
           <td>
             <p class="text-sm md:text-base text-gray-100">
-              <nuxt-link :to="`/library/${library.id}/stats`" class="hover:underline">
+              <a :href="'/library/' + library.id + '/stats'" class="hover:underline" @click.prevent="switchLibrary(library.id)">
                 {{ library.name }}
-              </nuxt-link>
+              </a>
             </p>
           </td>
           <td>
@@ -59,9 +59,9 @@
         <tr v-for="library in podcastLibraryListStats">
           <td>
             <p class="text-sm md:text-base text-gray-100">
-              <nuxt-link :to="`/library/${library.id}/stats`" class="hover:underline">
+              <a :href="'/library/' + library.id + '/stats'" class="hover:underline" @click.prevent="switchLibrary(library.id)">
                 {{ library.name }}
-              </nuxt-link>
+              </a>
             </p>
           </td>
           <td>
@@ -141,10 +141,6 @@ export default {
         if (a['type'] > b['type']) return 1
         return 0
       })
-
-
-      console.log(this.bookLibraryIndex)
-      console.log(this.podcastLibraryIndex)
     },
     totalHours(duration) {
       return Math.round(duration / (60 * 60))
@@ -159,6 +155,11 @@ export default {
     totalSizeMod(size) {
       return this.totalSizePretty(size).split(' ')[1]
     },
+    async switchLibrary(libraryId) {
+      await this.$store.dispatch('libraries/fetch', libraryId);
+
+      await this.$router.push(`/library/${libraryId}/stats`)
+    }
   },
   mounted() {
     this.init()

client/pages/library/_library/stats.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="page relative" :class="streamLibraryItem ? 'streaming' : ''">
-    <app-book-shelf-toolbar page="library-stats" is-home @library-stats-updated="toggleStats" />
+    <app-book-shelf-toolbar page="library-stats" is-home />
     <div id="bookshelf" class="w-full h-full px-1 py-4 md:p-8 relative overflow-y-auto">
       <div class="w-full max-w-4xl mx-auto">
         <stats-preview-icons v-if="totalItems" :library-stats="libraryStats" />
@@ -102,8 +102,7 @@ export default {
   },
   data() {
     return {
-      libraryStats: null,
-      showAllLibraryStats: false
+      libraryStats: null
     }
   },
   watch: {
@@ -111,12 +110,6 @@ export default {
       if (newVal) {
         this.init()
       }
-    },
-    showAllLibraryStats(newVal) {
-      console.log('showAllLibraryStats', newVal)
-      if (newVal) {
-        this.init()
-      }
     }
   },
   computed: {
@@ -171,26 +164,11 @@ export default {
   },
   methods: {
     async init() {
-      this.libraryStats = null
-      if (this.showAllLibraryStats === true) {
-        this.libraryStats = (await this.$axios.$get(`/api/libraries/stats`).catch((err) => {
-          console.error('Failed to get library stats', err)
-          var errorMsg = err.response ? err.response.data || 'Unknown Error' : 'Unknown Error'
-          this.$toast.error(`Failed to get library stats: ${errorMsg}`)
-        }))['combined']
-      } else {
-        this.libraryStats = await this.$axios.$get(`/api/libraries/${this.currentLibraryId}/stats`).catch((err) => {
-          console.error('Failed to get library stats', err)
-          var errorMsg = err.response ? err.response.data || 'Unknown Error' : 'Unknown Error'
-          this.$toast.error(`Failed to get library stats: ${errorMsg}`)
-        })
-      }
-    },
-    toggleStats(value) {
-      this.showAllLibraryStats = value;
-      this.$nextTick(() => {
-        this.init();
-      });
+      this.libraryStats = await this.$axios.$get(`/api/libraries/${this.currentLibraryId}/stats`).catch((err) => {
+        console.error('Failed to get library stats', err)
+        var errorMsg = err.response ? err.response.data || 'Unknown Error' : 'Unknown Error'
+        this.$toast.error(`Failed to get library stats: ${errorMsg}`)
+      })
     }
   },
   mounted() {