OpenWebUI/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui synced 2025-06-15 02:41:30 +00:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

refac

Browse Source
This commit is contained in:
Timothy Jaeryang Baek 2025-05-16 23:21:08 +04:00
parent b61efcf54a
commit e37433f2b1
2 changed files with 59 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/lib/components/chat/Chat.svelte
View File

@ -195,10 +195,12 @@
$: if (selectedModels) { $: if (selectedModels) {
setToolIds(); setToolIds();
setFilterIds();
} }
$: if (atSelectedModel || selectedModels) { $: if (atSelectedModel || selectedModels) {
setToolIds(); setToolIds();
setFilterIds();
} }
const setToolIds = async () => { const setToolIds = async () => {
@ -218,6 +220,17 @@
} }
}; };
const setFilterIds = async () => {
if (selectedModels.length !== 1 && !atSelectedModel) {
selectedFilterIds = [];
}
const model = atSelectedModel ?? $models.find((m) => m.id === selectedModels[0]);
if (model) {
selectedFilterIds = model?.info?.meta?.filterIds ?? [];
}
};
const showMessage = async (message) => { const showMessage = async (message) => {
const _chatId = JSON.parse(JSON.stringify($chatId)); const _chatId = JSON.parse(JSON.stringify($chatId));
let _messageId = JSON.parse(JSON.stringify(message.id)); let _messageId = JSON.parse(JSON.stringify(message.id));

52
src/lib/components/chat/MessageInput.svelte
View File

@ -49,9 +49,9 @@
import Headphone from '../icons/Headphone.svelte'; import Headphone from '../icons/Headphone.svelte';
import GlobeAlt from '../icons/GlobeAlt.svelte'; import GlobeAlt from '../icons/GlobeAlt.svelte';
import Photo from '../icons/Photo.svelte'; import Photo from '../icons/Photo.svelte';
import LightBlub from '../icons/LightBlub.svelte';
import Wrench from '../icons/Wrench.svelte'; import Wrench from '../icons/Wrench.svelte';
import CommandLine from '../icons/CommandLine.svelte'; import CommandLine from '../icons/CommandLine.svelte';
import Sparkles from '../icons/Sparkles.svelte';
import { KokoroWorker } from '$lib/workers/KokoroWorker'; import { KokoroWorker } from '$lib/workers/KokoroWorker';
@ -120,10 +120,10 @@
(model) => $models.find((m) => m.id === model)?.info?.meta?.capabilities?.vision ?? true (model) => $models.find((m) => m.id === model)?.info?.meta?.capabilities?.vision ?? true
); );
let reasoningCapableModels = []; let toggleFilters = [];
$: reasoningCapableModels = $models $: toggleFilters = (atSelectedModel?.id || selectedModels)
.filter((model) => model.info?.meta?.capabilities?.reasoning ?? false) .map((id) => ($models.find((model) => model.id === id) || {})?.filters ?? [])
.map((model) => model.id); .reduce((acc, filters) => acc.filter((f1) => filters.some((f2) => f2.id === f1.id)));
const scrollToBottom = () => { const scrollToBottom = () => {
const element = document.getElementById('messages-container'); const element = document.getElementById('messages-container');
@ -363,7 +363,6 @@
</script> </script>
<FilesOverlay show={dragged} /> <FilesOverlay show={dragged} />
<ToolServersModal bind:show={showTools} {selectedToolIds} /> <ToolServersModal bind:show={showTools} {selectedToolIds} />
{#if loaded} {#if loaded}
@ -1151,6 +1150,47 @@
{/if} {/if}
{#if $_user} {#if $_user}
{#each toggleFilters as filter, filterIdx (filter.id)}
<Tooltip content={filter?.description} placement="top">
<button
on:click|preventDefault={() => {
if (selectedFilterIds.includes(filter.id)) {
selectedFilterIds = selectedFilterIds.filter(
(id) => id !== filter.id
);
} else {
selectedFilterIds = [...selectedFilterIds, filter.id];
}
}}
type="button"
class="px-1.5 @xl:px-2.5 py-1.5 flex gap-1.5 items-center text-sm rounded-full font-medium transition-colors duration-300 focus:outline-hidden max-w-full overflow-hidden border {selectedFilterIds.includes(
filter.id
)
? 'bg-gray-50 dark:bg-gray-400/10 border-gray-100 dark:border-gray-700 text-gray-600 dark:text-gray-400'
: 'bg-transparent border-transparent text-gray-600 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 '} capitalize"
>
{#if filter?.icon_url}
<div class="size-5">
<img
src={filter?.icon_url}
class="size-5 {filter.icon_url.includes('svg')
? 'dark:invert-[80%]'
: ''}"
style="fill: currentColor;"
alt={filter?.name}
/>
</div>
{:else}
<Sparkles className="size-5" strokeWidth="1.75" />
{/if}
<span
class="hidden @xl:block whitespace-nowrap overflow-hidden text-ellipsis translate-y-[0.5px]"
>{filter?.name}</span
>
</button>
</Tooltip>
{/each}
{#if $config?.features?.enable_web_search && ($_user.role === 'admin' || $_user?.permissions?.features?.web_search)} {#if $config?.features?.enable_web_search && ($_user.role === 'admin' || $_user?.permissions?.features?.web_search)}
<Tooltip content={$i18n.t('Search the internet')} placement="top"> <Tooltip content={$i18n.t('Search the internet')} placement="top">
<button <button