open-webui/src/lib/components/chat/ModelSelector.svelte
Classic298 1756c9d5d2
fix: default pinned models stop applying after a user's first page load (#28069)
Changing "Default Pinned Models" in admin settings had no effect for anyone who had already opened Open WebUI once. The sidebar copied the admin default into that user's own settings the first time it rendered and saved it to the server, which marked them as having customized their pins, so every later change to the default was ignored for them. Merely loading the page was enough, the user never had to touch a pin.

The default is now resolved for display only, through a shared store that falls back to the admin list while the user has no pins of their own, the same way default models already work. Nothing is written to the user's settings until they actually pin, unpin or reorder something, at which point their choice takes over for good. Unpinning everything still persists an empty list rather than snapping back to the default.

Users whose settings were already overwritten by the old behaviour keep that copy, since a stored pin list cannot be told apart from a deliberate one.

Fixes a drag-reorder path that mixed sidebar positions with stored ones, and stops the sidebar section reopening itself after any unrelated settings change.
2026-08-17 00:22:51 -06:00

91 lines
2.5 KiB
Svelte

<script lang="ts">
import { models, pinnedModels, settings, user } from '$lib/stores';
import { getContext } from 'svelte';
import { toast } from 'svelte-sonner';
import Selector from './ModelSelector/Selector.svelte';
import { updateUserSettings } from '$lib/apis/users';
import equal from 'fast-deep-equal';
const i18n = getContext('i18n');
export let selectedModels = [''];
export let disabled = false;
export let showSetDefault = true;
export let triggerClassName = 'text-lg';
export let className = undefined;
export let placement: 'top' | 'bottom' | 'auto' = 'bottom';
export let align: 'start' | 'end' = 'start';
let compareModels = selectedModels.length > 1;
let selector;
export const open = () => selector?.open();
const saveDefaultModel = async () => {
const hasEmptyModel = selectedModels.filter((it) => it === '');
if (hasEmptyModel.length) {
toast.error($i18n.t('Choose a model before saving...'));
return;
}
settings.set({ ...$settings, models: selectedModels });
await updateUserSettings(localStorage.token, { ui: $settings });
toast.success($i18n.t('Default model updated'));
};
const pinModelHandler = async (modelId) => {
settings.set({
...$settings,
pinnedModels: $pinnedModels.includes(modelId)
? $pinnedModels.filter((id) => id !== modelId)
: [...$pinnedModels, modelId]
});
await updateUserSettings(localStorage.token, { ui: $settings });
};
$: if (selectedModels.length > 0 && $models.length > 0) {
const _selectedModels = selectedModels.map((model) =>
$models.map((m) => m.id).includes(model) ? model : ''
);
if (!equal(_selectedModels, selectedModels)) {
selectedModels = _selectedModels;
}
}
$: if (selectedModels.length > 1 && !compareModels) {
compareModels = true;
}
</script>
<div class="flex min-w-0 max-w-full flex-col items-start">
<div class="flex min-w-0 max-w-full">
<div class="min-w-0 max-w-full overflow-hidden">
<div class="min-w-0 max-w-full">
<Selector
bind:this={selector}
id="model"
placeholder={$i18n.t('Select a model')}
items={$models.map((model) => ({
value: model.id,
label: model.name,
model: model
}))}
{pinModelHandler}
{className}
{triggerClassName}
{placement}
{align}
{showSetDefault}
onSetDefault={saveDefaultModel}
multipleEnabled={$user?.role === 'admin' ||
($user?.permissions?.chat?.multiple_models ?? true)}
{disabled}
bind:compareEnabled={compareModels}
bind:values={selectedModels}
/>
</div>
</div>
</div>
</div>