Comfy-Org/ComfyUI_frontend
1
0
Fork 0
mirror of https://github.com/Comfy-Org/ComfyUI_frontend.git synced 2026-04-30 03:01:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(UploadModel): truncate long filenames in confirmation and progress views

Browse Source
This commit is contained in:
DrJKL
2026-01-09 19:32:40 -08:00
parent 4b095f3701
commit e240db9d8d
2 changed files with 17 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/platform/assets/components/UploadModelConfirmation.vue
View File

@@ -5,15 +5,15 @@
{{ $t('assetBrowser.modelAssociatedWithLink') }} {{ $t('assetBrowser.modelAssociatedWithLink') }}
</p> </p>
<div <div
class="flex items-center gap-3 bg-secondary-background p-3 rounded-lg" class="flex items-center gap-3 rounded-lg bg-secondary-background p-3"
> >
<img <img
v-if="previewImage" v-if="previewImage"
:src="previewImage" :src="previewImage"
:alt="metadata?.filename || metadata?.name || 'Model preview'" :alt="metadata?.filename || metadata?.name || 'Model preview'"
class="w-14 h-14 rounded object-cover flex-shrink-0" class="size-14 flex-shrink-0 rounded object-cover"
/> />
<p class="m-0 text-base-foreground"> <p class="m-0 min-w-0 flex-1 truncate text-base-foreground">
{{ metadata?.filename || metadata?.name }} {{ metadata?.filename || metadata?.name }}
</p> </p>
</div> </div>

25
src/platform/assets/components/UploadModelProgress.vue
View File

@@ -10,19 +10,21 @@
</p> </p>
<div <div
class="flex flex-row items-center gap-3 p-4 bg-modal-card-background rounded-lg" class="flex flex-row items-center gap-3 rounded-lg bg-modal-card-background p-4"
> >
<img <img
v-if="previewImage" v-if="previewImage"
:src="previewImage" :src="previewImage"
:alt="metadata?.filename || metadata?.name || 'Model preview'" :alt="metadata?.filename || metadata?.name || 'Model preview'"
class="w-14 h-14 rounded object-cover flex-shrink-0" class="size-14 flex-shrink-0 rounded object-cover"
/> />
<div class="flex flex-col justify-center items-start gap-1 flex-1"> <div
<p class="text-base-foreground m-0"> class="flex min-w-0 flex-1 flex-col items-start justify-center gap-1"
>
<p class="m-0 w-full truncate text-base-foreground">
{{ metadata?.filename || metadata?.name }} {{ metadata?.filename || metadata?.name }}
</p> </p>
<p class="text-sm text-muted m-0"> <p class="m-0 text-sm text-muted">
{{ modelType }} {{ modelType }}
</p> </p>
</div> </div>
@@ -39,20 +41,21 @@
</p> </p>
<div <div
class="flex flex-row items-center gap-3 p-4 bg-modal-card-background rounded-lg" class="flex flex-row items-center gap-3 rounded-lg bg-modal-card-background p-4"
> >
<img <img
v-if="previewImage" v-if="previewImage"
:src="previewImage" :src="previewImage"
:alt="metadata?.filename || metadata?.name || 'Model preview'" :alt="metadata?.filename || metadata?.name || 'Model preview'"
class="w-14 h-14 rounded object-cover flex-shrink-0" class="size-14 flex-shrink-0 rounded object-cover"
/> />
<div class="flex flex-col justify-center items-start gap-1 flex-1"> <div
<p class="text-base-foreground m-0"> class="flex min-w-0 flex-1 flex-col items-start justify-center gap-1"
>
<p class="m-0 w-full truncate text-base-foreground">
{{ metadata?.filename || metadata?.name }} {{ metadata?.filename || metadata?.name }}
</p> </p>
<p class="text-sm text-muted m-0"> <p class="m-0 text-sm text-muted">
<!-- Going to want to add another translation here to get a nice display name. -->
{{ modelType }} {{ modelType }}
</p> </p>
</div> </div>