From b0b44287d866f9480a0ead7dc5a1dc1ba6707319 Mon Sep 17 00:00:00 2001
From: Oleg Zharkov <oleg.zharkov22@gmail.com>
Date: Fri, 20 Nov 2020 18:10:04 +0100
Subject: [PATCH] fix image as path

---
 .../Dataset/DatasetAsImage/DatasetAsImage.vue        | 12 ++++++++----
 .../Markdown/Elements/HistoryDatasetAsImage.vue      | 10 ++++++----
 2 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/client/src/components/Dataset/DatasetAsImage/DatasetAsImage.vue b/client/src/components/Dataset/DatasetAsImage/DatasetAsImage.vue
index 1b7e19e201c..bf1ac33c718 100644
--- a/client/src/components/Dataset/DatasetAsImage/DatasetAsImage.vue
+++ b/client/src/components/Dataset/DatasetAsImage/DatasetAsImage.vue
@@ -1,6 +1,10 @@
 <template>
     <div>
-        <img v-if="imgUrl" :src="imgUrl" />
+        <div v-if="imageUrl" class="w-50 p-2 float-left">
+            <b-card nobody body-class="p-1">
+                <b-img :src="imageUrl" fluid />
+            </b-card>
+        </div>
         <div v-else>
             <b>Image is not found</b>
         </div>
@@ -26,13 +30,13 @@ export default {
         if (this.path) {
             this.fetchPathDestination({ history_dataset_id: this.history_dataset_id, path: this.path }).then(() => {
                 const pathDestination = this.$store.getters.pathDestination(this.history_dataset_id, this.path);
-                this.imgUrl = pathDestination.fileLink;
+                this.imageUrl = pathDestination.fileLink;
             });
-        } else this.imgUrl = `${getAppRoot()}dataset/display?dataset_id=${this.history_dataset_id}`;
+        } else this.imageUrl = `${getAppRoot()}dataset/display?dataset_id=${this.history_dataset_id}`;
     },
     data() {
         return {
-            imgUrl: undefined,
+            imageUrl: undefined,
         };
     },
     methods: {
diff --git a/client/src/components/Markdown/Elements/HistoryDatasetAsImage.vue b/client/src/components/Markdown/Elements/HistoryDatasetAsImage.vue
index 2fa2a06915d..ddbda951731 100644
--- a/client/src/components/Markdown/Elements/HistoryDatasetAsImage.vue
+++ b/client/src/components/Markdown/Elements/HistoryDatasetAsImage.vue
@@ -1,8 +1,6 @@
 <template>
-    <div class="w-50 p-2 float-left">
-        <b-card nobody body-class="p-1">
-            <b-img :src="imageUrl" fluid />
-        </b-card>
+    <div>
+        <DatasetAsImage :path="args.path" :history_dataset_id="args.history_dataset_id" />
     </div>
 </template>
 
@@ -10,10 +8,14 @@
 import Vue from "vue";
 import BootstrapVue from "bootstrap-vue";
 import { getAppRoot } from "onload/loadConfig";
+import DatasetAsImage from "components/Dataset/DatasetAsImage/DatasetAsImage";
 
 Vue.use(BootstrapVue);
 
 export default {
+    components: {
+        DatasetAsImage,
+    },
     props: {
         args: {
             type: Object,