feat(copilot): UX improvements (#12258)

CoPilot conversation UX improvements (SECRT-2055):

1. **Rename conversations** — Inline rename via the session dropdown
menu. New `PATCH /sessions/{session_id}/title` endpoint with server-side
validation (rejects blank/whitespace-only titles, normalizes
whitespace). Pressing Enter or clicking away submits; Escape cancels
without submitting.

2. **New Chat button moved to top & sticky** — The 'New Chat' button is
now at the top of the sidebar (under 'Your chats') instead of the
footer, and stays fixed — only the session list below it scrolls. A
subtle shadow separator mirrors the original footer style.

3. **Auto-generated title appears live** — After the first message in a
new chat, the sidebar polls for the backend-generated title and animates
it in smoothly once available. The backend also guards against
auto-title overwriting a user-set title.

4. **External Link popup redesign** — Replaced the CSS-hacked external
link confirmation dialog with a proper AutoGPT `Dialog` component using
the design system (`Button`, `Text`, `Dialog`). Removed the old
`globals.css` workaround.

<img width="321" height="263" alt="Screenshot 2026-03-03 at 6 31 50 pm"
src="https://github.com/user-attachments/assets/3cdd1c6f-cca6-4f16-8165-15a1dc2d53f7"
/>

<img width="374" height="74" alt="Screenshot 2026-03-02 at 6 39 07 pm"
src="https://github.com/user-attachments/assets/6f9fc953-5fa7-4469-9eab-7074e7604519"
/>

<img width="548" height="293" alt="Screenshot 2026-03-02 at 6 36 28 pm"
src="https://github.com/user-attachments/assets/0f34683b-7281-4826-ac6f-ac7926e67854"
/>

### Changes 🏗️

**Backend:**
- `routes.py`: Added `PATCH /sessions/{session_id}/title` endpoint with
`UpdateSessionTitleRequest` Pydantic model — validates non-blank title,
normalizes whitespace, returns 404 vs 500 correctly
- `routes_test.py`: New test file — 7 test cases covering success,
whitespace trimming, blank rejection (422), not found (404), internal
failure (500)
- `service.py`: Auto-title generation now checks if a user-set title
already exists before overwriting
- `openapi.json`: Updated with new endpoint schema

**Frontend:**
- `ChatSidebar.tsx`: Inline rename (Enter/blur submits, Escape cancels
via ref flag); "New Chat" button sticky at top with shadow separator;
session title animates when auto-generated title appears
(`AnimatePresence`)
- `useCopilotPage.ts`: Polls for auto-generated title after stream ends,
stops as soon as title appears in cache
- `MobileDrawer.tsx`: Updated to match sidebar layout changes
- `DeleteChatDialog.tsx`: Removed redundant `onClose` prop (controlled
Dialog already handles close)
- `message.tsx`: Added `ExternalLinkModal` using AutoGPT design system;
removed redundant `onClose` prop
- `globals.css`: Removed old CSS hack for external link modal

### Checklist 📋

#### For code changes:
- [x] I have clearly listed my changes in the PR description
- [x] I have made a test plan
- [x] I have tested my changes according to the test plan:
- [x] Create a new chat, send a message — verify auto-generated title
appears in sidebar without refresh
- [x] Rename a chat via dropdown — Enter submits, Escape reverts, blank
title rejected
- [x] Rename a chat, then send another message — verify user title is
not overwritten by auto-title
- [x] With many chats, scroll the sidebar — verify "New Chat" button
stays fixed at top
- [x] Click an external link in a message — verify the new dialog
appears with AutoGPT styling

---------

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>

autogpt_platform/backend/backend/api/features/chat/routes.py

@@ -11,7 +11,7 @@ from autogpt_libs import auth
 from fastapi import APIRouter, Depends, HTTPException, Query, Response, Security
 from fastapi.responses import StreamingResponse
 from prisma.models import UserWorkspaceFile
-from pydantic import BaseModel, Field
+from pydantic import BaseModel, Field, field_validator
 
 from backend.copilot import service as chat_service
 from backend.copilot import stream_registry
@@ -25,6 +25,7 @@ from backend.copilot.model import (
     delete_chat_session,
     get_chat_session,
     get_user_sessions,
+    update_session_title,
 )
 from backend.copilot.response_model import StreamError, StreamFinish, StreamHeartbeat
 from backend.copilot.tools.models import (
@@ -141,6 +142,20 @@ class CancelSessionResponse(BaseModel):
     reason: str | None = None
 
 
+class UpdateSessionTitleRequest(BaseModel):
+    """Request model for updating a session's title."""
+
+    title: str
+
+    @field_validator("title")
+    @classmethod
+    def title_must_not_be_blank(cls, v: str) -> str:
+        stripped = v.strip()
+        if not stripped:
+            raise ValueError("Title must not be blank")
+        return stripped
+
+
 # ========== Routes ==========
 
 
@@ -264,6 +279,43 @@ async def delete_session(
     return Response(status_code=204)
 
 
+@router.patch(
+    "/sessions/{session_id}/title",
+    summary="Update session title",
+    dependencies=[Security(auth.requires_user)],
+    status_code=200,
+    responses={404: {"description": "Session not found or access denied"}},
+)
+async def update_session_title_route(
+    session_id: str,
+    request: UpdateSessionTitleRequest,
+    user_id: Annotated[str, Security(auth.get_user_id)],
+) -> dict:
+    """
+    Update the title of a chat session.
+
+    Allows the user to rename their chat session.
+
+    Args:
+        session_id: The session ID to update.
+        request: Request body containing the new title.
+        user_id: The authenticated user's ID.
+
+    Returns:
+        dict: Status of the update.
+
+    Raises:
+        HTTPException: 404 if session not found or not owned by user.
+    """
+    success = await update_session_title(session_id, user_id, request.title)
+    if not success:
+        raise HTTPException(
+            status_code=404,
+            detail=f"Session {session_id} not found or access denied",
+        )
+    return {"status": "ok"}
+
+
 @router.get(
     "/sessions/{session_id}",
 )

autogpt_platform/backend/backend/api/features/chat/routes_test.py

@@ -1,4 +1,6 @@
-"""Tests for chat route file_ids validation and enrichment."""
+"""Tests for chat API routes: session title update and file attachment validation."""
+
+from unittest.mock import AsyncMock
 
 import fastapi
 import fastapi.testclient
@@ -17,6 +19,7 @@ TEST_USER_ID = "3e53486c-cf57-477e-ba2a-cb02dc828e1a"
 
 @pytest.fixture(autouse=True)
 def setup_app_auth(mock_jwt_user):
+    """Setup auth overrides for all tests in this module"""
     from autogpt_libs.auth.jwt_utils import get_jwt_payload
 
     app.dependency_overrides[get_jwt_payload] = mock_jwt_user["get_jwt_payload"]
@@ -24,7 +27,95 @@ def setup_app_auth(mock_jwt_user):
     app.dependency_overrides.clear()
 
 
-# ---- file_ids Pydantic validation (B1) ----
+def _mock_update_session_title(
+    mocker: pytest_mock.MockerFixture, *, success: bool = True
+):
+    """Mock update_session_title."""
+    return mocker.patch(
+        "backend.api.features.chat.routes.update_session_title",
+        new_callable=AsyncMock,
+        return_value=success,
+    )
+
+
+# ─── Update title: success ─────────────────────────────────────────────
+
+
+def test_update_title_success(
+    mocker: pytest_mock.MockerFixture,
+    test_user_id: str,
+) -> None:
+    mock_update = _mock_update_session_title(mocker, success=True)
+
+    response = client.patch(
+        "/sessions/sess-1/title",
+        json={"title": "My project"},
+    )
+
+    assert response.status_code == 200
+    assert response.json() == {"status": "ok"}
+    mock_update.assert_called_once_with("sess-1", test_user_id, "My project")
+
+
+def test_update_title_trims_whitespace(
+    mocker: pytest_mock.MockerFixture,
+    test_user_id: str,
+) -> None:
+    mock_update = _mock_update_session_title(mocker, success=True)
+
+    response = client.patch(
+        "/sessions/sess-1/title",
+        json={"title": "  trimmed  "},
+    )
+
+    assert response.status_code == 200
+    mock_update.assert_called_once_with("sess-1", test_user_id, "trimmed")
+
+
+# ─── Update title: blank / whitespace-only → 422 ──────────────────────
+
+
+def test_update_title_blank_rejected(
+    test_user_id: str,
+) -> None:
+    """Whitespace-only titles must be rejected before hitting the DB."""
+    response = client.patch(
+        "/sessions/sess-1/title",
+        json={"title": "   "},
+    )
+
+    assert response.status_code == 422
+
+
+def test_update_title_empty_rejected(
+    test_user_id: str,
+) -> None:
+    response = client.patch(
+        "/sessions/sess-1/title",
+        json={"title": ""},
+    )
+
+    assert response.status_code == 422
+
+
+# ─── Update title: session not found or wrong user → 404 ──────────────
+
+
+def test_update_title_not_found(
+    mocker: pytest_mock.MockerFixture,
+    test_user_id: str,
+) -> None:
+    _mock_update_session_title(mocker, success=False)
+
+    response = client.patch(
+        "/sessions/sess-1/title",
+        json={"title": "New name"},
+    )
+
+    assert response.status_code == 404
+
+
+# ─── file_ids Pydantic validation ─────────────────────────────────────
 
 
 def test_stream_chat_rejects_too_many_file_ids():
@@ -92,7 +183,7 @@ def test_stream_chat_accepts_20_file_ids(mocker: pytest_mock.MockFixture):
     assert response.status_code == 200
 
 
-# ---- UUID format filtering ----
+# ─── UUID format filtering ─────────────────────────────────────────────
 
 
 def test_file_ids_filters_invalid_uuids(mocker: pytest_mock.MockFixture):
@@ -131,7 +222,7 @@ def test_file_ids_filters_invalid_uuids(mocker: pytest_mock.MockFixture):
     assert call_kwargs["where"]["id"]["in"] == [valid_id]
 
 
-# ---- Cross-workspace file_ids ----
+# ─── Cross-workspace file_ids ─────────────────────────────────────────
 
 
 def test_file_ids_scoped_to_workspace(mocker: pytest_mock.MockFixture):

autogpt_platform/backend/backend/copilot/baseline/service.py

@@ -62,8 +62,8 @@ async def _update_title_async(
     """Generate and persist a session title in the background."""
     try:
         title = await _generate_session_title(message, user_id, session_id)
-        if title:
-            await update_session_title(session_id, title)
+        if title and user_id:
+            await update_session_title(session_id, user_id, title, only_if_empty=True)
     except Exception as e:
         logger.warning("[Baseline] Failed to update session title: %s", e)
 

autogpt_platform/backend/backend/copilot/db.py

@@ -81,6 +81,35 @@ async def update_chat_session(
     return ChatSession.from_db(session) if session else None
 
 
+async def update_chat_session_title(
+    session_id: str,
+    user_id: str,
+    title: str,
+    *,
+    only_if_empty: bool = False,
+) -> bool:
+    """Update the title of a chat session, scoped to the owning user.
+
+    Always filters by (session_id, user_id) so callers cannot mutate another
+    user's session even when they know the session_id.
+
+    Args:
+        only_if_empty: When True, uses an atomic ``UPDATE WHERE title IS NULL``
+            guard so auto-generated titles never overwrite a user-set title.
+
+    Returns True if a row was updated, False otherwise (session not found,
+    wrong user, or — when only_if_empty — title was already set).
+    """
+    where: ChatSessionWhereInput = {"id": session_id, "userId": user_id}
+    if only_if_empty:
+        where["title"] = None
+    result = await PrismaChatSession.prisma().update_many(
+        where=where,
+        data={"title": title, "updatedAt": datetime.now(UTC)},
+    )
+    return result > 0
+
+
 async def add_chat_message(
     session_id: str,
     role: str,

autogpt_platform/backend/backend/copilot/model.py

@@ -469,8 +469,16 @@ async def upsert_chat_session(
             )
             db_error = e
 
-        # Save to cache (best-effort, even if DB failed)
+        # Save to cache (best-effort, even if DB failed).
+        # Title updates (update_session_title) run *outside* this lock because
+        # they only touch the title field, not messages.  So a concurrent rename
+        # or auto-title may have written a newer title to Redis while this
+        # upsert was in progress.  Always prefer the cached title to avoid
+        # overwriting it with the stale in-memory copy.
         try:
+            existing_cached = await _get_session_from_cache(session.session_id)
+            if existing_cached and existing_cached.title:
+                session = session.model_copy(update={"title": existing_cached.title})
             await cache_chat_session(session)
         except Exception as e:
             # If DB succeeded but cache failed, raise cache error
@@ -685,30 +693,48 @@ async def delete_chat_session(session_id: str, user_id: str | None = None) -> bo
     return True
 
 
-async def update_session_title(session_id: str, title: str) -> bool:
-    """Update only the title of a chat session.
+async def update_session_title(
+    session_id: str,
+    user_id: str,
+    title: str,
+    *,
+    only_if_empty: bool = False,
+) -> bool:
+    """Update the title of a chat session, scoped to the owning user.
 
-    This is a lightweight operation that doesn't touch messages, avoiding
-    race conditions with concurrent message updates. Use this for background
-    title generation instead of upsert_chat_session.
+    Lightweight operation that doesn't touch messages, avoiding race conditions
+    with concurrent message updates.
 
     Args:
         session_id: The session ID to update.
+        user_id: Owning user — the DB query filters on this.
         title: The new title to set.
+        only_if_empty: When True, uses an atomic ``UPDATE WHERE title IS NULL``
+            so auto-generated titles never overwrite a user-set title.
 
     Returns:
-        True if updated successfully, False otherwise.
+        True if updated successfully, False otherwise (not found, wrong user,
+        or — when only_if_empty — title was already set).
     """
     try:
-        result = await chat_db().update_chat_session(session_id=session_id, title=title)
-        if result is None:
-            logger.warning(f"Session {session_id} not found for title update")
+        updated = await chat_db().update_chat_session_title(
+            session_id, user_id, title, only_if_empty=only_if_empty
+        )
+        if not updated:
             return False
 
-        # Invalidate the cache so the next access reloads from DB with the
-        # updated title. This avoids a read-modify-write on the full session
-        # blob, which could overwrite concurrent message updates.
-        await invalidate_session_cache(session_id)
+        # Update title in cache if it exists (instead of invalidating).
+        # This prevents race conditions where cache invalidation causes
+        # the frontend to see stale DB data while streaming is still in progress.
+        try:
+            cached = await _get_session_from_cache(session_id)
+            if cached:
+                cached.title = title
+                await cache_chat_session(cached)
+        except Exception as e:
+            logger.warning(
+                f"Cache title update failed for session {session_id} (non-critical): {e}"
+            )
 
         return True
     except Exception as e:

autogpt_platform/backend/backend/copilot/sdk/service.py

@@ -1600,8 +1600,8 @@ async def _update_title_async(
         title = await _generate_session_title(
             message, user_id=user_id, session_id=session_id
         )
-        if title:
-            await update_session_title(session_id, title)
+        if title and user_id:
+            await update_session_title(session_id, user_id, title, only_if_empty=True)
             logger.debug(f"[SDK] Generated title for {session_id}: {title}")
     except Exception as e:
         logger.warning(f"[SDK] Failed to update session title: {e}")

autogpt_platform/backend/backend/data/db_manager.py

@@ -305,6 +305,7 @@ class DatabaseManager(AppService):
     delete_chat_session = _(chat_db.delete_chat_session)
     get_next_sequence = _(chat_db.get_next_sequence)
     update_tool_message_content = _(chat_db.update_tool_message_content)
+    update_chat_session_title = _(chat_db.update_chat_session_title)
 
 
 class DatabaseManagerClient(AppServiceClient):
@@ -475,3 +476,4 @@ class DatabaseManagerAsyncClient(AppServiceClient):
     delete_chat_session = d.delete_chat_session
     get_next_sequence = d.get_next_sequence
     update_tool_message_content = d.update_tool_message_content
+    update_chat_session_title = d.update_chat_session_title

autogpt_platform/backend/backend/data/integrations.py

@@ -184,17 +184,17 @@ async def find_webhook_by_credentials_and_props(
     credentials_id: str,
     webhook_type: str,
     resource: str,
-    events: Optional[list[str]],
+    events: list[str] | None = None,
 ) -> Webhook | None:
-    webhook = await IntegrationWebhook.prisma().find_first(
-        where={
-            "userId": user_id,
-            "credentialsId": credentials_id,
-            "webhookType": webhook_type,
-            "resource": resource,
-            **({"events": {"has_every": events}} if events else {}),
-        },
-    )
+    where: IntegrationWebhookWhereInput = {
+        "userId": user_id,
+        "credentialsId": credentials_id,
+        "webhookType": webhook_type,
+        "resource": resource,
+    }
+    if events is not None:
+        where["events"] = {"has_every": events}
+    webhook = await IntegrationWebhook.prisma().find_first(where=where)
     return Webhook.from_db(webhook) if webhook else None
 
 

autogpt_platform/backend/backend/integrations/webhooks/telegram.py

@@ -76,7 +76,6 @@ class TelegramWebhooksManager(BaseWebhooksManager):
             credentials_id=credentials.id,
             webhook_type=webhook_type,
             resource=resource,
-            events=None,  # Ignore events for this lookup
         ):
             # Re-register with Telegram using the same URL but new allowed_updates
             ingress_url = webhook_ingress_url(self.PROVIDER_NAME, existing.id)
@@ -143,10 +142,6 @@ class TelegramWebhooksManager(BaseWebhooksManager):
             elif "video" in message:
                 event_type = "message.video"
             else:
-                logger.warning(
-                    "Unknown Telegram webhook payload type; "
-                    f"message.keys() = {message.keys()}"
-                )
                 event_type = "message.other"
         elif "edited_message" in payload:
             event_type = "message.edited_message"

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

@@ -3,6 +3,7 @@ import {
   getGetV2ListSessionsQueryKey,
   useDeleteV2DeleteSession,
   useGetV2ListSessions,
+  usePatchV2UpdateSessionTitle,
 } from "@/app/api/__generated__/endpoints/chat/chat";
 import { Button } from "@/components/atoms/Button/Button";
 import { LoadingSpinner } from "@/components/atoms/LoadingSpinner/LoadingSpinner";
@@ -17,7 +18,6 @@ import { toast } from "@/components/molecules/Toast/use-toast";
 import {
   Sidebar,
   SidebarContent,
-  SidebarFooter,
   SidebarHeader,
   SidebarTrigger,
   useSidebar,
@@ -25,8 +25,9 @@ import {
 import { cn } from "@/lib/utils";
 import { DotsThree, PlusCircleIcon, PlusIcon } from "@phosphor-icons/react";
 import { useQueryClient } from "@tanstack/react-query";
-import { motion } from "framer-motion";
+import { AnimatePresence, motion } from "framer-motion";
 import { parseAsString, useQueryState } from "nuqs";
+import { useEffect, useRef, useState } from "react";
 import { useCopilotUIStore } from "../../store";
 import { DeleteChatDialog } from "../DeleteChatDialog/DeleteChatDialog";
 
@@ -65,6 +66,39 @@ export function ChatSidebar() {
       },
     });
 
+  const [editingSessionId, setEditingSessionId] = useState<string | null>(null);
+  const [editingTitle, setEditingTitle] = useState("");
+  const renameInputRef = useRef<HTMLInputElement>(null);
+  const renameCancelledRef = useRef(false);
+
+  const { mutate: renameSession } = usePatchV2UpdateSessionTitle({
+    mutation: {
+      onSuccess: () => {
+        queryClient.invalidateQueries({
+          queryKey: getGetV2ListSessionsQueryKey(),
+        });
+        setEditingSessionId(null);
+      },
+      onError: (error) => {
+        toast({
+          title: "Failed to rename chat",
+          description:
+            error instanceof Error ? error.message : "An error occurred",
+          variant: "destructive",
+        });
+        setEditingSessionId(null);
+      },
+    },
+  });
+
+  // Auto-focus the rename input when editing starts
+  useEffect(() => {
+    if (editingSessionId && renameInputRef.current) {
+      renameInputRef.current.focus();
+      renameInputRef.current.select();
+    }
+  }, [editingSessionId]);
+
   const sessions =
     sessionsResponse?.status === 200 ? sessionsResponse.data.sessions : [];
 
@@ -76,6 +110,26 @@ export function ChatSidebar() {
     setSessionId(id);
   }
 
+  function handleRenameClick(
+    e: React.MouseEvent,
+    id: string,
+    title: string | null | undefined,
+  ) {
+    e.stopPropagation();
+    renameCancelledRef.current = false;
+    setEditingSessionId(id);
+    setEditingTitle(title || "");
+  }
+
+  function handleRenameSubmit(id: string) {
+    const trimmed = editingTitle.trim();
+    if (trimmed) {
+      renameSession({ sessionId: id, data: { title: trimmed } });
+    } else {
+      setEditingSessionId(null);
+    }
+  }
+
   function handleDeleteClick(
     e: React.MouseEvent,
     id: string,
@@ -160,29 +214,42 @@ export function ChatSidebar() {
             </motion.div>
           </SidebarHeader>
         )}
+        {!isCollapsed && (
+          <SidebarHeader className="shrink-0 px-4 pb-4 pt-4 shadow-[0_4px_6px_-1px_rgba(0,0,0,0.05)]">
+            <motion.div
+              initial={{ opacity: 0 }}
+              animate={{ opacity: 1 }}
+              transition={{ duration: 0.2, delay: 0.1 }}
+              className="flex flex-col gap-3 px-3"
+            >
+              <div className="flex items-center justify-between">
+                <Text variant="h3" size="body-medium">
+                  Your chats
+                </Text>
+                <div className="relative left-6">
+                  <SidebarTrigger />
+                </div>
+              </div>
+              <Button
+                variant="primary"
+                size="small"
+                onClick={handleNewChat}
+                className="w-full"
+                leftIcon={<PlusIcon className="h-4 w-4" weight="bold" />}
+              >
+                New Chat
+              </Button>
+            </motion.div>
+          </SidebarHeader>
+        )}
+
         <SidebarContent className="gap-4 overflow-y-auto px-4 py-4 [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden">
-          {!isCollapsed && (
-            <motion.div
-              initial={{ opacity: 0 }}
-              animate={{ opacity: 1 }}
-              transition={{ duration: 0.2, delay: 0.1 }}
-              className="flex items-center justify-between px-3"
-            >
-              <Text variant="h3" size="body-medium">
-                Your chats
-              </Text>
-              <div className="relative left-6">
-                <SidebarTrigger />
-              </div>
-            </motion.div>
-          )}
-
           {!isCollapsed && (
             <motion.div
               initial={{ opacity: 0 }}
               animate={{ opacity: 1 }}
               transition={{ duration: 0.2, delay: 0.15 }}
-              className="mt-4 flex flex-col gap-1"
+              className="flex flex-col gap-1"
             >
               {isLoadingSessions ? (
                 <div className="flex min-h-[30rem] items-center justify-center py-4">
@@ -203,76 +270,105 @@ export function ChatSidebar() {
                         : "hover:bg-zinc-50",
                     )}
                   >
-                    <button
-                      onClick={() => handleSelectSession(session.id)}
-                      className="w-full px-3 py-2.5 pr-10 text-left"
-                    >
-                      <div className="flex min-w-0 max-w-full flex-col overflow-hidden">
-                        <div className="min-w-0 max-w-full">
-                          <Text
-                            variant="body"
-                            className={cn(
-                              "truncate font-normal",
-                              session.id === sessionId
-                                ? "text-zinc-600"
-                                : "text-zinc-800",
-                            )}
-                          >
-                            {session.title || `Untitled chat`}
+                    {editingSessionId === session.id ? (
+                      <div className="px-3 py-2.5">
+                        <input
+                          ref={renameInputRef}
+                          type="text"
+                          aria-label="Rename chat"
+                          value={editingTitle}
+                          onChange={(e) => setEditingTitle(e.target.value)}
+                          onKeyDown={(e) => {
+                            if (e.key === "Enter") {
+                              e.currentTarget.blur();
+                            } else if (e.key === "Escape") {
+                              renameCancelledRef.current = true;
+                              setEditingSessionId(null);
+                            }
+                          }}
+                          onBlur={() => {
+                            if (renameCancelledRef.current) {
+                              renameCancelledRef.current = false;
+                              return;
+                            }
+                            handleRenameSubmit(session.id);
+                          }}
+                          className="w-full rounded border border-zinc-300 bg-white px-2 py-1 text-sm text-zinc-800 outline-none focus:border-purple-500 focus:ring-1 focus:ring-purple-500"
+                        />
+                      </div>
+                    ) : (
+                      <button
+                        onClick={() => handleSelectSession(session.id)}
+                        className="w-full px-3 py-2.5 pr-10 text-left"
+                      >
+                        <div className="flex min-w-0 max-w-full flex-col overflow-hidden">
+                          <div className="min-w-0 max-w-full">
+                            <Text
+                              variant="body"
+                              className={cn(
+                                "truncate font-normal",
+                                session.id === sessionId
+                                  ? "text-zinc-600"
+                                  : "text-zinc-800",
+                              )}
+                            >
+                              <AnimatePresence mode="wait" initial={false}>
+                                <motion.span
+                                  key={session.title || "untitled"}
+                                  initial={{ opacity: 0, y: 4 }}
+                                  animate={{ opacity: 1, y: 0 }}
+                                  exit={{ opacity: 0, y: -4 }}
+                                  transition={{ duration: 0.2 }}
+                                  className="block truncate"
+                                >
+                                  {session.title || "Untitled chat"}
+                                </motion.span>
+                              </AnimatePresence>
+                            </Text>
+                          </div>
+                          <Text variant="small" className="text-neutral-400">
+                            {formatDate(session.updated_at)}
                           </Text>
                         </div>
-                        <Text variant="small" className="text-neutral-400">
-                          {formatDate(session.updated_at)}
-                        </Text>
-                      </div>
-                    </button>
-                    <DropdownMenu>
-                      <DropdownMenuTrigger asChild>
-                        <button
-                          onClick={(e) => e.stopPropagation()}
-                          className="absolute right-2 top-1/2 -translate-y-1/2 rounded-full p-1.5 text-zinc-600 transition-all hover:bg-neutral-100"
-                          aria-label="More actions"
-                        >
-                          <DotsThree className="h-4 w-4" />
-                        </button>
-                      </DropdownMenuTrigger>
-                      <DropdownMenuContent align="end">
-                        <DropdownMenuItem
-                          onClick={(e) =>
-                            handleDeleteClick(e, session.id, session.title)
-                          }
-                          disabled={isDeleting}
-                          className="text-red-600 focus:bg-red-50 focus:text-red-600"
-                        >
-                          Delete chat
-                        </DropdownMenuItem>
-                      </DropdownMenuContent>
-                    </DropdownMenu>
+                      </button>
+                    )}
+                    {editingSessionId !== session.id && (
+                      <DropdownMenu>
+                        <DropdownMenuTrigger asChild>
+                          <button
+                            onClick={(e) => e.stopPropagation()}
+                            className="absolute right-2 top-1/2 -translate-y-1/2 rounded-full p-1.5 text-zinc-600 transition-all hover:bg-neutral-100"
+                            aria-label="More actions"
+                          >
+                            <DotsThree className="h-4 w-4" />
+                          </button>
+                        </DropdownMenuTrigger>
+                        <DropdownMenuContent align="end">
+                          <DropdownMenuItem
+                            onClick={(e) =>
+                              handleRenameClick(e, session.id, session.title)
+                            }
+                          >
+                            Rename
+                          </DropdownMenuItem>
+                          <DropdownMenuItem
+                            onClick={(e) =>
+                              handleDeleteClick(e, session.id, session.title)
+                            }
+                            disabled={isDeleting}
+                            className="text-red-600 focus:bg-red-50 focus:text-red-600"
+                          >
+                            Delete chat
+                          </DropdownMenuItem>
+                        </DropdownMenuContent>
+                      </DropdownMenu>
+                    )}
                   </div>
                 ))
               )}
             </motion.div>
           )}
         </SidebarContent>
-        {!isCollapsed && sessionId && (
-          <SidebarFooter className="shrink-0 bg-zinc-50 p-3 pb-1 shadow-[0_-4px_6px_-1px_rgba(0,0,0,0.05)]">
-            <motion.div
-              initial={{ opacity: 0 }}
-              animate={{ opacity: 1 }}
-              transition={{ duration: 0.2, delay: 0.2 }}
-            >
-              <Button
-                variant="primary"
-                size="small"
-                onClick={handleNewChat}
-                className="w-full"
-                leftIcon={<PlusIcon className="h-4 w-4" weight="bold" />}
-              >
-                New Chat
-              </Button>
-            </motion.div>
-          </SidebarFooter>
-        )}
       </Sidebar>
 
       <DeleteChatDialog

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

@@ -29,7 +29,6 @@ export function DeleteChatDialog({
           }
         },
       }}
-      onClose={isDeleting ? undefined : onCancel}
     >
       <Dialog.Content>
         <Text variant="body">

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

@@ -71,6 +71,17 @@ export function MobileDrawer({
                 <X width="1rem" height="1rem" />
               </Button>
             </div>
+            <div className="mt-2">
+              <Button
+                variant="primary"
+                size="small"
+                onClick={onNewChat}
+                className="w-full"
+                leftIcon={<PlusIcon width="1rem" height="1rem" />}
+              >
+                New Chat
+              </Button>
+            </div>
           </div>
           <div
             className={cn(
@@ -120,19 +131,6 @@ export function MobileDrawer({
               ))
             )}
           </div>
-          {currentSessionId && (
-            <div className="shrink-0 bg-white p-3 shadow-[0_-4px_6px_-1px_rgba(0,0,0,0.05)]">
-              <Button
-                variant="primary"
-                size="small"
-                onClick={onNewChat}
-                className="w-full"
-                leftIcon={<PlusIcon width="1rem" height="1rem" />}
-              >
-                New Chat
-              </Button>
-            </div>
-          )}
         </Drawer.Content>
       </Drawer.Portal>
     </Drawer.Root>

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

@@ -2,6 +2,7 @@ import {
   getGetV2ListSessionsQueryKey,
   useDeleteV2DeleteSession,
   useGetV2ListSessions,
+  type getV2ListSessionsResponse,
 } from "@/app/api/__generated__/endpoints/chat/chat";
 import { toast } from "@/components/molecules/Toast/use-toast";
 import { useBreakpoint } from "@/lib/hooks/useBreakpoint";
@@ -15,6 +16,9 @@ import { useCopilotUIStore } from "./store";
 import { useChatSession } from "./useChatSession";
 import { useCopilotStream } from "./useCopilotStream";
 
+const TITLE_POLL_INTERVAL_MS = 2_000;
+const TITLE_POLL_MAX_ATTEMPTS = 5;
+
 interface UploadedFile {
   file_id: string;
   name: string;
@@ -258,6 +262,52 @@ export function useCopilotPage() {
   const sessions =
     sessionsResponse?.status === 200 ? sessionsResponse.data.sessions : [];
 
+  // Start title polling when stream ends cleanly — sidebar title animates in
+  const titlePollRef = useRef<ReturnType<typeof setInterval>>();
+  const prevStatusRef = useRef(status);
+
+  useEffect(() => {
+    const prev = prevStatusRef.current;
+    prevStatusRef.current = status;
+
+    const wasActive = prev === "streaming" || prev === "submitted";
+    const isNowReady = status === "ready";
+
+    if (!wasActive || !isNowReady || !sessionId || isReconnecting) return;
+
+    queryClient.invalidateQueries({
+      queryKey: getGetV2ListSessionsQueryKey({ limit: 50 }),
+    });
+    const sid = sessionId;
+    let attempts = 0;
+    clearInterval(titlePollRef.current);
+    titlePollRef.current = setInterval(() => {
+      const data = queryClient.getQueryData<getV2ListSessionsResponse>(
+        getGetV2ListSessionsQueryKey({ limit: 50 }),
+      );
+      const hasTitle =
+        data?.status === 200 &&
+        data.data.sessions.some((s) => s.id === sid && s.title);
+      if (hasTitle || attempts >= TITLE_POLL_MAX_ATTEMPTS) {
+        clearInterval(titlePollRef.current);
+        titlePollRef.current = undefined;
+        return;
+      }
+      attempts += 1;
+      queryClient.invalidateQueries({
+        queryKey: getGetV2ListSessionsQueryKey({ limit: 50 }),
+      });
+    }, TITLE_POLL_INTERVAL_MS);
+  }, [status, sessionId, isReconnecting, queryClient]);
+
+  // Clean up polling on session change or unmount
+  useEffect(() => {
+    return () => {
+      clearInterval(titlePollRef.current);
+      titlePollRef.current = undefined;
+    };
+  }, [sessionId]);
+
   // --- Mobile drawer handlers ---
   function handleOpenDrawer() {
     setDrawerOpen(true);

autogpt_platform/frontend/src/app/api/openapi.json

@@ -1305,6 +1305,59 @@
         }
       }
     },
+    "/api/chat/sessions/{session_id}/title": {
+      "patch": {
+        "tags": ["v2", "chat", "chat"],
+        "summary": "Update session title",
+        "description": "Update the title of a chat session.\n\nAllows the user to rename their chat session.\n\nArgs:\n    session_id: The session ID to update.\n    request: Request body containing the new title.\n    user_id: The authenticated user's ID.\n\nReturns:\n    dict: Status of the update.\n\nRaises:\n    HTTPException: 404 if session not found or not owned by user.",
+        "operationId": "patchV2Update session title",
+        "security": [{ "HTTPBearerJWT": [] }],
+        "parameters": [
+          {
+            "name": "session_id",
+            "in": "path",
+            "required": true,
+            "schema": { "type": "string", "title": "Session Id" }
+          }
+        ],
+        "requestBody": {
+          "required": true,
+          "content": {
+            "application/json": {
+              "schema": {
+                "$ref": "#/components/schemas/UpdateSessionTitleRequest"
+              }
+            }
+          }
+        },
+        "responses": {
+          "200": {
+            "description": "Successful Response",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "type": "object",
+                  "additionalProperties": true,
+                  "title": "Response Patchv2Update Session Title"
+                }
+              }
+            }
+          },
+          "401": {
+            "$ref": "#/components/responses/HTTP401NotAuthenticatedError"
+          },
+          "404": { "description": "Session not found or access denied" },
+          "422": {
+            "description": "Validation Error",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/HTTPValidationError" }
+              }
+            }
+          }
+        }
+      }
+    },
     "/api/credits": {
       "get": {
         "tags": ["v1", "credits"],
@@ -13291,6 +13344,13 @@
         "required": ["permissions"],
         "title": "UpdatePermissionsRequest"
       },
+      "UpdateSessionTitleRequest": {
+        "properties": { "title": { "type": "string", "title": "Title" } },
+        "type": "object",
+        "required": ["title"],
+        "title": "UpdateSessionTitleRequest",
+        "description": "Request model for updating a session's title."
+      },
       "UpdateTimezoneRequest": {
         "properties": {
           "timezone": {

autogpt_platform/frontend/src/components/ai-elements/message.tsx

@@ -7,6 +7,9 @@ import {
   TooltipContent,
   TooltipTrigger,
 } from "@/components/atoms/Tooltip/BaseTooltip";
+import { Button as AtomButton } from "@/components/atoms/Button/Button";
+import { Text } from "@/components/atoms/Text/Text";
+import { Dialog } from "@/components/molecules/Dialog/Dialog";
 import { cn } from "@/lib/utils";
 import { cjk } from "@streamdown/cjk";
 import { code } from "@/lib/streamdown-code-plugin";
@@ -16,6 +19,7 @@ import type { UIMessage } from "ai";
 import { ChevronLeftIcon, ChevronRightIcon } from "lucide-react";
 import type { ComponentProps, HTMLAttributes, ReactElement } from "react";
 import { createContext, memo, useContext, useEffect, useState } from "react";
+import type { LinkSafetyModalProps } from "streamdown";
 import { Streamdown } from "streamdown";
 
 export type MessageProps = HTMLAttributes<HTMLDivElement> & {
@@ -307,6 +311,46 @@ function isSameOriginLink(url: string): boolean {
   }
 }
 
+function ExternalLinkModal({
+  url,
+  isOpen,
+  onClose,
+  onConfirm,
+}: LinkSafetyModalProps) {
+  return (
+    <Dialog
+      title="Open external link"
+      styling={{ maxWidth: "30rem", minWidth: "auto" }}
+      controlled={{
+        isOpen,
+        set: async (open) => {
+          if (!open) onClose();
+        },
+      }}
+    >
+      <Dialog.Content>
+        <Text variant="body">
+          You&apos;re about to visit an external website:
+        </Text>
+        <Text
+          variant="small"
+          className="mt-2 break-all rounded-md bg-neutral-100 p-3 font-mono"
+        >
+          {url}
+        </Text>
+        <Dialog.Footer>
+          <AtomButton variant="secondary" onClick={onClose}>
+            Cancel
+          </AtomButton>
+          <AtomButton variant="primary" onClick={onConfirm}>
+            Open link
+          </AtomButton>
+        </Dialog.Footer>
+      </Dialog.Content>
+    </Dialog>
+  );
+}
+
 export const MessageResponse = memo(
   ({ className, ...props }: MessageResponseProps) => (
     <Streamdown
@@ -318,6 +362,7 @@ export const MessageResponse = memo(
       linkSafety={{
         enabled: true,
         onLinkCheck: isSameOriginLink,
+        renderModal: (modalProps) => <ExternalLinkModal {...modalProps} />,
       }}
       {...props}
     />