remove loadingStore and move the state into chat context (#1593)

Author: mfortman11

frontend/app/chat/page.tsx

@@ -13,7 +13,6 @@ import { trackLLMCall } from "@/lib/analytics";
 import { FILE_CONFIRMATION, FILES_REGEX } from "@/lib/constants";
 import { buildSearchPayloadFilters } from "@/lib/filter-normalization";
 import { cn } from "@/lib/utils";
-import { useLoadingStore } from "@/stores/loadingStore";
 import { useGetConversationsQuery } from "../api/queries/useGetConversationsQuery";
 import { useGetNudgesQuery } from "../api/queries/useGetNudgesQuery";
 import { useGetSettingsQuery } from "../api/queries/useGetSettingsQuery";
@@ -32,7 +31,6 @@ import type {
 
 function ChatPage() {
   const isDebugMode = process.env.NEXT_PUBLIC_OPENRAG_DEBUG === "true";
-  const isCloudBrand = useIsCloudBrand();
   const {
     endpoint,
     setEndpoint,
@@ -50,6 +48,8 @@ function ChatPage() {
     placeholderConversation,
     conversationFilter,
     setConversationFilter,
+    loading,
+    setLoading,
   } = useChat();
   const [messages, setMessages] = useState<Message[]>([
     {
@@ -59,7 +59,6 @@ function ChatPage() {
     },
   ]);
   const [input, setInput] = useState("");
-  const { loading, setLoading } = useLoadingStore();
   const { setChatError } = useChat();
   const [asyncMode, setAsyncMode] = useState(true);
   const [expandedFunctionCalls, setExpandedFunctionCalls] = useState<
@@ -109,7 +108,7 @@ function ChatPage() {
     streamingMessage,
     sendMessage: sendStreamingMessage,
     abortStream,
-    isLoading: isStreamLoading,
+    isLoading: isChatStreaming,
   } = useChatStreaming({
     endpoint: apiEndpoint,
     onComplete: (message, responseId) => {
@@ -169,7 +168,7 @@ function ChatPage() {
   useEffect(() => {
     let timeoutId: NodeJS.Timeout | null = null;
 
-    if (isStreamLoading && !streamingMessage) {
+    if (isChatStreaming && !streamingMessage) {
       timeoutId = setTimeout(() => {
         setWaitingTooLong(true);
       }, 20000); // 20 seconds
@@ -180,7 +179,7 @@ function ChatPage() {
     return () => {
       if (timeoutId) clearTimeout(timeoutId);
     };
-  }, [isStreamLoading, streamingMessage]);
+  }, [isChatStreaming, streamingMessage]);
 
   const handleEndpointChange = (newEndpoint: EndpointType) => {
     setEndpoint(newEndpoint);
@@ -372,7 +371,7 @@ function ChatPage() {
 
     if (
       conversationData?.messages &&
-      (isNewConversation || (!isStreamLoading && hasMessageCountChanged)) &&
+      (isNewConversation || (!isChatStreaming && hasMessageCountChanged)) &&
       !isUserInteracting &&
       !isForkingInProgress
     ) {
@@ -564,7 +563,7 @@ function ChatPage() {
     isUserInteracting,
     isForkingInProgress,
     setPreviousResponseIds,
-    isStreamLoading,
+    isChatStreaming,
     messages.length,
   ]);
 

frontend/components/navigation.tsx

@@ -26,7 +26,6 @@ import { useKnowledgeFilter } from "@/contexts/knowledge-filter-context";
 import { usePermissions } from "@/hooks/use-permissions";
 import { FILES_REGEX } from "@/lib/constants";
 import { cn } from "@/lib/utils";
-import { useLoadingStore } from "@/stores/loadingStore";
 import { DeleteSessionModal } from "./delete-session-modal";
 import { KnowledgeFilterList } from "./knowledge-filter-list";
 
@@ -90,14 +89,9 @@ export function Navigation({
     placeholderConversation,
     setPlaceholderConversation,
     conversationLoaded,
+    loading,
   } = useChat();
 
-  const { loading } = useLoadingStore();
-
-  useEffect(() => {
-    console.log("loading", loading);
-  }, [loading]);
-
   const [previousConversationCount, setPreviousConversationCount] = useState(0);
   const [deleteModalOpen, setDeleteModalOpen] = useState(false);
   const [conversationToDelete, setConversationToDelete] =

frontend/contexts/chat-context.tsx

@@ -87,6 +87,8 @@ interface ChatContextType {
   setChatError: (hasError: boolean) => void;
   isOnboardingComplete: boolean;
   setOnboardingComplete: (complete: boolean) => void;
+  loading: boolean;
+  setLoading: (loading: boolean) => void;
 }
 
 const ChatContext = createContext<ChatContextType | undefined>(undefined);
@@ -117,6 +119,7 @@ export function ChatProvider({ children }: ChatProviderProps) {
   const [conversationFilter, setConversationFilterState] =
     useState<KnowledgeFilter | null>(null);
   const [hasChatError, setChatError] = useState(false);
+  const [loading, setLoading] = useState(false);
 
   // Get settings to check if onboarding was completed (settings.edited)
   const { data: settings } = useGetSettingsQuery();
@@ -450,6 +453,8 @@ export function ChatProvider({ children }: ChatProviderProps) {
       setChatError,
       isOnboardingComplete,
       setOnboardingComplete,
+      loading,
+      setLoading,
     }),
     [
       endpoint,
@@ -473,6 +478,7 @@ export function ChatProvider({ children }: ChatProviderProps) {
       hasChatError,
       isOnboardingComplete,
       setOnboardingComplete,
+      loading,
     ],
   );