Simplify ItemSearchCard component

client/components/cards/ItemSearchCard.vue

@@ -2,15 +2,9 @@
   <div class="flex items-center h-full px-1 overflow-hidden">
     <covers-book-cover :library-item="libraryItem" :width="coverWidth" :book-cover-aspect-ratio="bookCoverAspectRatio" />
     <div class="flex-grow px-2 audiobookSearchCardContent">
-      <p v-if="matchKey !== 'title'" class="truncate text-sm">{{ title }}</p>
+      <p class="truncate text-sm">{{ title }}</p>
-      <p v-else class="truncate text-sm" v-html="matchHtml" />
+      <p v-if="subtitle" class="truncate text-xs text-gray-300">{{ subtitle }}</p>
-
+      <p class="text-xs text-gray-200 truncate">{{ $getString('LabelByAuthor', [authorName]) }}</p>
-      <p v-if="matchKey === 'subtitle'" class="truncate text-xs text-gray-300" v-html="matchHtml" />
-
-      <p v-if="matchKey !== 'authors'" class="text-xs text-gray-200 truncate">{{ $getString('LabelByAuthor', [authorName]) }}</p>
-      <p v-else class="truncate text-xs text-gray-200" v-html="matchHtml" />
-
-      <div v-if="matchKey === 'series' || matchKey === 'tags' || matchKey === 'isbn' || matchKey === 'asin' || matchKey === 'episode' || matchKey === 'narrators'" class="m-0 p-0 truncate text-xs" v-html="matchHtml" />
     </div>
   </div>
 </template>
@@ -21,10 +15,7 @@ export default {
     libraryItem: {
       type: Object,
       default: () => {}
-    },
+    }
-    search: String,
-    matchKey: String,
-    matchText: String
   },
   data() {
     return {}
@@ -58,23 +49,6 @@ export default {
     authorName() {
       if (this.isPodcast) return this.mediaMetadata.author || 'Unknown'
       return this.mediaMetadata.authorName || 'Unknown'
-    },
-    matchHtml() {
-      if (!this.matchText || !this.search) return ''
-
-      // This used to highlight the part of the search found
-      //        but with removing commas periods etc this is no longer plausible
-      const html = this.matchText
-
-      if (this.matchKey === 'episode') return `<p class="truncate">${this.$strings.LabelEpisode}: ${html}</p>`
-      if (this.matchKey === 'tags') return `<p class="truncate">${this.$strings.LabelTags}: ${html}</p>`
-      if (this.matchKey === 'subtitle') return `<p class="truncate">${html}</p>`
-      if (this.matchKey === 'authors') this.$getString('LabelByAuthor', [html])
-      if (this.matchKey === 'isbn') return `<p class="truncate">ISBN: ${html}</p>`
-      if (this.matchKey === 'asin') return `<p class="truncate">ASIN: ${html}</p>`
-      if (this.matchKey === 'series') return `<p class="truncate">${this.$strings.LabelSeries}: ${html}</p>`
-      if (this.matchKey === 'narrators') return `<p class="truncate">${this.$strings.LabelNarrator}: ${html}</p>`
-      return `${html}`
     }
   },
   methods: {},

client/components/controls/GlobalSearch.vue

@@ -25,7 +25,7 @@
           <template v-for="item in bookResults">
             <li :key="item.libraryItem.id" class="text-gray-50 select-none relative cursor-pointer hover:bg-black-400 py-1" role="option" @click="clickOption">
               <nuxt-link :to="`/item/${item.libraryItem.id}`">
-                <cards-item-search-card :library-item="item.libraryItem" :match-key="item.matchKey" :match-text="item.matchText" :search="lastSearch" />
+                <cards-item-search-card :library-item="item.libraryItem" />
               </nuxt-link>
             </li>
           </template>
@@ -34,7 +34,7 @@
           <template v-for="item in podcastResults">
             <li :key="item.libraryItem.id" class="text-gray-50 select-none relative cursor-pointer hover:bg-black-400 py-1" role="option" @click="clickOption">
               <nuxt-link :to="`/item/${item.libraryItem.id}`">
-                <cards-item-search-card :library-item="item.libraryItem" :match-key="item.matchKey" :match-text="item.matchText" :search="lastSearch" />
+                <cards-item-search-card :library-item="item.libraryItem" />
               </nuxt-link>
             </li>
           </template>

server/utils/queries/libraryItemsBookFilters.js

@@ -1038,26 +1038,10 @@ module.exports = {
       const libraryItem = book.libraryItem
       delete book.libraryItem
       libraryItem.media = book
-
-      let matchText = null
-      let matchKey = null
-      for (const key of ['title', 'subtitle', 'asin', 'isbn']) {
-        const valueToLower = asciiOnlyToLowerCase(book[key])
-        if (valueToLower.includes(query)) {
-          matchText = book[key]
-          matchKey = key
-          break
-        }
-      }
-
-      if (matchKey) {
       itemMatches.push({
-          matchText,
-          matchKey,
         libraryItem: Database.libraryItemModel.getOldLibraryItem(libraryItem).toJSONExpanded()
       })
     }
-    }
 
     // Search narrators
     const narratorMatches = []

server/utils/queries/libraryItemsPodcastFilters.js

@@ -361,26 +361,10 @@ module.exports = {
       const libraryItem = podcast.libraryItem
       delete podcast.libraryItem
       libraryItem.media = podcast
-
-      let matchText = null
-      let matchKey = null
-      for (const key of ['title', 'author', 'itunesId', 'itunesArtistId']) {
-        const valueToLower = asciiOnlyToLowerCase(podcast[key])
-        if (valueToLower.includes(query)) {
-          matchText = podcast[key]
-          matchKey = key
-          break
-        }
-      }
-
-      if (matchKey) {
       itemMatches.push({
-          matchText,
-          matchKey,
         libraryItem: Database.libraryItemModel.getOldLibraryItem(libraryItem).toJSONExpanded()
       })
     }
-    }
 
     // Search tags
     const tagMatches = []