From c5414b6f432db9831b0387454926dde70d276b09 Mon Sep 17 00:00:00 2001
From: Santo Cariotti <santo@dcariotti.me>
Date: Sat, 24 Sep 2022 16:29:57 +0200
Subject: Use preview-image for cover

---
 components/ModelBoxCard.vue | 30 +++++++-----------------------
 1 file changed, 7 insertions(+), 23 deletions(-)

(limited to 'components/ModelBoxCard.vue')

diff --git a/components/ModelBoxCard.vue b/components/ModelBoxCard.vue
index 6ac9f43..a6085b7 100644
--- a/components/ModelBoxCard.vue
+++ b/components/ModelBoxCard.vue
@@ -3,10 +3,11 @@
     class="hover:ease-out hover:shadow-md"
   )
     a(:href="'/models/'+model.id")
-      .image.bg-gray-900.rounded-xl.w-full.h-48
-        img(
-          v-if="coverImage >= 0"
-          :src="baseAPI + '' + model.uploads[coverImage].filepath"
+      .image.bg-gray-900.rounded-xl.w-full.h-48.overflow-hidden
+        file-preview(
+          :path="model.uploads[0].filepath" 
+          bg="#111827"
+          v-if="model.uploads"
         )
 
     .space-y-3.mt-5
@@ -24,38 +25,21 @@
 
 <script>
 import UserAvatar from "@/components/UserAvatar.vue";
+import FilePreview from "@/components/FilePreview.vue";
 
 export default {
   name: "ModelBoxCard",
   props: ["model"],
   components: {
     "user-avatar": UserAvatar,
+    "file-preview": FilePreview,
   },
   data() {
     return {
-      coverImage: -1,
       baseAPI: "",
     };
   },
-  methods: {
-    imageIndex(uploads) {
-      if (!uploads) return -1;
-
-      for (const i in uploads) {
-        if (
-          uploads[i].filepath.indexOf(".png") ||
-          uploads[i].filepath.indexOf(".jpg") ||
-          uploads[i].filepath.indexOf(".jpeg") ||
-          uploads[i].filepath.indexOf(".webp")
-        )
-          return i;
-      }
-
-      return -1;
-    },
-  },
   created() {
-    this.coverImage = this.imageIndex(this.model.uploads);
     this.baseAPI = this.$config.api;
   },
 };
-- 
cgit v1.2.3-71-g8e6c

