webui: Architecture and UI improvements (#19596)

tools/server/webui/src/lib/stores/chat.svelte.ts

@@ -137,6 +137,7 @@ class ChatStore {
 	clearUIState(): void {
 		this.isLoading = false;
 		this.currentResponse = '';
+		this.isStreamingActive = false;
 	}
 
 	// ─────────────────────────────────────────────────────────────────────────────

tools/server/webui/src/lib/stores/conversations.svelte.ts

@@ -1,7 +1,7 @@
 import { browser } from '$app/environment';
 import { goto } from '$app/navigation';
 import { toast } from 'svelte-sonner';
-import { DatabaseService } from '$lib/services/database';
+import { DatabaseService } from '$lib/services/database.service';
 import { config } from '$lib/stores/settings.svelte';
 import { filterByLeafNodeId, findLeafNode } from '$lib/utils';
 import { AttachmentType } from '$lib/enums';
@@ -241,7 +241,9 @@ class ConversationsStore {
 
 		const leafNodeId =
 			this.activeConversation.currNode ||
-			allMessages.reduce((latest, msg) => (msg.timestamp > latest.timestamp ? msg : latest)).id;
+			allMessages.reduce((latest: DatabaseMessage, msg: DatabaseMessage) =>
+				msg.timestamp > latest.timestamp ? msg : latest
+			).id;
 
 		const currentPath = filterByLeafNodeId(allMessages, leafNodeId, false) as DatabaseMessage[];
 
@@ -341,9 +343,11 @@ class ConversationsStore {
 		if (!this.activeConversation) return;
 
 		const allMessages = await DatabaseService.getConversationMessages(this.activeConversation.id);
-		const rootMessage = allMessages.find((m) => m.type === 'root' && m.parent === null);
+		const rootMessage = allMessages.find(
+			(m: DatabaseMessage) => m.type === 'root' && m.parent === null
+		);
 		const currentFirstUserMessage = this.activeMessages.find(
-			(m) => m.role === 'user' && m.parent === rootMessage?.id
+			(m: DatabaseMessage) => m.role === 'user' && m.parent === rootMessage?.id
 		);
 
 		const currentLeafNodeId = findLeafNode(allMessages, siblingId);
@@ -355,7 +359,7 @@ class ConversationsStore {
 		// Only show title dialog if we're navigating between different first user message siblings
 		if (rootMessage && this.activeMessages.length > 0) {
 			const newFirstUserMessage = this.activeMessages.find(
-				(m) => m.role === 'user' && m.parent === rootMessage.id
+				(m: DatabaseMessage) => m.role === 'user' && m.parent === rootMessage.id
 			);
 
 			if (
@@ -452,7 +456,7 @@ class ConversationsStore {
 		}
 
 		const allData = await Promise.all(
-			allConversations.map(async (conv) => {
+			allConversations.map(async (conv: DatabaseConversation) => {
 				const messages = await DatabaseService.getConversationMessages(conv.id);
 				return { conv, messages };
 			})

tools/server/webui/src/lib/stores/models.svelte.ts

@@ -1,6 +1,6 @@
 import { SvelteSet } from 'svelte/reactivity';
-import { ModelsService } from '$lib/services/models';
-import { PropsService } from '$lib/services/props';
+import { ModelsService } from '$lib/services/models.service';
+import { PropsService } from '$lib/services/props.service';
 import { ServerModelStatus, ModelModality } from '$lib/enums';
 import { serverStore } from '$lib/stores/server.svelte';
 

tools/server/webui/src/lib/stores/server.svelte.ts

@@ -1,4 +1,4 @@
-import { PropsService } from '$lib/services/props';
+import { PropsService } from '$lib/services/props.service';
 import { ServerRole } from '$lib/enums';
 
 /**

tools/server/webui/src/lib/stores/settings.svelte.ts

@@ -33,7 +33,7 @@
 
 import { browser } from '$app/environment';
 import { SETTING_CONFIG_DEFAULT } from '$lib/constants/settings-config';
-import { ParameterSyncService } from '$lib/services/parameter-sync';
+import { ParameterSyncService } from '$lib/services/parameter-sync.service';
 import { serverStore } from '$lib/stores/server.svelte';
 import {
 	configToParameterRecord,