From 58b252727f81cfb2ea4746a2f86c7898b1c0da4f Mon Sep 17 00:00:00 2001 From: pablonyx Date: Mon, 17 Feb 2025 13:21:43 -0800 Subject: [PATCH] UX (#4014) --- backend/onyx/llm/chat_llm.py | 4 -- web/src/app/chat/ChatPage.tsx | 53 +++++++++++++-- web/src/app/chat/input/AgenticToggle.tsx | 2 +- web/src/app/chat/input/LLMPopover.tsx | 2 +- web/src/app/chat/lib.tsx | 2 +- web/src/app/chat/message/AgenticMessage.tsx | 53 ++++++++++++--- web/src/app/chat/message/Messages.tsx | 66 ++++++++++++++++--- .../app/chat/message/SubQuestionsDisplay.tsx | 6 +- web/src/app/ee/admin/standard-answer/page.tsx | 2 +- web/src/app/globals.css | 14 +--- web/src/components/Hoverable.tsx | 2 +- web/src/components/SearchResultIcon.tsx | 2 +- web/src/components/WebResultIcon.tsx | 2 +- web/src/components/admin/connectors/Field.tsx | 5 +- web/src/components/chat/BlurBackground.tsx | 2 +- web/src/components/chat/MinimalMarkdown.tsx | 2 +- .../components/chat/sources/SourceCard.tsx | 2 +- web/src/components/header/LogoWithText.tsx | 2 +- web/src/lib/hooks.ts | 7 +- web/src/lib/search/streamingUtils.ts | 10 ++- web/tailwind-themes/tailwind.config.js | 2 - 21 files changed, 178 insertions(+), 64 deletions(-) diff --git a/backend/onyx/llm/chat_llm.py b/backend/onyx/llm/chat_llm.py index b11108b3e..fe131fb62 100644 --- a/backend/onyx/llm/chat_llm.py +++ b/backend/onyx/llm/chat_llm.py @@ -409,10 +409,6 @@ class DefaultMultiLLM(LLM): self._record_call(processed_prompt) try: - print( - "model is", - f"{self.config.model_provider}/{self.config.deployment_name or self.config.model_name}", - ) return litellm.completion( mock_response=MOCK_LLM_RESPONSE, # model choice diff --git a/web/src/app/chat/ChatPage.tsx b/web/src/app/chat/ChatPage.tsx index 5d72470cf..005efa71f 100644 --- a/web/src/app/chat/ChatPage.tsx +++ b/web/src/app/chat/ChatPage.tsx @@ -1,6 +1,11 @@ "use client"; -import { redirect, useRouter, useSearchParams } from "next/navigation"; +import { + redirect, + usePathname, + useRouter, + useSearchParams, +} from "next/navigation"; import { BackendChatSession, BackendMessage, @@ -130,6 +135,7 @@ import { } from "@/lib/browserUtilities"; import { Button } from "@/components/ui/button"; import { ConfirmEntityModal } from "@/components/modals/ConfirmEntityModal"; +import { MessageChannel } from "node:worker_threads"; const TEMP_USER_MESSAGE_ID = -1; const TEMP_ASSISTANT_MESSAGE_ID = -2; @@ -1145,6 +1151,7 @@ export function ChatPage({ regenerationRequest?: RegenerationRequest | null; overrideFileDescriptors?: FileDescriptor[]; } = {}) => { + navigatingAway.current = false; let frozenSessionId = currentSessionId(); updateCanContinue(false, frozenSessionId); @@ -1267,7 +1274,6 @@ export function ChatPage({ let stackTrace: string | null = null; let sub_questions: SubQuestionDetail[] = []; - let second_level_sub_questions: SubQuestionDetail[] = []; let is_generating: boolean = false; let second_level_generating: boolean = false; let finalMessage: BackendMessage | null = null; @@ -1291,7 +1297,7 @@ export function ChatPage({ const stack = new CurrentMessageFIFO(); updateCurrentMessageFIFO(stack, { - signal: controller.signal, // Add this line + signal: controller.signal, message: currMessage, alternateAssistantId: currentAssistantId, fileDescriptors: overrideFileDescriptors || currentMessageFiles, @@ -1712,7 +1718,10 @@ export function ChatPage({ const newUrl = buildChatUrl(searchParams, currChatSessionId, null); // newUrl is like /chat?chatId=10 // current page is like /chat - router.push(newUrl, { scroll: false }); + + if (pathname == "/chat" && !navigatingAway.current) { + router.push(newUrl, { scroll: false }); + } } } if ( @@ -2086,6 +2095,31 @@ export function ChatPage({ llmOverrideManager.updateImageFilesPresent(imageFileInMessageHistory); }, [imageFileInMessageHistory]); + const pathname = usePathname(); + useEffect(() => { + return () => { + // Cleanup which only runs when the component unmounts (i.e. when you navigate away). + const currentSession = currentSessionId(); + const controller = abortControllersRef.current.get(currentSession); + if (controller) { + controller.abort(); + navigatingAway.current = true; + setAbortControllers((prev) => { + const newControllers = new Map(prev); + newControllers.delete(currentSession); + return newControllers; + }); + } + }; + }, [pathname]); + + const navigatingAway = useRef(false); + // Keep a ref to abortControllers to ensure we always have the latest value + const abortControllersRef = useRef(abortControllers); + useEffect(() => { + abortControllersRef.current = abortControllers; + }, [abortControllers]); + useSidebarShortcut(router, toggleSidebar); const [sharedChatSession, setSharedChatSession] = @@ -2300,7 +2334,7 @@ export function ChatPage({ fixed left-0 z-40 - bg-background-100 + bg-neutral-200 h-screen transition-all bg-opacity-80 @@ -2557,12 +2591,21 @@ export function ChatPage({ ) { return <>; } + const nextMessage = + messageHistory.length > i + 1 + ? messageHistory[i + 1] + : null; return (
-

+

Use AI agents to break down questions and run deep iterative research through promising pathways. Gives more thorough and accurate responses but takes slightly longer. diff --git a/web/src/app/chat/input/LLMPopover.tsx b/web/src/app/chat/input/LLMPopover.tsx index 86d7697a4..0fc970802 100644 --- a/web/src/app/chat/input/LLMPopover.tsx +++ b/web/src/app/chat/input/LLMPopover.tsx @@ -113,7 +113,7 @@ export default function LLMPopover({