refac/enh: model default filter/feature

src/lib/components/workspace/Models/ModelEditor.svelte

@@ -1,8 +1,14 @@
 <script lang="ts">
+	import { toast } from 'svelte-sonner';
+
 	import { onMount, getContext, tick } from 'svelte';
 	import { models, tools, functions, knowledge as knowledgeCollections, user } from '$lib/stores';
 	import { WEBUI_BASE_URL } from '$lib/constants';
 
+	import { getTools } from '$lib/apis/tools';
+	import { getFunctions } from '$lib/apis/functions';
+	import { getKnowledgeBases } from '$lib/apis/knowledge';
+
 	import AdvancedParams from '$lib/components/chat/Settings/Advanced/AdvancedParams.svelte';
 	import Tags from '$lib/components/common/Tags.svelte';
 	import Knowledge from '$lib/components/workspace/Models/Knowledge.svelte';
@@ -11,15 +17,11 @@
 	import ActionsSelector from '$lib/components/workspace/Models/ActionsSelector.svelte';
 	import Capabilities from '$lib/components/workspace/Models/Capabilities.svelte';
 	import Textarea from '$lib/components/common/Textarea.svelte';
-	import { getTools } from '$lib/apis/tools';
-	import { getFunctions } from '$lib/apis/functions';
-	import { getKnowledgeBases } from '$lib/apis/knowledge';
 	import AccessControl from '../common/AccessControl.svelte';
-	import { stringify } from 'postcss';
-	import { toast } from 'svelte-sonner';
 	import Spinner from '$lib/components/common/Spinner.svelte';
 	import XMark from '$lib/components/icons/XMark.svelte';
-	import { getNoteList } from '$lib/apis/notes';
+	import DefaultFiltersSelector from './DefaultFiltersSelector.svelte';
+	import DefaultFeatures from './DefaultFeatures.svelte';
 
 	const i18n = getContext('i18n');
 
@@ -79,6 +81,13 @@
 	let params = {
 		system: ''
 	};
+
+	let knowledge = [];
+	let toolIds = [];
+
+	let filterIds = [];
+	let defaultFilterIds = [];
+
 	let capabilities = {
 		vision: true,
 		file_upload: true,
@@ -89,12 +98,9 @@
 		status_updates: true,
 		usage: undefined
 	};
+	let defaultFeatureIds = [];
 
-	let knowledge = [];
-	let toolIds = [];
-	let filterIds = [];
 	let actionIds = [];
-
 	let accessControl = {};
 
 	const addUsage = (base_model_id) => {
@@ -172,6 +178,14 @@
 			}
 		}
 
+		if (defaultFilterIds.length > 0) {
+			info.meta.defaultFilterIds = defaultFilterIds;
+		} else {
+			if (info.meta.defaultFilterIds) {
+				delete info.meta.defaultFilterIds;
+			}
+		}
+
 		if (actionIds.length > 0) {
 			info.meta.actionIds = actionIds;
 		} else {
@@ -180,6 +194,14 @@
 			}
 		}
 
+		if (defaultFeatureIds.length > 0) {
+			info.meta.defaultFeatureIds = defaultFeatureIds;
+		} else {
+			if (info.meta.defaultFeatureIds) {
+				delete info.meta.defaultFeatureIds;
+			}
+		}
+
 		info.params.system = system.trim() === '' ? null : system;
 		info.params.stop = params.stop ? params.stop.split(',').filter((s) => s.trim()) : null;
 		Object.keys(info.params).forEach((key) => {
@@ -236,9 +258,6 @@
 					)
 				: null;
 
-			toolIds = model?.meta?.toolIds ?? [];
-			filterIds = model?.meta?.filterIds ?? [];
-			actionIds = model?.meta?.actionIds ?? [];
 			knowledge = (model?.meta?.knowledge ?? []).map((item) => {
 				if (item?.collection_name && item?.type !== 'file') {
 					return {
@@ -257,7 +276,14 @@
 					return item;
 				}
 			});
+
+			toolIds = model?.meta?.toolIds ?? [];
+			filterIds = model?.meta?.filterIds ?? [];
+			defaultFilterIds = model?.meta?.defaultFilterIds ?? [];
+			actionIds = model?.meta?.actionIds ?? [];
+
 			capabilities = { ...capabilities, ...(model?.meta?.capabilities ?? {}) };
+			defaultFeatureIds = model?.meta?.defaultFeatureIds ?? [];
 
 			if ('access_control' in model) {
 				accessControl = model.access_control;
@@ -725,6 +751,21 @@
 						/>
 					</div>
 
+					{#if filterIds.length > 0}
+						{@const toggleableFilters = $functions.filter(
+							(func) => func.type === 'filter' && filterIds.includes(func.id) && func?.meta?.toggle
+						)}
+
+						{#if toggleableFilters.length > 0}
+							<div class="my-2">
+								<DefaultFiltersSelector
+									bind:selectedFilterIds={defaultFilterIds}
+									filters={toggleableFilters}
+								/>
+							</div>
+						{/if}
+					{/if}
+
 					<div class="my-2">
 						<ActionsSelector
 							bind:selectedActionIds={actionIds}
@@ -736,6 +777,21 @@
 						<Capabilities bind:capabilities />
 					</div>
 
+					{#if Object.keys(capabilities).filter((key) => capabilities[key]).length > 0}
+						{@const availableFeatures = Object.entries(capabilities)
+							.filter(
+								([key, value]) =>
+									value && ['web_search', 'code_interpreter', 'image_generation'].includes(key)
+							)
+							.map(([key, value]) => key)}
+
+						{#if availableFeatures.length > 0}
+							<div class="my-2">
+								<DefaultFeatures {availableFeatures} bind:featureIds={defaultFeatureIds} />
+							</div>
+						{/if}
+					{/if}
+
 					<div class="my-2 text-gray-300 dark:text-gray-700">
 						<div class="flex w-full justify-between mb-2">
 							<div class=" self-center text-sm font-semibold">{$i18n.t('JSON Preview')}</div>