added client code

client/components/app/BookShelfToolbar.vue

@@ -87,6 +87,12 @@
 
         <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" />
@@ -131,7 +137,8 @@ export default {
       totalEntities: 0,
       processingSeries: false,
       processingIssues: false,
-      processingAuthors: false
+      processingAuthors: false,
+      showAllLibraryStats: false
     }
   },
   computed: {
@@ -235,6 +242,9 @@ export default {
     currentLibraryId() {
       return this.$store.state.libraries.currentLibraryId
     },
+    currentLibraryName() {
+      return this.$store.getters['libraries/getCurrentLibraryName']
+    },
     libraryProvider() {
       return this.$store.getters['libraries/getLibraryProvider'](this.currentLibraryId) || 'google'
     },
@@ -259,6 +269,9 @@ export default {
     isPlaylistsPage() {
       return this.page === 'playlists'
     },
+    isLibraryStatsPage() {
+      return this.page === 'library-stats'
+    },
     isHomePage() {
       return this.$route.name === 'library-library'
     },
@@ -606,6 +619,12 @@ 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/library/_library/stats.vue

@@ -1,8 +1,6 @@
 <template>
   <div class="page relative" :class="streamLibraryItem ? 'streaming' : ''">
-    <app-book-shelf-toolbar page="library-stats" is-home />
-    <ui-btn class="text-xs" :padding-x="1.5" :padding-y="1" @click="toggleStats">
-      {{ showAllLibraryStats ? currentLibraryName : 'Show all Libraries' }}</ui-btn>
+    <app-book-shelf-toolbar page="library-stats" is-home @library-stats-updated="toggleStats" />
     <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" />
@@ -164,9 +162,6 @@ export default {
     currentLibraryId() {
       return this.$store.state.libraries.currentLibraryId
     },
-    currentLibraryName() {
-      return this.$store.getters['libraries/getCurrentLibraryName']
-    },
     currentLibraryMediaType() {
       return this.$store.getters['libraries/getCurrentLibraryMediaType']
     },
@@ -191,8 +186,8 @@ export default {
         })
       }
     },
-    toggleStats() {
-      this.showAllLibraryStats = !this.showAllLibraryStats;
+    toggleStats(value) {
+      this.showAllLibraryStats = value;
       this.$nextTick(() => {
         this.init();
       });