From ecc98924e3903ab399c07482ce226a57c165f325 Mon Sep 17 00:00:00 2001
From: Flycro <flycro@live.de>
Date: Thu, 21 Mar 2024 12:40:21 +0100
Subject: [PATCH] feat: Add Preview for Local Files

---
 nuxt/components/modal/NewBookRecommendation.vue | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/nuxt/components/modal/NewBookRecommendation.vue b/nuxt/components/modal/NewBookRecommendation.vue
index d226368..41708b9 100644
--- a/nuxt/components/modal/NewBookRecommendation.vue
+++ b/nuxt/components/modal/NewBookRecommendation.vue
@@ -91,6 +91,13 @@ async function onSubmit() {
     },
   })
 }
+function isFile(value: any): value is File {
+  return value instanceof File
+}
+
+function getFileUrl(file: File) {
+  return URL.createObjectURL(file)
+}
 </script>
 
 <template>
@@ -123,6 +130,9 @@ async function onSubmit() {
           <UFormGroup label="Beschreibung" name="description">
             <UTextarea v-model="state.description" />
           </UFormGroup>
+          <ClientOnly>
+            <img v-if="state.cover_image && isFile(state.cover_image)" :src="getFileUrl(state.cover_image)" alt="Cover" class="size-1/3 content-center rounded-lg">
+          </ClientOnly>
           <UFormGroup label="Cover" name="cover_image">
             <UInput type="file" @change="handleCoverImageInput" />
           </UFormGroup>