fix(webui): display status instead of pages on cards for books not ready

gotson · Mar 22, 2021 · dcf065f · dcf065f
1 parent a01b764
commit dcf065f
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/komga-webui/src/locales/en.json b/komga-webui/src/locales/en.json
@@ -26,6 +26,11 @@
     "penciller": "pencillers",
     "writer": "writers"
   },
+  "book_card": {
+    "error": "Error",
+    "unknown": "To be analyzed",
+    "unsupported": "Unsupported"
+  },
   "bookreader": {
     "beginning_of_book": "You're at the beginning of the book.",
     "changing_reading_direction": "Changing Reading Direction to",

diff --git a/komga-webui/src/types/items.ts b/komga-webui/src/types/items.ts
@@ -3,6 +3,7 @@ import {RawLocation} from 'vue-router/types/router'
 import {BookDto} from '@/types/komga-books'
 import {SeriesDto} from "@/types/komga-series";
 import i18n from "@/i18n";
+import {MediaStatus} from "@/types/enum-books";
 
 export enum ItemTypes {
   BOOK, SERIES, COLLECTION, READLIST
@@ -65,7 +66,13 @@ export class BookItem extends Item<BookDto> {
   }
 
   body (): string {
-    return `<span>${i18n.tc('common.pages_n', this.item.media.pagesCount)}</span>`
+    switch (this.item.media.status) {
+      case MediaStatus.ERROR: return `<div class="text-truncate error--text">${i18n.t('book_card.error')}</div>`
+      case MediaStatus.UNSUPPORTED: return `<div class="text-truncate warning--text">${i18n.t('book_card.unsupported')}</div>`
+      case MediaStatus.UNKNOWN: return `<div class="text-truncate">${i18n.t('book_card.unknown')}</div>`
+      default: return `<div class="text-truncate">${i18n.tc('common.pages_n', this.item.media.pagesCount)}</div>`
+    }
+
   }
 
   to (): RawLocation {