scriptoriumadmin/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui.git synced 2026-08-28 05:27:35 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

refac

Browse source
This commit is contained in:
Timothy Jaeryang Baek 2026-05-11 01:31:46 +09:00
parent fc94118b2d
commit d1ef538237
2 changed files with 29 additions and 47 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
src/lib/components/workspace/Models/DefaultFiltersSelector.svelte
View file

@ -1,5 +1,5 @@
<script lang="ts">
import { getContext, onMount } from 'svelte';
import { getContext } from 'svelte';
import Checkbox from '$lib/components/common/Checkbox.svelte';
import Tooltip from '$lib/components/common/Tooltip.svelte';
@ -7,19 +7,6 @@
export let filters = [];
export let selectedFilterIds = [];
let _filters = {};
onMount(() => {
_filters = filters.reduce((acc, filter) => {
acc[filter.id] = {
...filter,
selected: selectedFilterIds.includes(filter.id)
};
return acc;
}, {});
});
</script>
<div>
@ -30,21 +17,27 @@
<div class="flex flex-col">
{#if filters.length > 0}
<div class=" flex items-center flex-wrap">
{#each Object.keys(_filters) as filter, filterIdx}
{#each filters as filter}
{@const isSelected = selectedFilterIds.includes(filter.id)}
<div class=" flex items-center gap-2 mr-3">
<div class="self-center flex items-center">
<Checkbox
state={_filters[filter].selected ? 'checked' : 'unchecked'}
state={isSelected ? 'checked' : 'unchecked'}
on:change={(e) => {
_filters[filter].selected = e.detail === 'checked';
selectedFilterIds = Object.keys(_filters).filter((t) => _filters[t].selected);
if (e.detail === 'checked') {
if (!selectedFilterIds.includes(filter.id)) {
selectedFilterIds = [...selectedFilterIds, filter.id];
}
} else {
selectedFilterIds = selectedFilterIds.filter((id) => id !== filter.id);
}
}}
/>
</div>
<div class=" py-0.5 text-sm w-full capitalize font-medium">
<Tooltip content={_filters[filter].meta.description}>
{_filters[filter].name}
<Tooltip content={filter.meta.description}>
{filter.name}
</Tooltip>
</div>
</div>

43
src/lib/components/workspace/Models/FiltersSelector.svelte
View file

@ -1,5 +1,5 @@
<script lang="ts">
import { getContext, onMount } from 'svelte';
import { getContext } from 'svelte';
import Checkbox from '$lib/components/common/Checkbox.svelte';
import Tooltip from '$lib/components/common/Tooltip.svelte';
@ -7,19 +7,6 @@
export let filters = [];
export let selectedFilterIds = [];
let _filters = {};
onMount(() => {
_filters = filters.reduce((acc, filter) => {
acc[filter.id] = {
...filter,
selected: selectedFilterIds.includes(filter.id)
};
return acc;
}, {});
});
</script>
{#if filters.length > 0}
@ -28,31 +15,33 @@
<div class=" self-center text-xs font-medium text-gray-500">{$i18n.t('Filters')}</div>
</div>
<!-- TODO: Filer order matters -->
<!-- TODO: Filter order matters -->
<div class="flex flex-col">
<div class=" flex items-center flex-wrap">
{#each Object.keys(_filters) as filter, filterIdx}
{#each filters as filter}
{@const isSelected = filter.is_global || selectedFilterIds.includes(filter.id)}
<div class=" flex items-center gap-2 mr-3">
<div class="self-center flex items-center">
<Checkbox
state={_filters[filter].is_global
? 'checked'
: _filters[filter].selected
? 'checked'
: 'unchecked'}
disabled={_filters[filter].is_global}
state={isSelected ? 'checked' : 'unchecked'}
disabled={filter.is_global}
on:change={(e) => {
if (!_filters[filter].is_global) {
_filters[filter].selected = e.detail === 'checked';
selectedFilterIds = Object.keys(_filters).filter((t) => _filters[t].selected);
if (filter.is_global) return;
if (e.detail === 'checked') {
if (!selectedFilterIds.includes(filter.id)) {
selectedFilterIds = [...selectedFilterIds, filter.id];
}
} else {
selectedFilterIds = selectedFilterIds.filter((id) => id !== filter.id);
}
}}
/>
</div>
<div class=" py-0.5 text-sm w-full capitalize font-medium">
<Tooltip content={_filters[filter].meta.description}>
{_filters[filter].name}
<Tooltip content={filter.meta.description}>
{filter.name}
</Tooltip>
</div>
</div>