From 2a49060962fafd8ead55d26d1dda56604d53b910 Mon Sep 17 00:00:00 2001
From: "Michal Dziekonski (mdz)" <michal.dziekonski+github@gmail.com>
Date: Sun, 15 Sep 2024 12:12:26 +0200
Subject: [PATCH] fix(HistoryPanel): Fix History thumbnails of files in folders
 (#2010)

---
 .../panels/History/HistoryListEntryJob.vue    | 38 ++++++++-----------
 1 file changed, 16 insertions(+), 22 deletions(-)

diff --git a/src/components/panels/History/HistoryListEntryJob.vue b/src/components/panels/History/HistoryListEntryJob.vue
index aa8da85d9..d6444cfc4 100644
--- a/src/components/panels/History/HistoryListEntryJob.vue
+++ b/src/components/panels/History/HistoryListEntryJob.vue
@@ -134,6 +134,7 @@ import { Component, Mixins, Prop } from 'vue-property-decorator'
 import HistoryListPanelDetailsDialog from '@/components/dialogs/HistoryListPanelDetailsDialog.vue'
 import Panel from '@/components/ui/Panel.vue'
 import BaseMixin from '@/components/mixins/base'
+import { FileStateFileThumbnail } from '@/store/files/types'
 import { ServerHistoryStateJob } from '@/store/server/history/types'
 import { thumbnailBigMin, thumbnailSmallMax, thumbnailSmallMin } from '@/store/variables'
 import {
@@ -187,40 +188,22 @@ export default class HistoryListPanel extends Mixins(BaseMixin) {
         if ((this.item.metadata?.thumbnails?.length ?? 0) < 1) return false
 
         const thumbnail = this.item.metadata?.thumbnails?.find(
-            (thumb: any) =>
+            (thumb) =>
                 thumb.width >= thumbnailSmallMin &&
                 thumb.width <= thumbnailSmallMax &&
                 thumb.height >= thumbnailSmallMin &&
                 thumb.height <= thumbnailSmallMax
         )
 
-        let relative_url = ''
-        if (this.item.filename.lastIndexOf('/') !== -1) {
-            relative_url = this.item.filename.substring(0, this.item.filename.lastIndexOf('/'))
-        }
-
-        if ((thumbnail?.relative_path ?? null) === null) return false
-
-        return `${this.apiUrl}/server/files/gcodes/${encodeURI(relative_url + thumbnail?.relative_path)}?timestamp=${
-            this.item.metadata.modified
-        }`
+        return thumbnail ? this.createThumbnailUrl(thumbnail) : false
     }
 
     get bigThumbnail() {
         if ((this.item.metadata?.thumbnails?.length ?? 0) < 1) return false
 
-        const thumbnail = this.item.metadata?.thumbnails?.find((thumb: any) => thumb.width >= thumbnailBigMin)
-
-        let relative_url = ''
-        if (this.item.filename.lastIndexOf('/') !== -1) {
-            relative_url = this.item.filename.substring(0, this.item.filename.lastIndexOf('/') + 1)
-        }
-
-        if ((thumbnail?.relative_path ?? null) === null) return false
+        const thumbnail = this.item.metadata?.thumbnails?.find((thumb) => thumb.width >= thumbnailBigMin)
 
-        return `${this.apiUrl}/server/files/gcodes/${encodeURI(relative_url + thumbnail?.relative_path)}?timestamp=${
-            this.item.metadata.modified
-        }`
+        return thumbnail ? this.createThumbnailUrl(thumbnail) : false
     }
 
     get statusIcon() {
@@ -331,5 +314,16 @@ export default class HistoryListPanel extends Mixins(BaseMixin) {
                 return value
         }
     }
+
+    createThumbnailUrl(thumbnail: FileStateFileThumbnail) {
+        let relative_url = ''
+        if (this.item.filename.lastIndexOf('/') !== -1) {
+            relative_url = this.item.filename.substring(0, this.item.filename.lastIndexOf('/') + 1)
+        }
+
+        return `${this.apiUrl}/server/files/gcodes/${encodeURI(relative_url + thumbnail.relative_path)}?timestamp=${
+            this.item.metadata.modified
+        }`
+    }
 }
 </script>