refactor(frontend/hooks): enhance use-chat with backend state management

Updated useChat hook to utilize serializedState from backend response for thread management, ensuring correct state persistence during streaming interactions.

Modified files (2):
- use-chat.ts: Adjusted state handling for threadId and serializedState
- chat-service.ts: Added content filter handling for streaming messages

Author: cristofima

src/frontend/task-agent-web/hooks/use-chat.ts

@@ -254,9 +254,11 @@ export function useChat(options: UseChatOptions = {}): UseChatReturn {
                     pageSize: PAGINATION.CONVERSATION_PAGE_SIZE,
                 });
 
-                // Update current thread ID and serializedState
+                // Update current thread ID and serializedState from backend response
+                // CRITICAL: Use serializedState from response, NOT the threadId directly
+                // The serializedState is a full AgentThread JSON required by the streaming service
                 setCurrentThreadId(threadId);
-                setSerializedState(threadId); // ThreadDbKey is used as serializedState
+                setSerializedState(response.serializedState ?? null);
 
                 // Convert backend messages to frontend format
                 const loadedMessages: ChatMessage[] = (response.messages || []).map((msg) => ({

src/frontend/task-agent-web/lib/api/chat-service.ts

@@ -224,7 +224,19 @@ export async function sendMessageWithStreaming(
                             callbacks.onToolCallResult?.(event.toolCallId || "", event.result || "");
                         }
 
-                        // ✅ Handle THREAD_STATE event (serializedState for next request)
+                        // Handle CONTENT_FILTER event (Azure OpenAI content policy violation)
+                        // This provides a ChatGPT-like UX where the blocked message appears in chat
+                        if (event.type === "CONTENT_FILTER") {
+                            // Update streaming message with the content filter message
+                            const filterMessage = event.message || "I'm unable to assist with that request as it may violate content policies.";
+                            fullMessage = filterMessage;
+                            messageId = event.messageId || `cf-${Date.now()}`;
+                            // Trigger text chunk callback so UI updates immediately
+                            callbacks.onTextChunk?.(filterMessage, filterMessage);
+                            // Don't throw - let stream continue to get thread state for persistence
+                        }
+
+                        // Handle THREAD_STATE event (serializedState for next request)
                         if (event.type === "THREAD_STATE" && event.serializedState) {
                             serializedState = event.serializedState;
                             // Callback: Stream complete with state