add thumbnail for 3d generation (#8129)

## Summary

add thrumbnail for 3d genations, feature requested by @PabloWiedemann 

## Screenshots


https://github.com/user-attachments/assets/4fb9b88b-dd7b-4a69-a70c-e850472d3498

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-8129-add-thumbnail-for-3d-generation-2eb6d73d365081f2a30bc698a4fde6e0)
by [Unito](https://www.unito.io)

src/platform/assets/components/Media3DTop.vue

@@ -1,12 +1,35 @@
 <template>
   <div class="relative size-full overflow-hidden rounded">
+    <img
+      v-if="!thumbnailError"
+      :src="thumbnailSrc"
+      :alt="asset?.name"
+      class="size-full object-contain transition-transform duration-300 group-hover:scale-105 group-data-[selected=true]:scale-105"
+      @error="thumbnailError = true"
+    />
     <div
+      v-else
       class="flex size-full flex-col items-center justify-center gap-2 bg-modal-card-placeholder-background transition-transform duration-300 group-hover:scale-105 group-data-[selected=true]:scale-105"
     >
       <i class="icon-[lucide--box] text-3xl text-muted-foreground" />
-      <span class="text-sm text-base-foreground">{{
-        $t('assetBrowser.media.threeDModelPlaceholder')
-      }}</span>
+      <span class="text-sm text-base-foreground">
+        {{ $t('assetBrowser.media.threeDModelPlaceholder') }}
+      </span>
     </div>
   </div>
 </template>
+
+<script setup lang="ts">
+import { computed, ref } from 'vue'
+
+import type { AssetMeta } from '../schemas/mediaAssetSchema'
+
+const { asset } = defineProps<{ asset: AssetMeta }>()
+
+const thumbnailError = ref(false)
+
+const thumbnailSrc = computed(() => {
+  if (!asset?.src) return ''
+  return asset.src.replace(/([?&]filename=)([^&]*)/, '$1$2.png')
+})
+</script>