Spaces:
Paused
Paused
File size: 1,746 Bytes
55bd140 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 |
<script>
import Sortable from 'sortablejs';
import { onMount } from 'svelte';
import { chatId, mobile, models, settings, showSidebar } from '$lib/stores';
import { WEBUI_BASE_URL } from '$lib/constants';
import { updateUserSettings } from '$lib/apis/users';
import PinnedModelItem from './PinnedModelItem.svelte';
export let selectedChatId = null;
export let shiftKey = false;
const initPinnedModelsSortable = () => {
const pinnedModelsList = document.getElementById('pinned-models-list');
if (pinnedModelsList && !$mobile) {
new Sortable(pinnedModelsList, {
animation: 150,
onUpdate: async (event) => {
const modelId = event.item.dataset.id;
const newIndex = event.newIndex;
const pinnedModels = $settings.pinnedModels;
const oldIndex = pinnedModels.indexOf(modelId);
pinnedModels.splice(oldIndex, 1);
pinnedModels.splice(newIndex, 0, modelId);
settings.set({ ...$settings, pinnedModels: pinnedModels });
await updateUserSettings(localStorage.token, { ui: $settings });
}
});
}
};
onMount(() => {
initPinnedModelsSortable();
});
</script>
<div class="mt-0.5 pb-1.5" id="pinned-models-list">
{#each $settings.pinnedModels as modelId (modelId)}
{@const model = $models.find((model) => model.id === modelId)}
{#if model}
<PinnedModelItem
{model}
{shiftKey}
onClick={() => {
selectedChatId = null;
chatId.set('');
if ($mobile) {
showSidebar.set(false);
}
}}
onUnpin={() => {
const pinnedModels = $settings.pinnedModels.filter((id) => id !== modelId);
settings.set({ ...$settings, pinnedModels });
updateUserSettings(localStorage.token, { ui: $settings });
}}
/>
{/if}
{/each}
</div>
|