Merge branch 'dev' into feat/long-running-tool-persistence

autogpt_platform/frontend/src/app/(platform)/copilot/components/CopilotShell/CopilotShell.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { ChatLoader } from "@/components/contextual/Chat/components/ChatLoader/ChatLoader";
+import { Text } from "@/components/atoms/Text/Text";
 import { NAVBAR_HEIGHT_PX } from "@/lib/constants";
 import type { ReactNode } from "react";
 import { DesktopSidebar } from "./components/DesktopSidebar/DesktopSidebar";
@@ -17,6 +18,7 @@ export function CopilotShell({ children }: Props) {
     isMobile,
     isDrawerOpen,
     isLoading,
+    isCreatingSession,
     isLoggedIn,
     hasActiveSession,
     sessions,
@@ -60,7 +62,20 @@ export function CopilotShell({ children }: Props) {
 
       <div className="relative flex min-h-0 flex-1 flex-col">
         {isMobile && <MobileHeader onOpenDrawer={handleOpenDrawer} />}
-        <div className="flex min-h-0 flex-1 flex-col">{children}</div>
+        <div className="flex min-h-0 flex-1 flex-col">
+          {isCreatingSession ? (
+            <div className="flex h-full flex-1 flex-col items-center justify-center bg-[#f8f8f9]">
+              <div className="flex flex-col items-center gap-4">
+                <ChatLoader />
+                <Text variant="body" className="text-zinc-500">
+                  Creating your chat...
+                </Text>
+              </div>
+            </div>
+          ) : (
+            children
+          )}
+        </div>
       </div>
 
       {isMobile && (

autogpt_platform/frontend/src/app/(platform)/copilot/components/CopilotShell/useCopilotShell.ts

@@ -72,6 +72,7 @@ export function useCopilotShell() {
   const stopStream = useChatStore((s) => s.stopStream);
   const onStreamComplete = useChatStore((s) => s.onStreamComplete);
   const isStreaming = useCopilotStore((s) => s.isStreaming);
+  const isCreatingSession = useCopilotStore((s) => s.isCreatingSession);
   const setIsSwitchingSession = useCopilotStore((s) => s.setIsSwitchingSession);
   const openInterruptModal = useCopilotStore((s) => s.openInterruptModal);
 
@@ -154,7 +155,8 @@ export function useCopilotShell() {
     isLoggedIn,
     hasActiveSession:
       Boolean(currentSessionId) && (!isOnHomepage || Boolean(paramSessionId)),
-    isLoading,
+    isLoading: isLoading || isCreatingSession,
+    isCreatingSession,
     sessions,
     currentSessionId: urlSessionId,
     handleOpenDrawer,

autogpt_platform/frontend/src/app/(platform)/copilot/components/CopilotShell/useShellSessionList.ts

@@ -75,12 +75,10 @@ export function useShellSessionList({
   }, [accumulatedSessions]);
 
   useEffect(() => {
-    const unsubscribe = onStreamComplete((completedSessionId) => {
-      if (recentlyCreatedSessionsRef.current.has(completedSessionId)) {
-        queryClient.invalidateQueries({
-          queryKey: getGetV2ListSessionsQueryKey(),
-        });
-      }
+    const unsubscribe = onStreamComplete(() => {
+      queryClient.invalidateQueries({
+        queryKey: getGetV2ListSessionsQueryKey(),
+      });
     });
     return unsubscribe;
   }, [onStreamComplete, queryClient]);

autogpt_platform/frontend/src/app/(platform)/copilot/copilot-page-store.ts

@@ -5,6 +5,7 @@ import { create } from "zustand";
 interface CopilotStoreState {
   isStreaming: boolean;
   isSwitchingSession: boolean;
+  isCreatingSession: boolean;
   isInterruptModalOpen: boolean;
   pendingAction: (() => void) | null;
 }
@@ -12,6 +13,7 @@ interface CopilotStoreState {
 interface CopilotStoreActions {
   setIsStreaming: (isStreaming: boolean) => void;
   setIsSwitchingSession: (isSwitchingSession: boolean) => void;
+  setIsCreatingSession: (isCreating: boolean) => void;
   openInterruptModal: (onConfirm: () => void) => void;
   confirmInterrupt: () => void;
   cancelInterrupt: () => void;
@@ -22,6 +24,7 @@ type CopilotStore = CopilotStoreState & CopilotStoreActions;
 export const useCopilotStore = create<CopilotStore>((set, get) => ({
   isStreaming: false,
   isSwitchingSession: false,
+  isCreatingSession: false,
   isInterruptModalOpen: false,
   pendingAction: null,
 
@@ -33,6 +36,10 @@ export const useCopilotStore = create<CopilotStore>((set, get) => ({
     set({ isSwitchingSession });
   },
 
+  setIsCreatingSession(isCreatingSession) {
+    set({ isCreatingSession });
+  },
+
   openInterruptModal(onConfirm) {
     set({ isInterruptModalOpen: true, pendingAction: onConfirm });
   },

autogpt_platform/frontend/src/app/(platform)/copilot/page.tsx

@@ -5,7 +5,6 @@ import { Skeleton } from "@/components/atoms/Skeleton/Skeleton";
 import { Text } from "@/components/atoms/Text/Text";
 import { Chat } from "@/components/contextual/Chat/Chat";
 import { ChatInput } from "@/components/contextual/Chat/components/ChatInput/ChatInput";
-import { ChatLoader } from "@/components/contextual/Chat/components/ChatLoader/ChatLoader";
 import { Dialog } from "@/components/molecules/Dialog/Dialog";
 import { useCopilotStore } from "./copilot-page-store";
 import { useCopilotPage } from "./useCopilotPage";
@@ -19,7 +18,6 @@ export default function CopilotPage() {
     greetingName,
     quickActions,
     isLoading,
-    isCreating,
     hasSession,
     initialPrompt,
     isReady,
@@ -82,19 +80,6 @@ export default function CopilotPage() {
     );
   }
 
-  if (isCreating) {
-    return (
-      <div className="flex h-full flex-1 flex-col items-center justify-center bg-[#f8f8f9]">
-        <div className="flex flex-col items-center gap-4">
-          <ChatLoader />
-          <Text variant="body" className="text-zinc-500">
-            Creating your chat...
-          </Text>
-        </div>
-      </div>
-    );
-  }
-
   return (
     <div className="flex h-full flex-1 items-center justify-center overflow-y-auto bg-[#f8f8f9] px-6 py-10">
       <div className="w-full text-center">

autogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.ts

@@ -10,11 +10,12 @@ import {
   type FlagValues,
   useGetFlag,
 } from "@/services/feature-flags/use-get-flag";
+import { SessionKey, sessionStorage } from "@/services/storage/session-storage";
 import * as Sentry from "@sentry/nextjs";
 import { useQueryClient } from "@tanstack/react-query";
 import { useFlags } from "launchdarkly-react-client-sdk";
 import { useRouter } from "next/navigation";
-import { useEffect, useRef, useState } from "react";
+import { useEffect } from "react";
 import { useCopilotStore } from "./copilot-page-store";
 import { getGreetingName, getQuickActions } from "./helpers";
 import { useCopilotSessionId } from "./useCopilotSessionId";
@@ -27,6 +28,8 @@ export function useCopilotPage() {
 
   const { urlSessionId, setUrlSessionId } = useCopilotSessionId();
   const setIsStreaming = useCopilotStore((s) => s.setIsStreaming);
+  const isCreating = useCopilotStore((s) => s.isCreatingSession);
+  const setIsCreating = useCopilotStore((s) => s.setIsCreatingSession);
 
   const isChatEnabled = useGetFlag(Flag.CHAT);
   const flags = useFlags<FlagValues>();
@@ -37,15 +40,12 @@ export function useCopilotPage() {
   const isFlagReady =
     !isLaunchDarklyConfigured || flags[Flag.CHAT] !== undefined;
 
-  const [isCreating, setIsCreating] = useState(false);
-  const initialPromptsRef = useRef<Record<string, string>>({});
-
   const greetingName = getGreetingName(user);
   const quickActions = getQuickActions();
 
   const hasSession = Boolean(urlSessionId);
   const initialPrompt = urlSessionId
-    ? initialPromptsRef.current[urlSessionId]
+    ? getInitialPrompt(urlSessionId)
     : undefined;
 
   useEffect(() => {
@@ -72,13 +72,13 @@ export function useCopilotPage() {
       }
 
       const sessionId = sessionResponse.data.id;
-      initialPromptsRef.current[sessionId] = trimmedPrompt;
+      setInitialPrompt(sessionId, trimmedPrompt);
 
       await queryClient.invalidateQueries({
         queryKey: getGetV2ListSessionsQueryKey(),
       });
 
-      await setUrlSessionId(sessionId, { shallow: false });
+      await setUrlSessionId(sessionId, { shallow: true });
     } catch (error) {
       console.error("[CopilotPage] Failed to start chat:", error);
       toast({ title: "Failed to start chat", variant: "destructive" });
@@ -105,7 +105,6 @@ export function useCopilotPage() {
       greetingName,
       quickActions,
       isLoading: isUserLoading,
-      isCreating,
       hasSession,
       initialPrompt,
       isReady: isFlagReady && isChatEnabled !== false && isLoggedIn,
@@ -118,3 +117,29 @@ export function useCopilotPage() {
     },
   };
 }
+
+function getInitialPrompt(sessionId: string): string | undefined {
+  try {
+    const prompts = JSON.parse(
+      sessionStorage.get(SessionKey.CHAT_INITIAL_PROMPTS) || "{}",
+    );
+    return prompts[sessionId];
+  } catch {
+    return undefined;
+  }
+}
+
+function setInitialPrompt(sessionId: string, prompt: string): void {
+  try {
+    const prompts = JSON.parse(
+      sessionStorage.get(SessionKey.CHAT_INITIAL_PROMPTS) || "{}",
+    );
+    prompts[sessionId] = prompt;
+    sessionStorage.set(
+      SessionKey.CHAT_INITIAL_PROMPTS,
+      JSON.stringify(prompts),
+    );
+  } catch {
+    // Ignore storage errors
+  }
+}

autogpt_platform/frontend/src/components/contextual/Chat/useChatSession.ts

@@ -59,6 +59,7 @@ export function useChatSession({
     query: {
       enabled: !!sessionId,
       select: okData,
+      staleTime: 0,
       retry: shouldRetrySessionLoad,
       retryDelay: getSessionRetryDelay,
     },

autogpt_platform/frontend/src/services/storage/session-storage.ts

@@ -3,6 +3,7 @@ import { environment } from "../environment";
 
 export enum SessionKey {
   CHAT_SENT_INITIAL_PROMPTS = "chat_sent_initial_prompts",
+  CHAT_INITIAL_PROMPTS = "chat_initial_prompts",
 }
 
 function get(key: SessionKey) {