Allow skipping to next item in queue

It's as simple as it sounds: When at the last chapter of a book (or podcast I guess?), the "Next Chapter" Button instead skips to the next item in the queue.

client/components/player/PlayerPlaybackControls.vue

@@ -20,8 +20,8 @@
           <span class="material-symbols text-2xl sm:text-3xl">forward_media</span>
         </button>
       </ui-tooltip>
-      <ui-tooltip direction="top" :text="$strings.ButtonNextChapter" class="ml-4 lg:ml-8">
-        <button :aria-label="$strings.ButtonNextChapter" :disabled="!hasNextChapter" :class="hasNextChapter ? 'text-gray-300' : 'text-gray-500'" @mousedown.prevent @mouseup.prevent @click.stop="nextChapter">
+      <ui-tooltip direction="top" :text="nextLabel()" class="ml-4 lg:ml-8">
+        <button :aria-label="nextLabel()" :disabled="!hasNextChapter && !hasNextAudiobook" :class="hasNextChapter || hasNextAudiobook ? 'text-gray-300' : 'text-gray-500'" @mousedown.prevent @mouseup.prevent @click.stop="nextChapter">
           <span class="material-symbols text-2xl sm:text-3xl">last_page</span>
         </button>
       </ui-tooltip>
@@ -43,7 +43,8 @@ export default {
     seekLoading: Boolean,
     playbackRate: Number,
     paused: Boolean,
-    hasNextChapter: Boolean
+    hasNextChapter: Boolean,
+    hasNextAudiobook: Boolean
   },
   data() {
     return {}
@@ -72,8 +73,18 @@ export default {
       this.$emit('prevChapter')
     },
     nextChapter() {
-      if (!this.hasNextChapter) return
-      this.$emit('nextChapter')
+      if (this.hasNextChapter) {
+        this.$emit('nextChapter')
+        return
+      }
+      if (this.hasNextAudiobook) {
+        this.$emit('nextAudiobook')
+        return
+      }
+    },
+    nextLabel() {
+      if (this.hasNextChapter) return this.$strings.ButtonNextChapter
+      return this.$strings.ButtonNextAudiobook
     },
     jumpBackward() {
       this.$emit('jumpBackward')

client/components/player/PlayerUi.vue

@@ -43,7 +43,21 @@
         </ui-tooltip>
       </div>
 
-      <player-playback-controls :loading="loading" :seek-loading="seekLoading" :playback-rate.sync="playbackRate" :paused="paused" :has-next-chapter="hasNextChapter" @prevChapter="prevChapter" @nextChapter="nextChapter" @jumpForward="jumpForward" @jumpBackward="jumpBackward" @setPlaybackRate="setPlaybackRate" @playPause="playPause" />
+      <player-playback-controls
+        :loading="loading"
+        :seek-loading="seekLoading"
+        :playback-rate.sync="playbackRate"
+        :paused="paused"
+        :has-next-chapter="hasNextChapter"
+        :has-next-audiobook="hasNextAudiobook"
+        @prevChapter="prevChapter"
+        @nextChapter="nextChapter"
+        @nextAudiobook="nextAudiobook"
+        @jumpForward="jumpForward"
+        @jumpBackward="jumpBackward"
+        @setPlaybackRate="setPlaybackRate"
+        @playPause="playPause"
+      />
     </div>
 
     <player-track-bar ref="trackbar" :loading="loading" :chapters="chapters" :duration="duration" :current-chapter="currentChapter" :playback-rate="playbackRate" @seek="seek" />
@@ -166,6 +180,9 @@ export default {
       if (!this.chapters.length) return false
       return this.currentChapterIndex < this.chapters.length - 1
     },
+    hasNextAudiobook() {
+      return this.playerQueueItems.length > 1
+    },
     playerQueueItems() {
       return this.$store.state.playerQueueItems || []
     },
@@ -283,6 +300,15 @@ export default {
       var nextChapter = this.chapters[this.currentChapterIndex + 1]
       this.seek(nextChapter.start)
     },
+    nextAudiobook() {
+      let nextBook = this.playerQueueItems[1]
+
+      this.$eventBus.$emit('play-item', {
+        libraryItemId: nextBook.libraryItemId,
+        episodeId: nextBook.episodeId || null,
+        queueItems: this.playerQueueItems
+      })
+    },
     setStreamReady() {
       if (this.$refs.trackbar) this.$refs.trackbar.setPercentageReady(1)
     },