viewer: more minor architectural and performance improvement

6 files changed, 16 insertions, 17 deletions

diff --git a/viewer/src/components/LdCommandSearch.vue b/viewer/src/components/LdCommandSearch.vue
index bd18060..3d95eb0 100644
--- a/viewer/src/components/LdCommandSearch.vue
+++ b/viewer/src/components/LdCommandSearch.vue
@@ -23,7 +23,7 @@
       <fa-icon icon="eraser" />
       <span>{{$t('command.search.clear')}}</span>
     </b-button>
-    <b-button expanded :loading="loading" @click="search">
+    <b-button expanded @click="search">
       <fa-icon icon="search" />
       <span>{{$t('command.search.search')}}</span>
     </b-button>
@@ -35,8 +35,6 @@ import { Component, Vue, Emit } from "vue-property-decorator";
 
 @Component
 export default class LdCommandSearch extends Vue {
-  loading: boolean = false;
-
   @Emit()
   clear(e: HTMLButtonElement) {
     return e;
@@ -44,8 +42,6 @@ export default class LdCommandSearch extends Vue {
 
   @Emit()
   search(e: HTMLButtonElement) {
-    this.loading = true;
-    this.$nextTick(() => (this.loading = false));
     return e;
   }
 }
diff --git a/viewer/src/components/LdGallery.vue b/viewer/src/components/LdGallery.vue
index 16e9f7c..cd4bc28 100644
--- a/viewer/src/components/LdGallery.vue
+++ b/viewer/src/components/LdGallery.vue
@@ -19,11 +19,9 @@
 
 <template>
   <div class="thumbnail-tiles">
-    <div v-for="item in items" :key="item.path">
-      <router-link :to="item.path">
-        <ld-thumbnail :item="item" />
-      </router-link>
-    </div>
+    <router-link v-for="item in items" :key="item.path" :to="item.path">
+      <ld-thumbnail :item="item" />
+    </router-link>
     <div v-if="hasNoResults()" class="noresult">{{noresult}}</div>
   </div>
 </template>
diff --git a/viewer/src/store/galleryStore.ts b/viewer/src/store/galleryStore.ts
index bc43ed2..4a5de0f 100644
--- a/viewer/src/store/galleryStore.ts
+++ b/viewer/src/store/galleryStore.ts
@@ -95,7 +95,15 @@ export default class GalleryStore extends VuexModule {
     // Indexes the gallery
     @action async indexTags() {
         const root = this.galleryIndex?.tree ?? null;
-        this.setTagsIndex(IndexFactory.generateTags(root));
+        const index = IndexFactory.generateTags(root);
+        this.setTagsIndex(index);
+        return index;
     }
 
+    // Searches for tags
+    @action async search(filters: string[]) {
+        const results = filters.flatMap(filter => IndexFactory.searchTags(this.tagsIndex, filter, true));
+        this.setCurrentSearch(results);
+        return results;
+    }
 }
diff --git a/viewer/src/views/GallerySearch.vue b/viewer/src/views/GallerySearch.vue
index e3369b3..e75a37e 100644
--- a/viewer/src/views/GallerySearch.vue
+++ b/viewer/src/views/GallerySearch.vue
@@ -39,6 +39,7 @@ export default class GalleryPicture extends Vue {
 
   destroyed() {
     this.$uiStore.toggleSearchMode(false);
+    this.$galleryStore.setCurrentSearch([]);
   }
 
   items() {
diff --git a/viewer/src/views/MainLayout.vue b/viewer/src/views/MainLayout.vue
index 6ab7d9a..53917da 100644
--- a/viewer/src/views/MainLayout.vue
+++ b/viewer/src/views/MainLayout.vue
@@ -27,7 +27,7 @@
     <panel-left v-if="!isLoading" class="layout layout-left" />
     <router-view v-if="!isLoading" ref="content" class="layout layout-content scrollbar" />
     <b-loading :active="isLoading" is-full-page />
-    <ld-key-press :keycode="27" @action="$uiStore.fullscreen=false" />
+    <ld-key-press :keycode="27" @action="$uiStore.toggleFullscreen(false)" />
   </div>
 </template>
 
diff --git a/viewer/src/views/PanelLeft.vue b/viewer/src/views/PanelLeft.vue
index 5b3196a..9e9a600 100644
--- a/viewer/src/views/PanelLeft.vue
+++ b/viewer/src/views/PanelLeft.vue
@@ -70,11 +70,7 @@ export default class PanelLeft extends Vue {
   @Watch("$route")
   restoreSearchFilters(route: Route) {
     const query = Object.keys(route.query);
-    if (query.length > 0) {
-      const tagsIndex = this.$galleryStore.tagsIndex;
-      this.searchFilters = Object.keys(route.query).flatMap(filter => IndexFactory.searchTags(tagsIndex, filter, true));
-      this.$galleryStore.setCurrentSearch([...this.searchFilters]);
-    }
+    if (query.length > 0) this.$galleryStore.search(query).then(search => (this.searchFilters = [...search]));
   }
 }
 </script>