Skip to content

Commit 6bf8059

Browse files
ServeurpersoComallozaur
authored and
fm240223
committed
webui: introduce OpenAI-compatible model selector in JSON payload (ggml-org#16562)
* webui: introduce OpenAI-compatible model selector in JSON payload * webui: restore OpenAI-Compatible model source of truth and unify metadata capture This change re-establishes a single, reliable source of truth for the active model: fully aligned with the OpenAI-Compat API behavior It introduces a unified metadata flow that captures the model field from both streaming and non-streaming responses, wiring a new onModel callback through ChatService The model name is now resolved directly from the API payload rather than relying on server /props or UI assumptions ChatStore records and persists the resolved model for each assistant message during streaming, ensuring consistency across the UI and database Type definitions for API and settings were also extended to include model metadata and the onModel callback, completing the alignment with OpenAI-Compat semantics * webui: address review feedback from allozaur * webui: move model selector into ChatForm (idea by @allozaur) * webui: make model selector more subtle and integrated into ChatForm * webui: replaced the Flowbite selector with a native Svelte dropdown * webui: add developer setting to toggle the chat model selector * webui: address review feedback from allozaur Normalized streamed model names during chat updates by trimming input and removing directory components before saving or persisting them, so the conversation UI shows only the filename Forced model names within the chat form selector dropdown to render as a single-line, truncated entry with a tooltip revealing the full name * webui: toggle displayed model source for legacy vs OpenAI-Compat modes When the selector is disabled, it falls back to the active server model name from /props When the model selector is enabled, the displayed model comes from the message metadata (the one explicitly selected and sent in the request) * Update tools/server/webui/src/lib/components/app/chat/ChatForm/ChatFormActions.svelte Co-authored-by: Aleksander Grygier <aleksander.grygier@gmail.com> * Update tools/server/webui/src/lib/constants/localstorage-keys.ts Co-authored-by: Aleksander Grygier <aleksander.grygier@gmail.com> * Update tools/server/webui/src/lib/components/app/chat/ChatForm/ChatFormModelSelector.svelte Co-authored-by: Aleksander Grygier <aleksander.grygier@gmail.com> * Update tools/server/webui/src/lib/components/app/chat/ChatMessages/ChatMessageAssistant.svelte Co-authored-by: Aleksander Grygier <aleksander.grygier@gmail.com> * Update tools/server/webui/src/lib/services/chat.ts Co-authored-by: Aleksander Grygier <aleksander.grygier@gmail.com> * Update tools/server/webui/src/lib/services/chat.ts Co-authored-by: Aleksander Grygier <aleksander.grygier@gmail.com> * webui: refactor model selector and persistence helpers - Replace inline portal and event listeners with proper Svelte bindings - Introduce 'persisted' store helper for localStorage sync without runes - Extract 'normalizeModelName' utils + Vitest coverage - Simplify ChatFormModelSelector structure and cleanup logic Replaced the persisted store helper's use of '$state/$effect' runes with a plain TS implementation to prevent orphaned effect runtime errors outside component context Co-authored-by: Aleksander Grygier <aleksander.grygier@gmail.com> * webui: document normalizeModelName usage with inline examples * Update tools/server/webui/src/lib/components/app/chat/ChatForm/ChatFormModelSelector.svelte Co-authored-by: Aleksander Grygier <aleksander.grygier@gmail.com> * Update tools/server/webui/src/lib/stores/models.svelte.ts Co-authored-by: Aleksander Grygier <aleksander.grygier@gmail.com> * Update tools/server/webui/src/lib/stores/models.svelte.ts Co-authored-by: Aleksander Grygier <aleksander.grygier@gmail.com> * webui: extract ModelOption type into dedicated models.d.ts Co-authored-by: Aleksander Grygier <aleksander.grygier@gmail.com> * webui: refine ChatMessageAssistant displayedModel source logic * webui: stabilize dropdown, simplify model extraction, and init assistant model field * chore: update webui static build * Update tools/server/webui/src/lib/components/app/chat/ChatMessages/ChatMessageAssistant.svelte Co-authored-by: Aleksander Grygier <aleksander.grygier@gmail.com> * chore: npm format, update webui static build * webui: align sidebar trigger position, remove z-index glitch * chore: update webui build output --------- Co-authored-by: Aleksander Grygier <aleksander.grygier@gmail.com>
1 parent 75cffa9 commit 6bf8059

File tree

22 files changed

+955
-67
lines changed

22 files changed

+955
-67
lines changed

‎tools/server/public/index.html.gz‎

4.38 KB
Binary file not shown.

‎tools/server/webui/src/lib/components/app/chat/ChatForm/ChatFormActions.svelte‎

Lines changed: 30 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@
33
import { Button } from '$lib/components/ui/button';
44
import ChatFormActionFileAttachments from './ChatFormActionFileAttachments.svelte';
55
import ChatFormActionRecord from './ChatFormActionRecord.svelte';
6+
import ChatFormModelSelector from './ChatFormModelSelector.svelte';
7+
import { config } from '$lib/stores/settings.svelte';
68
import type { FileTypeCategory } from '$lib/enums/files';
79
810
interface Props {
@@ -26,32 +28,36 @@
2628
onMicClick,
2729
onStop
2830
}: Props = $props();
31+
32+
let currentConfig = $derived(config());
2933
</script>
3034

31-
<div class="flex items-center justify-between gap-1 {className}">
32-
<ChatFormActionFileAttachments {disabled} {onFileUpload} />
35+
<div class="flex w-full items-center gap-2 {className}">
36+
<ChatFormActionFileAttachments class="mr-auto" {disabled} {onFileUpload} />
37+
38+
{#if currentConfig.modelSelectorEnabled}
39+
<ChatFormModelSelector class="shrink-0" />
40+
{/if}
3341

34-
<div class="flex gap-2">
35-
{#if isLoading}
36-
<Button
37-
type="button"
38-
onclick={onStop}
39-
class="h-8 w-8 bg-transparent p-0 hover:bg-destructive/20"
40-
>
41-
<span class="sr-only">Stop</span>
42-
<Square class="h-8 w-8 fill-destructive stroke-destructive" />
43-
</Button>
44-
{:else}
45-
<ChatFormActionRecord {disabled} {isLoading} {isRecording} {onMicClick} />
42+
{#if isLoading}
43+
<Button
44+
type="button"
45+
onclick={onStop}
46+
class="h-8 w-8 bg-transparent p-0 hover:bg-destructive/20"
47+
>
48+
<span class="sr-only">Stop</span>
49+
<Square class="h-8 w-8 fill-destructive stroke-destructive" />
50+
</Button>
51+
{:else}
52+
<ChatFormActionRecord {disabled} {isLoading} {isRecording} {onMicClick} />
4653

47-
<Button
48-
type="submit"
49-
disabled={!canSend || disabled || isLoading}
50-
class="h-8 w-8 rounded-full p-0"
51-
>
52-
<span class="sr-only">Send</span>
53-
<ArrowUp class="h-12 w-12" />
54-
</Button>
55-
{/if}
56-
</div>
54+
<Button
55+
type="submit"
56+
disabled={!canSend || disabled || isLoading}
57+
class="h-8 w-8 rounded-full p-0"
58+
>
59+
<span class="sr-only">Send</span>
60+
<ArrowUp class="h-12 w-12" />
61+
</Button>
62+
{/if}
5763
</div>

0 commit comments

Comments
 (0)