Add:Scan button on libraries table

client/components/tables/library/LibraryItem.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="w-full pl-2 pr-4 md:px-4 h-12 border border-white border-opacity-10 flex items-center relative -mt-px" :class="selected ? 'bg-primary bg-opacity-50' : 'hover:bg-primary hover:bg-opacity-25'" @mouseover="mouseover = true" @mouseleave="mouseover = false">
     <div v-show="selected" class="absolute top-0 left-0 h-full w-0.5 bg-warning z-10" />
-    <ui-library-icon v-if="!libraryScan" :icon="library.icon" :size="6" font-size="lg md:text-xl" class="text-white" :class="isHovering ? 'text-opacity-90' : 'text-opacity-50'" />
+    <ui-library-icon v-if="!isScanning" :icon="library.icon" :size="6" font-size="lg md:text-xl" class="text-white" :class="isHovering ? 'text-opacity-90' : 'text-opacity-50'" />
     <svg v-else viewBox="0 0 24 24" class="h-6 w-6 text-white text-opacity-50 animate-spin">
       <path fill="currentColor" d="M12,4V2A10,10 0 0,0 2,12H4A8,8 0 0,1 12,4Z" />
     </svg>
@@ -9,11 +9,14 @@
 
     <div class="flex-grow" />
 
+    <!-- Scan button only shown on desktop -->
+    <ui-btn v-if="!isScanning && !isDeleting" color="bg" class="hidden md:block mx-2 text-xs" :padding-y="1" :padding-x="3" @click.stop="scanBtnClick">{{ this.$strings.ButtonScan }}</ui-btn>
+
     <!-- Desktop context menu icon -->
-    <ui-context-menu-dropdown v-if="!libraryScan && !isDeleting" :items="contextMenuItems" :icon-class="`text-1.5xl text-gray-${isHovering ? 50 : 400}`" class="!hidden md:!block" @action="contextMenuAction" />
+    <ui-context-menu-dropdown v-if="!isScanning && !isDeleting" :items="contextMenuItems" :icon-class="`text-1.5xl text-gray-${isHovering ? 50 : 400}`" class="!hidden md:!block" @action="contextMenuAction" />
 
     <!-- Mobile context menu icon -->
-    <span v-if="!libraryScan && !isDeleting" class="!block md:!hidden material-icons text-xl text-gray-300 ml-3 cursor-pointer" @click.stop="showMenu">more_vert</span>
+    <span v-if="!isScanning && !isDeleting" class="!block md:!hidden material-icons text-xl text-gray-300 ml-3 cursor-pointer" @click.stop="showMenu">more_vert</span>
 
     <div v-show="isDeleting" class="text-xl text-gray-300 ml-3 animate-spin">
       <svg viewBox="0 0 24 24" class="w-6 h-6">
@@ -48,8 +51,8 @@ export default {
     isHovering() {
       return this.mouseover && !this.dragging
     },
-    libraryScan() {
-      return this.$store.getters['scanners/getLibraryScan'](this.library.id)
+    isScanning() {
+      return !!this.$store.getters['tasks/getRunningLibraryScanTask'](this.library.id)
     },
     mediaType() {
       return this.library.mediaType
@@ -89,6 +92,9 @@ export default {
     }
   },
   methods: {
+    scanBtnClick() {
+      this.scan()
+    },
     contextMenuAction({ action }) {
       this.showMobileMenu = false
       if (action === 'edit') {

client/layouts/default.vue

@@ -123,15 +123,6 @@ export default {
     init(payload) {
       console.log('Init Payload', payload)
 
-      // Remove any current scans that are no longer running
-      var currentScans = [...this.$store.state.scanners.libraryScans]
-      currentScans.forEach((ls) => {
-        if (!payload.librariesScanning || !payload.librariesScanning.find((_ls) => _ls.id === ls.id)) {
-          this.$toast.dismiss(ls.toastId)
-          this.$store.commit('scanners/remove', ls)
-        }
-      })
-
       if (payload.usersOnline) {
         this.$store.commit('users/setUsersOnline', payload.usersOnline)
       }

client/store/scanners.js

@@ -84,7 +84,7 @@ export const actions = {
 
 export const mutations = {
   addUpdate(state, data) {
-    var index = state.libraryScans.findIndex(lib => lib.id === data.id)
+    const index = state.libraryScans.findIndex(lib => lib.id === data.id)
     if (index >= 0) {
       state.libraryScans.splice(index, 1, data)
     } else {

client/store/tasks.js

@@ -6,7 +6,10 @@ export const state = () => ({
 
 export const getters = {
   getTasksByLibraryItemId: (state) => (libraryItemId) => {
-    return state.tasks.filter(t => t.data && t.data.libraryItemId === libraryItemId)
+    return state.tasks.filter(t => t.data?.libraryItemId === libraryItemId)
+  },
+  getRunningLibraryScanTask: (state) => (libraryId) => {
+    return state.tasks.find(t => t.data?.libraryId === libraryId && !t.isFinished)
   }
 }
 

server/Server.js

@@ -86,10 +86,6 @@ class Server {
     LibraryScanner.setCancelLibraryScan(libraryId)
   }
 
-  getLibrariesScanning() {
-    return LibraryScanner.librariesScanning
-  }
-
   /**
    * Initialize database, backups, logs, rss feeds, cron jobs & watcher
    * Cleanup stale/invalid data

server/SocketAuthority.js

@@ -179,8 +179,7 @@ class SocketAuthority {
 
     const initialPayload = {
       userId: client.user.id,
-      username: client.user.username,
-      librariesScanning: this.Server.getLibrariesScanning()
+      username: client.user.username
     }
     if (user.isAdminOrUp) {
       initialPayload.usersOnline = this.getUsersOnline()