Move Collapse Series option to the tollbar's context menu

client/components/app/BookShelfToolbar.vue

@@ -53,7 +53,6 @@
           <span class="font-mono">{{ numShowing }}</span>
         </div>
         <div class="flex-grow" />
-        <ui-checkbox v-if="!isBatchSelecting" v-model="settings.collapseBookSeries" :label="$strings.LabelCollapseSeries" checkbox-bg="bg" check-color="white" small class="mr-2" @input="updateCollapseBookSeries" />
 
         <!-- RSS feed -->
         <ui-tooltip v-if="seriesRssFeed" :text="$strings.LabelOpenRSSFeed" direction="top">
@@ -68,9 +67,6 @@
 
         <div class="flex-grow hidden sm:inline-block" />
 
-        <!-- collapse series checkbox -->
-        <ui-checkbox v-if="isLibraryPage && isBookLibrary && !isBatchSelecting" v-model="settings.collapseSeries" :label="$strings.LabelCollapseSeries" checkbox-bg="bg" check-color="white" small class="mr-2" @input="updateCollapseSeries" />
-
         <!-- library filter select -->
         <controls-library-filter-select v-if="isLibraryPage && !isBatchSelecting" v-model="settings.filterBy" class="w-36 sm:w-44 md:w-48 h-7.5 ml-1 sm:ml-4" @change="updateFilter" />
 
@@ -332,6 +328,7 @@ export default {
       }
 
       this.addSubtitlesMenuItem(items)
+      this.addCollpaseSeriesMenuItem(items)
 
       return items
     },
@@ -355,6 +352,21 @@ export default {
         }
       }
     },
+    addCollpaseSeriesMenuItem(items) {
+      if (this.isLibraryPage && this.isBookLibrary && !this.isBatchSelecting) {
+        if (this.settings.collapseSeries) {
+          items.push({
+            text: 'Expand Series',
+            action: 'expand-series'
+          })
+        } else {
+          items.push({
+            text: 'Collapse Series',
+            action: 'collapse-series'
+          })
+        }
+      }
+    },
     handleSubtitlesAction(action) {
       if (action === 'show-subtitles') {
         this.settings.showSubtitles = true
@@ -368,12 +380,27 @@ export default {
       }
       return false
     },
+    handleCollapseSeriesAction(action) {
+      if (action === 'collapse-series') {
+        this.settings.collapseSeries = true
+        this.updateCollapseSeries()
+        return true
+      }
+      if (action === 'expand-series') {
+        this.settings.collapseSeries = false
+        this.updateCollapseSeries()
+        return true
+      }
+      return false
+    },
     contextMenuAction({ action }) {
       if (action === 'export-opml') {
         this.exportOPML()
         return
       } else if (this.handleSubtitlesAction(action)) {
         return
+      } else if (this.handleCollapseSeriesAction(action)) {
+        return
       }
     },
     exportOPML() {