feat: Introduce BaseClient for common store integration

refactor(agentic-client): Extend BaseClient for store integration
refactor(chat-client): Extend BaseClient for store integration
refactor(conversations-client): Extend BaseClient for store integration

tools/server/webui/src/lib/clients/agentic.client.ts

@@ -23,6 +23,7 @@
  * - Lazy disconnect after flow completes
  */
 
+import { BaseClient } from './base-client';
 import { mcpClient } from '$lib/clients';
 import { ChatService } from '$lib/services';
 import { config } from '$lib/stores/settings.svelte';
@@ -108,32 +109,7 @@ interface AgenticStoreStateCallbacks {
 	clearStreamingToolCall: (conversationId: string) => void;
 }
 
-export class AgenticClient {
-	private storeCallbacks: AgenticStoreStateCallbacks | null = null;
-
-	/**
-	 *
-	 *
-	 * Store Integration
-	 *
-	 *
-	 */
-
-	/**
-	 * Sets callbacks for store state updates.
-	 * Called by agenticStore during initialization.
-	 */
-	setStoreCallbacks(callbacks: AgenticStoreStateCallbacks): void {
-		this.storeCallbacks = callbacks;
-	}
-
-	private get store(): AgenticStoreStateCallbacks {
-		if (!this.storeCallbacks) {
-			throw new Error('AgenticClient: Store callbacks not initialized');
-		}
-		return this.storeCallbacks;
-	}
-
+export class AgenticClient extends BaseClient<AgenticStoreStateCallbacks> {
 	/**
 	 *
 	 *

tools/server/webui/src/lib/clients/base-client.ts

@@ -0,0 +1,48 @@
+/**
+ * BaseClient - Abstract base class for client classes
+ *
+ * Provides common store callback management pattern used by all clients.
+ * Clients extend this class to inherit the store callback infrastructure.
+ *
+ * **Usage:**
+ * ```typescript
+ * interface MyStoreCallbacks {
+ *   setSomeState: (value: string) => void;
+ * }
+ *
+ * class MyClient extends BaseClient<MyStoreCallbacks> {
+ *   doSomething() {
+ *     this.store.setSomeState('value');
+ *   }
+ * }
+ * ```
+ */
+export abstract class BaseClient<TCallbacks> {
+	private _storeCallbacks: TCallbacks | null = null;
+
+	/**
+	 * Sets callbacks for store state updates.
+	 * Called by the corresponding store during initialization.
+	 */
+	setStoreCallbacks(callbacks: TCallbacks): void {
+		this._storeCallbacks = callbacks;
+	}
+
+	/**
+	 * Gets the store callbacks, throwing if not initialized.
+	 * Use this in derived classes to access store callbacks safely.
+	 */
+	protected get store(): TCallbacks {
+		if (!this._storeCallbacks) {
+			throw new Error(`${this.constructor.name}: Store callbacks not initialized`);
+		}
+		return this._storeCallbacks;
+	}
+
+	/**
+	 * Checks if store callbacks have been initialized.
+	 */
+	protected get hasStoreCallbacks(): boolean {
+		return this._storeCallbacks !== null;
+	}
+}

tools/server/webui/src/lib/clients/chat.client.ts

@@ -1,3 +1,4 @@
+import { BaseClient } from './base-client';
 import { DatabaseService, ChatService } from '$lib/services';
 import { conversationsStore } from '$lib/stores/conversations.svelte';
 import { config } from '$lib/stores/settings.svelte';
@@ -79,32 +80,7 @@ const wrapReasoningContent = (content: string, reasoningContent?: string): strin
  * - Error handling (timeout, server errors)
  * - Graceful stop with partial response saving
  */
-export class ChatClient {
-	private storeCallbacks: ChatStoreStateCallbacks | null = null;
-
-	/**
-	 *
-	 *
-	 * Store Integration
-	 *
-	 *
-	 */
-
-	/**
-	 * Sets callbacks for store state updates.
-	 * Called by chatStore during initialization to establish bidirectional communication.
-	 */
-	setStoreCallbacks(callbacks: ChatStoreStateCallbacks): void {
-		this.storeCallbacks = callbacks;
-	}
-
-	private get store(): ChatStoreStateCallbacks {
-		if (!this.storeCallbacks) {
-			throw new Error('ChatClient: Store callbacks not initialized');
-		}
-		return this.storeCallbacks;
-	}
-
+export class ChatClient extends BaseClient<ChatStoreStateCallbacks> {
 	/**
 	 *
 	 *

tools/server/webui/src/lib/clients/conversations.client.ts

@@ -20,6 +20,7 @@
  * - Title management with confirmation
  */
 
+import { BaseClient } from './base-client';
 import { goto } from '$app/navigation';
 import { toast } from 'svelte-sonner';
 import { DatabaseService } from '$lib/services/database.service';
@@ -46,32 +47,7 @@ interface ConversationsStoreStateCallbacks {
 		| undefined;
 }
 
-export class ConversationsClient {
-	private storeCallbacks: ConversationsStoreStateCallbacks | null = null;
-
-	/**
-	 *
-	 *
-	 * Store Integration
-	 *
-	 *
-	 */
-
-	/**
-	 * Sets callbacks for store state updates.
-	 * Called by conversationsStore during initialization.
-	 */
-	setStoreCallbacks(callbacks: ConversationsStoreStateCallbacks): void {
-		this.storeCallbacks = callbacks;
-	}
-
-	private get store(): ConversationsStoreStateCallbacks {
-		if (!this.storeCallbacks) {
-			throw new Error('ConversationsClient: Store callbacks not initialized');
-		}
-		return this.storeCallbacks;
-	}
-
+export class ConversationsClient extends BaseClient<ConversationsStoreStateCallbacks> {
 	/**
 	 *
 	 *

tools/server/webui/src/lib/clients/index.ts

@@ -16,6 +16,9 @@
  * @see stores/ for reactive state
  */
 
+// Base Client
+export { BaseClient } from './base-client';
+
 // MCP Client
 export { MCPClient, mcpClient } from './mcp.client';