From 339abe4c84f086120b5da7458473065e5137e479 Mon Sep 17 00:00:00 2001
From: nquidox <nquidox@gmail.com>
Date: Sun, 26 Oct 2025 21:33:06 +0300
Subject: [PATCH] get image update

---
 .../CollectionView/CollectionMerchCard.vue    | 17 ++++++++++----
 src/views/DetailsView/DetailsViewImages.vue   | 23 +++++++++++++------
 2 files changed, 28 insertions(+), 12 deletions(-)

diff --git a/src/views/CollectionView/CollectionMerchCard.vue b/src/views/CollectionView/CollectionMerchCard.vue
index 513daea..bb90992 100644
--- a/src/views/CollectionView/CollectionMerchCard.vue
+++ b/src/views/CollectionView/CollectionMerchCard.vue
@@ -15,22 +15,29 @@ const fileList = ref([])
 
 onMounted(async () => {
   try {
-    const imgUrl = await getImageUrl(props.merch.merch_uuid, 'thumbnail')
+    const imgUrl = getImageUrl(props.merch.merch_uuid, 'thumbnail')
+
+    await new Promise((resolve, reject) => {
+      const img = new Image()
+      img.src = imgUrl
+      img.onload = () => resolve(imgUrl)
+      img.onerror = () => reject(new Error('Image not found'))
+    })
+
     fileList.value = [
       {
-        name: 'full.jpg',
+        name: 'thumbnail.jpg',
         url: imgUrl,
         status: 'finished',
       },
     ]
   } catch (error) {
     fileList.value = []
-    if (!error.message?.includes('404')) {
-      console.error('Error getting image: ', error)
+    if (!error.message.includes('404')) {
+      console.error('Error getting thumbnail: ', error)
     }
   }
 })
-
 </script>
 
 <template>
diff --git a/src/views/DetailsView/DetailsViewImages.vue b/src/views/DetailsView/DetailsViewImages.vue
index 1ec8ab6..7284760 100644
--- a/src/views/DetailsView/DetailsViewImages.vue
+++ b/src/views/DetailsView/DetailsViewImages.vue
@@ -77,21 +77,29 @@ async function handleUpload({ fileList: newFileList }) {
 
 onMounted(async () => {
   try {
-    const imgUrl = await getImageUrl(props.merchUuid, 'full')
+    const imgUrl = getImageUrl(props.merchUuid, 'full');
+
+    await new Promise((resolve, reject) => {
+      const img = new Image();
+      img.src = imgUrl;
+      img.onload = () => resolve(imgUrl);
+      img.onerror = () => reject(new Error('Image not found'));
+    });
+
     fileList.value = [
       {
         name: 'full.jpg',
         url: imgUrl,
         status: 'finished',
       },
-    ]
+    ];
   } catch (error) {
-    fileList.value = []
-    if (!error.message?.includes('404')) {
-      console.error('Error getting image: ', error)
+    fileList.value = [];
+    if (!error.message.includes('404')) {
+      console.error('Error getting image: ', error);
     }
   }
-})
+});
 
 const showConfirmDelete = ref(false)
 
@@ -207,7 +215,8 @@ const cancelDelete = () => {
 
 .preview-container {
   display: block;
-  width: 100%;
+  width: 50%;
+  min-width: 250px;
   max-width: 400px;
   margin: 0 auto;
 }