1 files changed, 9 insertions, 7 deletions

diff --git a/viewer/src/views/GalleryNavigation.vue b/viewer/src/views/GalleryNavigation.vue
index fd1f19a..fdd3922 100644
--- a/viewer/src/views/GalleryNavigation.vue
+++ b/viewer/src/views/GalleryNavigation.vue
@@ -21,15 +21,15 @@
   <div>
     <ld-error v-if="isError" icon="folder-open" :message="$t('gallery.unknown-resource')" />
     <gallery-search v-else-if="isSearch" :path="path" />
-    <component :is="componentName" v-else :item="$galleryStore.currentItem" />
+    <component :is="componentName" v-else :key="componentKey" :item="$galleryStore.currentItem" />
   </div>
 </template>
 
 <script lang="ts">
-import { Component, Vue, Prop, Watch } from "vue-property-decorator";
 import { ItemType } from "@/@types/ItemType";
 import Navigation from "@/services/navigation";
 import GallerySearch from "@/views/GallerySearch.vue";
+import { Component, Prop, Vue, Watch } from "vue-property-decorator";
 
 @Component({
   components: {
@@ -41,13 +41,13 @@ export default class GalleryNavigation extends Vue {
   @Prop(Array) readonly query!: string[];
 
   readonly COMPONENT_BY_TYPE: Record<ItemType, string> = {
-    directory: "ld-directory",
-    picture: "ld-picture",
+    directory: "ld-directory-viewer",
+    picture: "ld-picture-viewer",
     plaintext: "ld-plain-text-viewer",
     pdf: "ld-pdf-viewer",
     video: "ld-video-viewer",
     audio: "ld-audio-viewer",
-    other: "ld-download",
+    other: "ld-download-viewer",
   };
 
   mounted() {
@@ -66,6 +66,10 @@ export default class GalleryNavigation extends Vue {
     return this.COMPONENT_BY_TYPE[this.$galleryStore.currentItem?.properties.type ?? ItemType.OTHER];
   }
 
+  get componentKey() {
+    return this.$galleryStore.currentItem?.path ?? "";
+  }
+
   @Watch("path")
   pathChanged() {
     this.$galleryStore.setCurrentPath(this.path);
@@ -76,5 +80,3 @@ export default class GalleryNavigation extends Vue {
   }
 }
 </script>
-
-<style lang="scss"></style>