From 12e243683f6bf41529ad77bf396b885b63ef11cf Mon Sep 17 00:00:00 2001
From: Gauthier Roebroeck <gauthier.roebroeck@gmail.com>
Date: Thu, 19 Sep 2024 15:44:31 +0800
Subject: [PATCH] feat(webui): display KEPUB as book format for kepub files

---
 .../src/components/dialogs/TransientBookDetailsDialog.vue | 4 ++--
 komga-webui/src/functions/book-format.ts                  | 8 ++++----
 komga-webui/src/types/komga-books.ts                      | 1 +
 komga-webui/src/views/BrowseBook.vue                      | 4 ++--
 komga-webui/src/views/BrowseOneshot.vue                   | 4 ++--
 5 files changed, 11 insertions(+), 10 deletions(-)

diff --git a/komga-webui/src/components/dialogs/TransientBookDetailsDialog.vue b/komga-webui/src/components/dialogs/TransientBookDetailsDialog.vue
index 27fc43bc..99c01ef7 100644
--- a/komga-webui/src/components/dialogs/TransientBookDetailsDialog.vue
+++ b/komga-webui/src/components/dialogs/TransientBookDetailsDialog.vue
@@ -69,7 +69,7 @@
 import Vue, {PropType} from 'vue'
 import {TransientBookDto} from '@/types/komga-transientbooks'
 import {BookDto, PageDto} from '@/types/komga-books'
-import {getBookFormatFromMediaType} from '@/functions/book-format'
+import {getBookFormatFromMedia} from '@/functions/book-format'
 import PagesTable from '@/components/PagesTable.vue'
 
 export default Vue.extend({
@@ -78,7 +78,7 @@ export default Vue.extend({
   data: () => {
     return {
       modal: false,
-      getBookFormatFromMediaType,
+      getBookFormatFromMediaType: getBookFormatFromMedia,
     }
   },
   props: {
diff --git a/komga-webui/src/functions/book-format.ts b/komga-webui/src/functions/book-format.ts
index f01b3144..193ca42a 100644
--- a/komga-webui/src/functions/book-format.ts
+++ b/komga-webui/src/functions/book-format.ts
@@ -1,8 +1,8 @@
 import {BookFormat, MediaDto} from '@/types/komga-books'
 import {lowerCase} from 'lodash'
 
-export function getBookFormatFromMediaType(mediaType: string): BookFormat {
-  switch (mediaType) {
+export function getBookFormatFromMedia(media: MediaDto): BookFormat {
+  switch (media.mediaType) {
     case 'application/x-rar-compressed':
     case 'application/x-rar-compressed; version=4':
       return {type: 'CBR', color: '#03A9F4'}
@@ -11,11 +11,11 @@ export function getBookFormatFromMediaType(mediaType: string): BookFormat {
     case 'application/pdf':
       return {type: 'PDF', color: '#FF5722'}
     case 'application/epub+zip':
-      return {type: 'EPUB', color: '#ff5ab1'}
+      return media.epubIsKepub ? {type: 'KEPUB', color: '#ff5ab1'} : {type: 'EPUB', color: '#ff5ab1'}
     case 'application/x-rar-compressed; version=5':
       return {type: 'RAR5', color: '#000000'}
     default:
-      return {type: mediaType, color: '#000000'}
+      return {type: media.mediaType, color: '#000000'}
   }
 }
 
diff --git a/komga-webui/src/types/komga-books.ts b/komga-webui/src/types/komga-books.ts
index a7a4b3ce..4f914521 100644
--- a/komga-webui/src/types/komga-books.ts
+++ b/komga-webui/src/types/komga-books.ts
@@ -30,6 +30,7 @@ export interface MediaDto {
   comment: string,
   mediaProfile: string,
   epubDivinaCompatible: boolean,
+  epubIsKepub: boolean,
 }
 
 export interface PageDto {
diff --git a/komga-webui/src/views/BrowseBook.vue b/komga-webui/src/views/BrowseBook.vue
index e0c4c78a..41197a99 100644
--- a/komga-webui/src/views/BrowseBook.vue
+++ b/komga-webui/src/views/BrowseBook.vue
@@ -409,7 +409,7 @@ import BookActionsMenu from '@/components/menus/BookActionsMenu.vue'
 import ItemCard from '@/components/ItemCard.vue'
 import ToolbarSticky from '@/components/bars/ToolbarSticky.vue'
 import {groupAuthorsByRole} from '@/functions/authors'
-import {getBookFormatFromMediaType, getBookReadRouteFromMedia} from '@/functions/book-format'
+import {getBookFormatFromMedia, getBookReadRouteFromMedia} from '@/functions/book-format'
 import {getPagesLeft, getReadProgress, getReadProgressPercentage} from '@/functions/book-progress'
 import {getBookTitleCompact} from '@/functions/book-title'
 import {bookFileUrl, bookThumbnailUrl} from '@/functions/urls'
@@ -509,7 +509,7 @@ export default Vue.extend({
       return bookFileUrl(this.bookId)
     },
     format(): BookFormat {
-      return getBookFormatFromMediaType(this.book.media.mediaType)
+      return getBookFormatFromMedia(this.book.media)
     },
     authorsByRole(): any {
       return groupAuthorsByRole(this.book.metadata.authors)
diff --git a/komga-webui/src/views/BrowseOneshot.vue b/komga-webui/src/views/BrowseOneshot.vue
index 9d8a02d6..d979697b 100644
--- a/komga-webui/src/views/BrowseOneshot.vue
+++ b/komga-webui/src/views/BrowseOneshot.vue
@@ -484,7 +484,7 @@ import BookActionsMenu from '@/components/menus/BookActionsMenu.vue'
 import ItemCard from '@/components/ItemCard.vue'
 import ToolbarSticky from '@/components/bars/ToolbarSticky.vue'
 import {groupAuthorsByRole} from '@/functions/authors'
-import {getBookFormatFromMediaType, getBookReadRouteFromMedia} from '@/functions/book-format'
+import {getBookFormatFromMedia, getBookReadRouteFromMedia} from '@/functions/book-format'
 import {getPagesLeft, getReadProgress, getReadProgressPercentage} from '@/functions/book-progress'
 import {getBookTitleCompact} from '@/functions/book-title'
 import {bookFileUrl, seriesThumbnailUrl} from '@/functions/urls'
@@ -618,7 +618,7 @@ export default Vue.extend({
       return bookFileUrl(this.book.id)
     },
     format(): BookFormat {
-      return getBookFormatFromMediaType(this.book.media.mediaType)
+      return getBookFormatFromMedia(this.book.media)
     },
     authorsByRole(): any {
       return groupAuthorsByRole(this.book.metadata.authors)