From 350a0aeb4538df4af21337467e89a15700e224d8 Mon Sep 17 00:00:00 2001 From: Towsty Date: Mon, 31 Aug 2026 21:33:19 -0500 Subject: [PATCH] Show Settings LoRA aliases in picker lists instead of filenames. Co-authored-by: Cursor --- components/LoraSelect.vue | 21 +++++++++++++++------ components/SettingsForm.vue | 9 ++++++--- pages/index.vue | 6 ++++++ pages/queue.vue | 10 +++++++--- utils/loras.ts | 13 +++++++++++-- 5 files changed, 45 insertions(+), 14 deletions(-) diff --git a/components/LoraSelect.vue b/components/LoraSelect.vue index 1a6f385..9a13c60 100644 --- a/components/LoraSelect.vue +++ b/components/LoraSelect.vue @@ -31,10 +31,10 @@ > - {{ loraDisplayName(item.name) }} + {{ labelFor(item.name) }} @@ -91,7 +91,7 @@ v-for="name in availableNames" :key="name" :value="name" - >{{ loraDisplayName(name) }} + >{{ labelFor(name) }} @@ -103,7 +103,7 @@ import { LORA_STRENGTH_MIN, LORA_STRENGTH_STEP, clampLoraStrength, - loraDisplayName, + loraFriendlyName, loraIdentityKey, loraTriggerFor, makeLoraStackItem, @@ -120,6 +120,7 @@ const props = withDefaults(defineProps<{ disabled?: boolean clipStrength?: boolean triggers?: Record + aliases?: Record }>(), { label: 'LoRA', emptyLabel: 'None', @@ -128,7 +129,8 @@ const props = withDefaults(defineProps<{ compact: false, disabled: false, clipStrength: true, - triggers: () => ({}) + triggers: () => ({}), + aliases: () => ({}) }) const emit = defineEmits<{ @@ -143,7 +145,10 @@ const dragOverIndex = ref(null) const availableNames = computed(() => { const taken = new Set(model.value.map(item => loraIdentityKey(item.name))) - return props.names.filter(name => !taken.has(loraIdentityKey(name))) + return props.names + .filter(name => !taken.has(loraIdentityKey(name))) + .slice() + .sort((a, b) => labelFor(a).localeCompare(labelFor(b), undefined, { sensitivity: 'base' })) }) const selectPlaceholder = computed(() => { @@ -220,6 +225,10 @@ function triggerFor(name: string) { return loraTriggerFor(name, props.triggers) } +function labelFor(name: string) { + return loraFriendlyName(name, props.aliases) +} + function saveTrigger(name: string, trigger: string) { emit('update-trigger', name, trigger) } diff --git a/components/SettingsForm.vue b/components/SettingsForm.vue index f0313fd..12dee74 100644 --- a/components/SettingsForm.vue +++ b/components/SettingsForm.vue @@ -202,8 +202,11 @@ class="flex flex-col gap-2 rounded-2xl border border-white/10 bg-zinc-950/50 px-4 py-3 sm:flex-row sm:items-center" >
-

{{ row.file }}

-

{{ row.kind === 'both' ? 'Image · Video' : row.kind }}

+

{{ row.draft || row.file }}

+

+ {{ row.kind === 'both' ? 'Image · Video' : row.kind }} + · {{ row.file }} +

{ if (!q) return true const hay = `${row.file} ${row.draft} ${row.trigger} ${row.key} ${row.placeholder}`.toLowerCase() return hay.includes(q) - }) + }).sort((a, b) => (a.draft || a.file).localeCompare(b.draft || b.file, undefined, { sensitivity: 'base' })) }) const loginUser = ref('') const loginCurrent = ref('') diff --git a/pages/index.vue b/pages/index.vue index 1fa3ac3..c332495 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -458,6 +458,7 @@ :model-value="shotLoraStacks[shot.n] || []" :names="videoLoraOptions" :triggers="loraTriggers" + :aliases="loraAliases" label="LoRA" empty-label="Default" add-label="Add LoRA" @@ -523,6 +524,7 @@ :model-value="item.loraStack || []" :names="videoLoraOptions" :triggers="loraTriggers" + :aliases="loraAliases" label="LoRA" empty-label="Default" add-label="Add LoRA" @@ -749,6 +751,7 @@ v-model="videoLoraStack" :names="videoLoraOptions" :triggers="loraTriggers" + :aliases="loraAliases" label="LoRA" empty-label="None" compact @@ -811,6 +814,7 @@ v-model="imageV2LoraStack" :names="imageV2LoraOptions" :triggers="loraTriggers" + :aliases="loraAliases" label="LoRA" empty-label="Add LoRA" missing-label="Wake GPU to load LoRAs" @@ -935,6 +939,7 @@ v-model="imageLoraStack" :names="imageLoraOptions" :triggers="loraTriggers" + :aliases="loraAliases" label="LoRA" empty-label="None" compact @@ -1401,6 +1406,7 @@ v-model="extendLoraStack" :names="videoLoraOptions" :triggers="loraTriggers" + :aliases="loraAliases" label="LoRA" empty-label="Same as clip / none" compact diff --git a/pages/queue.vue b/pages/queue.vue index 22df9cd..e6212ea 100644 --- a/pages/queue.vue +++ b/pages/queue.vue @@ -194,6 +194,7 @@ :model-value="readLoraStack(segment)" :names="videoLoraOptions" :triggers="loraTriggers" + :aliases="loraAliases" label="LoRA" empty-label="Default" add-label="Add LoRA" @@ -225,7 +226,7 @@ >

{{ job.kind === 'edit' ? `Pass ${index + 1}` : `Shot ${index + 1}` }} · queued with this job

{{ shot.prompt }}

-

{{ loraStackLabel(readLoraStack(shot)) }}

+

{{ loraStackLabel(readLoraStack(shot), loraAliases) }}

@@ -339,6 +340,7 @@ :model-value="readLoraStack(segment)" :names="videoLoraOptions" :triggers="loraTriggers" + :aliases="loraAliases" label="LoRA" empty-label="Default" add-label="Add LoRA" @@ -465,6 +467,7 @@ type PendingRemove = { const videoLoras = ref([]) const loraTriggers = ref>({}) +const loraAliases = ref>({}) const jobs = ref([]) const orphans = ref([]) const waitingCount = ref(0) @@ -640,7 +643,7 @@ async function saveLoraTrigger(name: string, trigger: string) { function segmentLoraLabel(queue: Queue, segment: Segment) { const stack = readLoraStack(segment).length ? readLoraStack(segment) : readLoraStack(queue) - return loraStackLabel(stack) + return loraStackLabel(stack, loraAliases.value) } function segmentClass(queue: Queue, segment: Segment) { @@ -1040,8 +1043,9 @@ onMounted(async () => { void $fetch<{ video?: string[] }>('/api/loras').then((listed) => { videoLoras.value = listed.video || [] }).catch(() => null) - void $fetch<{ loraTriggers?: Record }>('/api/library?light=1').then((library) => { + void $fetch<{ loraTriggers?: Record; loraAliases?: Record }>('/api/library?light=1').then((library) => { if (library.loraTriggers) loraTriggers.value = library.loraTriggers + if (library.loraAliases) loraAliases.value = library.loraAliases }).catch(() => null) window.addEventListener('keydown', onRemoveKey) await loadQueues().catch((err: any) => { diff --git a/utils/loras.ts b/utils/loras.ts index 5b77fb7..60639b9 100644 --- a/utils/loras.ts +++ b/utils/loras.ts @@ -67,6 +67,15 @@ export function loraDisplayName(name: string) { return loraBasename(name).replace(/\.(safetensors|sft|ckpt|pt|bin)$/i, '') } +export function loraAliasFor(name: string, aliases: Record = {}) { + const id = loraIdentityKey(name) + return String(aliases[id] || aliases[loraBasename(name).toLowerCase()] || '').trim() +} + +export function loraFriendlyName(name: string, aliases: Record = {}) { + return loraAliasFor(name, aliases) || loraDisplayName(name) +} + export function normalizeLoraName(raw: unknown) { const value = String(raw || '').trim().replace(/\\/g, '/') if (!value) return '' @@ -175,8 +184,8 @@ export function primaryLoraName(stack?: LoraStackItem[] | null) { return stack?.[0]?.name || '' } -export function loraStackLabel(stack?: LoraStackItem[] | null) { - return (stack || []).map(item => loraDisplayName(item.name)).join(' · ') +export function loraStackLabel(stack?: LoraStackItem[] | null, aliases: Record = {}) { + return (stack || []).map(item => loraFriendlyName(item.name, aliases)).join(' · ') } export function persistLoraFields(stack?: unknown) {