From 07c0187423b748520cd7b7bf422480ddebb2ed6f Mon Sep 17 00:00:00 2001
From: advplyr <advplyr@protonmail.com>
Date: Sat, 18 Jan 2025 14:15:34 -0600
Subject: [PATCH] Update podcast items incomplete episodes display

---
 components/cards/LazyBookCard.vue     |  4 ++--
 components/cards/LazyListBookCard.vue | 21 ++++++++++++++-------
 strings/en-us.json                    |  1 +
 3 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/components/cards/LazyBookCard.vue b/components/cards/LazyBookCard.vue
index de3ab7a8..a83e622c 100644
--- a/components/cards/LazyBookCard.vue
+++ b/components/cards/LazyBookCard.vue
@@ -94,8 +94,8 @@
     </div>
 
     <!-- Podcast Num Episodes Incomplete -->
-    <div v-else-if="numEpisodesIncomplete && !isSelectionMode" class="absolute rounded-full bg-black bg-opacity-90 box-shadow-md z-10 flex items-center justify-center" :style="{ top: 0.375 * sizeMultiplier + 'rem', right: 0.375 * sizeMultiplier + 'rem', width: 1.25 * sizeMultiplier + 'rem', height: 1.25 * sizeMultiplier + 'rem' }">
-      <p class="text-white" :style="{ fontSize: sizeMultiplier * 0.8 + 'rem' }">{{ numEpisodesIncomplete }}</p>
+    <div v-else-if="numEpisodesIncomplete && !isSelectionMode" class="absolute rounded-full bg-yellow-400 box-shadow-md z-10 flex items-center justify-center" :style="{ top: 0.375 * sizeMultiplier + 'rem', right: 0.375 * sizeMultiplier + 'rem', width: 1.25 * sizeMultiplier + 'rem', height: 1.25 * sizeMultiplier + 'rem' }">
+      <p class="text-black" :style="{ fontSize: sizeMultiplier * 0.8 + 'rem' }">{{ numEpisodesIncomplete }}</p>
     </div>
   </div>
 </template>
diff --git a/components/cards/LazyListBookCard.vue b/components/cards/LazyListBookCard.vue
index c44adfac..aa38dbb0 100644
--- a/components/cards/LazyListBookCard.vue
+++ b/components/cards/LazyListBookCard.vue
@@ -21,7 +21,13 @@
         <p class="truncate text-fg-muted" :style="{ fontSize: 0.7 * sizeMultiplier + 'rem' }">{{ displayAuthor }}</p>
         <p v-if="displaySortLine" class="truncate text-fg-muted" :style="{ fontSize: 0.7 * sizeMultiplier + 'rem' }">{{ displaySortLine }}</p>
         <p v-if="duration" class="truncate text-fg-muted" :style="{ fontSize: 0.7 * sizeMultiplier + 'rem' }">{{ $elapsedPretty(duration) }}</p>
-        <p v-if="episodes" class="truncate text-fg-muted" :style="{ fontSize: 0.7 * sizeMultiplier + 'rem' }">{{ episodes }}</p>
+
+        <p v-if="numEpisodesIncomplete" class="truncate text-fg-muted" :style="{ fontSize: 0.7 * sizeMultiplier + 'rem' }">
+          {{ $getString('LabelNumEpisodesIncomplete', [numEpisodes, numEpisodesIncomplete]) }}
+        </p>
+        <p v-else-if="numEpisodes" class="truncate text-fg-muted" :style="{ fontSize: 0.7 * sizeMultiplier + 'rem' }">
+          {{ $getString('LabelNumEpisodes', [numEpisodes]) }}
+        </p>
       </div>
 
       <div v-if="localLibraryItem || isLocal" class="absolute top-0 right-0 z-20" :style="{ top: 0.375 * sizeMultiplier + 'rem', right: 0.375 * sizeMultiplier + 'rem', padding: `${0.1 * sizeMultiplier}rem ${0.25 * sizeMultiplier}rem` }">
@@ -106,12 +112,13 @@ export default {
     isPodcast() {
       return this.mediaType === 'podcast'
     },
-    episodes() {
-      if (this.isPodcast) {
-        return this.$getString('LabelNumEpisodes', [this.media.numEpisodes])
-      } else {
-        return null
-      }
+    numEpisodes() {
+      if (this.isLocal && this.isPodcast && this.media.episodes) return this.media.episodes.length
+      return this.media.numEpisodes
+    },
+    numEpisodesIncomplete() {
+      if (this.isLocal) return 0
+      return this._libraryItem.numEpisodesIncomplete || 0
     },
     placeholderUrl() {
       return '/book_placeholder.jpg'
diff --git a/strings/en-us.json b/strings/en-us.json
index 8504a7dd..3d59ba4b 100644
--- a/strings/en-us.json
+++ b/strings/en-us.json
@@ -195,6 +195,7 @@
   "LabelNotFinished": "Not Finished",
   "LabelNotStarted": "Not Started",
   "LabelNumEpisodes": "{0} episodes",
+  "LabelNumEpisodesIncomplete": "{0} episodes, {1} incomplete",
   "LabelOff": "Off",
   "LabelOn": "On",
   "LabelPassword": "Password",