Merge branch 'dev' into pwuts/open-2923-v2-external-api

autogpt_platform/backend/backend/api/external/v1/routes.py

@@ -18,6 +18,7 @@ from backend.data import user as user_db
 from backend.data.auth.base import APIAuthorizationInfo
 from backend.data.block import BlockInput, CompletedBlockOutput
 from backend.executor.utils import add_graph_execution
+from backend.integrations.webhooks.graph_lifecycle_hooks import on_graph_activate
 from backend.util.settings import Settings
 
 from .integrations import integrations_router
@@ -95,6 +96,43 @@ async def execute_graph_block(
     return output
 
 
+@v1_router.post(
+    path="/graphs",
+    tags=["graphs"],
+    status_code=201,
+    dependencies=[
+        Security(
+            require_permission(
+                APIKeyPermission.WRITE_GRAPH, APIKeyPermission.WRITE_LIBRARY
+            )
+        )
+    ],
+)
+async def create_graph(
+    graph: graph_db.Graph,
+    auth: APIAuthorizationInfo = Security(
+        require_permission(APIKeyPermission.WRITE_GRAPH, APIKeyPermission.WRITE_LIBRARY)
+    ),
+) -> graph_db.GraphModel:
+    """
+    Create a new agent graph.
+
+    The graph will be validated and assigned a new ID.
+    It is automatically added to the user's library.
+    """
+    from backend.api.features.library import db as library_db
+
+    graph_model = graph_db.make_graph_model(graph, auth.user_id)
+    graph_model.reassign_ids(user_id=auth.user_id, reassign_graph_id=True)
+    graph_model.validate_graph(for_run=False)
+
+    await graph_db.create_graph(graph_model, user_id=auth.user_id)
+    await library_db.create_library_agent(graph_model, auth.user_id)
+    activated_graph = await on_graph_activate(graph_model, user_id=auth.user_id)
+
+    return activated_graph
+
+
 @v1_router.post(
     path="/graphs/{graph_id}/execute/{graph_version}",
     tags=["graphs"],

autogpt_platform/backend/backend/api/features/builder/db.py

@@ -1,15 +1,17 @@
 import logging
 from dataclasses import dataclass
-from datetime import datetime, timedelta, timezone
 from difflib import SequenceMatcher
-from typing import Sequence
+from typing import Any, Sequence, get_args, get_origin
 
 import prisma
+from prisma.enums import ContentType
+from prisma.models import mv_suggested_blocks
 
 import backend.api.features.library.db as library_db
 import backend.api.features.library.model as library_model
 import backend.api.features.store.db as store_db
 import backend.api.features.store.model as store_model
+from backend.api.features.store.hybrid_search import unified_hybrid_search
 from backend.blocks import load_all_blocks
 from backend.blocks._base import (
     AnyBlockSchema,
@@ -19,7 +21,6 @@ from backend.blocks._base import (
     BlockType,
 )
 from backend.blocks.llm import LlmModel
-from backend.data.db import query_raw_with_schema
 from backend.integrations.providers import ProviderName
 from backend.util.cache import cached
 from backend.util.models import Pagination
@@ -42,6 +43,16 @@ MAX_LIBRARY_AGENT_RESULTS = 100
 MAX_MARKETPLACE_AGENT_RESULTS = 100
 MIN_SCORE_FOR_FILTERED_RESULTS = 10.0
 
+# Boost blocks over marketplace agents in search results
+BLOCK_SCORE_BOOST = 50.0
+
+# Block IDs to exclude from search results
+EXCLUDED_BLOCK_IDS = frozenset(
+    {
+        "e189baac-8c20-45a1-94a7-55177ea42565",  # AgentExecutorBlock
+    }
+)
+
 SearchResultItem = BlockInfo | library_model.LibraryAgent | store_model.StoreAgent
 
 
@@ -64,8 +75,8 @@ def get_block_categories(category_blocks: int = 3) -> list[BlockCategoryResponse
 
     for block_type in load_all_blocks().values():
         block: AnyBlockSchema = block_type()
-        # Skip disabled blocks
-        if block.disabled:
+        # Skip disabled and excluded blocks
+        if block.disabled or block.id in EXCLUDED_BLOCK_IDS:
             continue
         # Skip blocks that don't have categories (all should have at least one)
         if not block.categories:
@@ -116,6 +127,9 @@ def get_blocks(
         # Skip disabled blocks
         if block.disabled:
             continue
+        # Skip excluded blocks
+        if block.id in EXCLUDED_BLOCK_IDS:
+            continue
         # Skip blocks that don't match the category
         if category and category not in {c.name.lower() for c in block.categories}:
             continue
@@ -255,14 +269,25 @@ async def _build_cached_search_results(
         "my_agents": 0,
     }
 
-    block_results, block_total, integration_total = _collect_block_results(
-        normalized_query=normalized_query,
-        include_blocks=include_blocks,
-        include_integrations=include_integrations,
-    )
-    scored_items.extend(block_results)
-    total_items["blocks"] = block_total
-    total_items["integrations"] = integration_total
+    # Use hybrid search when query is present, otherwise list all blocks
+    if (include_blocks or include_integrations) and normalized_query:
+        block_results, block_total, integration_total = await _hybrid_search_blocks(
+            query=search_query,
+            include_blocks=include_blocks,
+            include_integrations=include_integrations,
+        )
+        scored_items.extend(block_results)
+        total_items["blocks"] = block_total
+        total_items["integrations"] = integration_total
+    elif include_blocks or include_integrations:
+        # No query - list all blocks using in-memory approach
+        block_results, block_total, integration_total = _collect_block_results(
+            include_blocks=include_blocks,
+            include_integrations=include_integrations,
+        )
+        scored_items.extend(block_results)
+        total_items["blocks"] = block_total
+        total_items["integrations"] = integration_total
 
     if include_library_agents:
         library_response = await library_db.list_library_agents(
@@ -307,10 +332,14 @@ async def _build_cached_search_results(
 
 def _collect_block_results(
     *,
-    normalized_query: str,
     include_blocks: bool,
     include_integrations: bool,
 ) -> tuple[list[_ScoredItem], int, int]:
+    """
+    Collect all blocks for listing (no search query).
+
+    All blocks get BLOCK_SCORE_BOOST to prioritize them over marketplace agents.
+    """
     results: list[_ScoredItem] = []
     block_count = 0
     integration_count = 0
@@ -323,6 +352,10 @@ def _collect_block_results(
         if block.disabled:
             continue
 
+        # Skip excluded blocks
+        if block.id in EXCLUDED_BLOCK_IDS:
+            continue
+
         block_info = block.get_info()
         credentials = list(block.input_schema.get_credentials_fields().values())
         is_integration = len(credentials) > 0
@@ -332,10 +365,6 @@ def _collect_block_results(
         if not is_integration and not include_blocks:
             continue
 
-        score = _score_block(block, block_info, normalized_query)
-        if not _should_include_item(score, normalized_query):
-            continue
-
         filter_type: FilterType = "integrations" if is_integration else "blocks"
         if is_integration:
             integration_count += 1
@@ -346,8 +375,122 @@ def _collect_block_results(
             _ScoredItem(
                 item=block_info,
                 filter_type=filter_type,
-                score=score,
-                sort_key=_get_item_name(block_info),
+                score=BLOCK_SCORE_BOOST,
+                sort_key=block_info.name.lower(),
+            )
+        )
+
+    return results, block_count, integration_count
+
+
+async def _hybrid_search_blocks(
+    *,
+    query: str,
+    include_blocks: bool,
+    include_integrations: bool,
+) -> tuple[list[_ScoredItem], int, int]:
+    """
+    Search blocks using hybrid search with builder-specific filtering.
+
+    Uses unified_hybrid_search for semantic + lexical search, then applies
+    post-filtering for block/integration types and scoring adjustments.
+
+    Scoring:
+        - Base: hybrid relevance score (0-1) scaled to 0-100, plus BLOCK_SCORE_BOOST
+          to prioritize blocks over marketplace agents in combined results
+        - +30 for exact name match, +15 for prefix name match
+        - +20 if the block has an LlmModel field and the query matches an LLM model name
+
+    Args:
+        query: The search query string
+        include_blocks: Whether to include regular blocks
+        include_integrations: Whether to include integration blocks
+
+    Returns:
+        Tuple of (scored_items, block_count, integration_count)
+    """
+    results: list[_ScoredItem] = []
+    block_count = 0
+    integration_count = 0
+
+    if not include_blocks and not include_integrations:
+        return results, block_count, integration_count
+
+    normalized_query = query.strip().lower()
+
+    # Fetch more results to account for post-filtering
+    search_results, _ = await unified_hybrid_search(
+        query=query,
+        content_types=[ContentType.BLOCK],
+        page=1,
+        page_size=150,
+        min_score=0.10,
+    )
+
+    # Load all blocks for getting BlockInfo
+    all_blocks = load_all_blocks()
+
+    for result in search_results:
+        block_id = result["content_id"]
+
+        # Skip excluded blocks
+        if block_id in EXCLUDED_BLOCK_IDS:
+            continue
+
+        metadata = result.get("metadata", {})
+        hybrid_score = result.get("relevance", 0.0)
+
+        # Get the actual block class
+        if block_id not in all_blocks:
+            continue
+
+        block_cls = all_blocks[block_id]
+        block: AnyBlockSchema = block_cls()
+
+        if block.disabled:
+            continue
+
+        # Check block/integration filter using metadata
+        is_integration = metadata.get("is_integration", False)
+
+        if is_integration and not include_integrations:
+            continue
+        if not is_integration and not include_blocks:
+            continue
+
+        # Get block info
+        block_info = block.get_info()
+
+        # Calculate final score: scale hybrid score and add builder-specific bonuses
+        # Hybrid scores are 0-1, builder scores were 0-200+
+        # Add BLOCK_SCORE_BOOST to prioritize blocks over marketplace agents
+        final_score = hybrid_score * 100 + BLOCK_SCORE_BOOST
+
+        # Add LLM model match bonus
+        has_llm_field = metadata.get("has_llm_model_field", False)
+        if has_llm_field and _matches_llm_model(block.input_schema, normalized_query):
+            final_score += 20
+
+        # Add exact/prefix match bonus for deterministic tie-breaking
+        name = block_info.name.lower()
+        if name == normalized_query:
+            final_score += 30
+        elif name.startswith(normalized_query):
+            final_score += 15
+
+        # Track counts
+        filter_type: FilterType = "integrations" if is_integration else "blocks"
+        if is_integration:
+            integration_count += 1
+        else:
+            block_count += 1
+
+        results.append(
+            _ScoredItem(
+                item=block_info,
+                filter_type=filter_type,
+                score=final_score,
+                sort_key=name,
             )
         )
 
@@ -472,6 +615,8 @@ async def _get_static_counts():
         block: AnyBlockSchema = block_type()
         if block.disabled:
             continue
+        if block.id in EXCLUDED_BLOCK_IDS:
+            continue
 
         all_blocks += 1
 
@@ -498,47 +643,25 @@ async def _get_static_counts():
     }
 
 
+def _contains_type(annotation: Any, target: type) -> bool:
+    """Check if an annotation is or contains the target type (handles Optional/Union/Annotated)."""
+    if annotation is target:
+        return True
+    origin = get_origin(annotation)
+    if origin is None:
+        return False
+    return any(_contains_type(arg, target) for arg in get_args(annotation))
+
+
 def _matches_llm_model(schema_cls: type[BlockSchema], query: str) -> bool:
     for field in schema_cls.model_fields.values():
-        if field.annotation == LlmModel:
+        if _contains_type(field.annotation, LlmModel):
             # Check if query matches any value in llm_models
             if any(query in name for name in llm_models):
                 return True
     return False
 
 
-def _score_block(
-    block: AnyBlockSchema,
-    block_info: BlockInfo,
-    normalized_query: str,
-) -> float:
-    if not normalized_query:
-        return 0.0
-
-    name = block_info.name.lower()
-    description = block_info.description.lower()
-    score = _score_primary_fields(name, description, normalized_query)
-
-    category_text = " ".join(
-        category.get("category", "").lower() for category in block_info.categories
-    )
-    score += _score_additional_field(category_text, normalized_query, 12, 6)
-
-    credentials_info = block.input_schema.get_credentials_fields_info().values()
-    provider_names = [
-        provider.value.lower()
-        for info in credentials_info
-        for provider in info.provider
-    ]
-    provider_text = " ".join(provider_names)
-    score += _score_additional_field(provider_text, normalized_query, 15, 6)
-
-    if _matches_llm_model(block.input_schema, normalized_query):
-        score += 20
-
-    return score
-
-
 def _score_library_agent(
     agent: library_model.LibraryAgent,
     normalized_query: str,
@@ -645,31 +768,20 @@ def _get_all_providers() -> dict[ProviderName, Provider]:
     return providers
 
 
-@cached(ttl_seconds=3600)
+@cached(ttl_seconds=3600, shared_cache=True)
 async def get_suggested_blocks(count: int = 5) -> list[BlockInfo]:
-    suggested_blocks = []
-    # Sum the number of executions for each block type
-    # Prisma cannot group by nested relations, so we do a raw query
-    # Calculate the cutoff timestamp
-    timestamp_threshold = datetime.now(timezone.utc) - timedelta(days=30)
+    """Return the most-executed blocks from the last 14 days.
 
-    results = await query_raw_with_schema(
-        """
-        SELECT
-            agent_node."agentBlockId" AS block_id,
-            COUNT(execution.id) AS execution_count
-        FROM {schema_prefix}"AgentNodeExecution" execution
-        JOIN {schema_prefix}"AgentNode" agent_node ON execution."agentNodeId" = agent_node.id
-        WHERE execution."endedTime" >= $1::timestamp
-        GROUP BY agent_node."agentBlockId"
-        ORDER BY execution_count DESC;
-        """,
-        timestamp_threshold,
-    )
+    Queries the mv_suggested_blocks materialized view (refreshed hourly via pg_cron)
+    and returns the top `count` blocks sorted by execution count, excluding
+    Input/Output/Agent block types and blocks in EXCLUDED_BLOCK_IDS.
+    """
+    results = await mv_suggested_blocks.prisma().find_many()
 
     # Get the top blocks based on execution count
-    # But ignore Input and Output blocks
+    # But ignore Input, Output, Agent, and excluded blocks
     blocks: list[tuple[BlockInfo, int]] = []
+    execution_counts = {row.block_id: row.execution_count for row in results}
 
     for block_type in load_all_blocks().values():
         block: AnyBlockSchema = block_type()
@@ -679,11 +791,9 @@ async def get_suggested_blocks(count: int = 5) -> list[BlockInfo]:
             BlockType.AGENT,
         ):
             continue
-        # Find the execution count for this block
-        execution_count = next(
-            (row["execution_count"] for row in results if row["block_id"] == block.id),
-            0,
-        )
+        if block.id in EXCLUDED_BLOCK_IDS:
+            continue
+        execution_count = execution_counts.get(block.id, 0)
         blocks.append((block.get_info(), execution_count))
     # Sort blocks by execution count
     blocks.sort(key=lambda x: x[1], reverse=True)

autogpt_platform/backend/backend/api/features/builder/model.py

@@ -27,7 +27,6 @@ class SearchEntry(BaseModel):
 
 # Suggestions
 class SuggestionsResponse(BaseModel):
-    otto_suggestions: list[str]
     recent_searches: list[SearchEntry]
     providers: list[ProviderName]
     top_blocks: list[BlockInfo]

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

@@ -1,5 +1,5 @@
 import logging
-from typing import Annotated, Sequence
+from typing import Annotated, Sequence, cast, get_args
 
 import fastapi
 from autogpt_libs.auth.dependencies import get_user_id, requires_user
@@ -10,6 +10,8 @@ from backend.util.models import Pagination
 from . import db as builder_db
 from . import model as builder_model
 
+VALID_FILTER_VALUES = get_args(builder_model.FilterType)
+
 logger = logging.getLogger(__name__)
 
 router = fastapi.APIRouter(
@@ -49,11 +51,6 @@ async def get_suggestions(
     Get all suggestions for the Blocks Menu.
     """
     return builder_model.SuggestionsResponse(
-        otto_suggestions=[
-            "What blocks do I need to get started?",
-            "Help me create a list",
-            "Help me feed my data to Google Maps",
-        ],
         recent_searches=await builder_db.get_recent_searches(user_id),
         providers=[
             ProviderName.TWITTER,
@@ -151,7 +148,7 @@ async def get_providers(
 async def search(
     user_id: Annotated[str, fastapi.Security(get_user_id)],
     search_query: Annotated[str | None, fastapi.Query()] = None,
-    filter: Annotated[list[builder_model.FilterType] | None, fastapi.Query()] = None,
+    filter: Annotated[str | None, fastapi.Query()] = None,
     search_id: Annotated[str | None, fastapi.Query()] = None,
     by_creator: Annotated[list[str] | None, fastapi.Query()] = None,
     page: Annotated[int, fastapi.Query()] = 1,
@@ -160,9 +157,20 @@ async def search(
     """
     Search for blocks (including integrations), marketplace agents, and user library agents.
     """
-    # If no filters are provided, then we will return all types
-    if not filter:
-        filter = [
+    # Parse and validate filter parameter
+    filters: list[builder_model.FilterType]
+    if filter:
+        filter_values = [f.strip() for f in filter.split(",")]
+        invalid_filters = [f for f in filter_values if f not in VALID_FILTER_VALUES]
+        if invalid_filters:
+            raise fastapi.HTTPException(
+                status_code=400,
+                detail=f"Invalid filter value(s): {', '.join(invalid_filters)}. "
+                f"Valid values are: {', '.join(VALID_FILTER_VALUES)}",
+            )
+        filters = cast(list[builder_model.FilterType], filter_values)
+    else:
+        filters = [
             "blocks",
             "integrations",
             "marketplace_agents",
@@ -174,7 +182,7 @@ async def search(
     cached_results = await builder_db.get_sorted_search_results(
         user_id=user_id,
         search_query=search_query,
-        filters=filter,
+        filters=filters,
         by_creator=by_creator,
     )
 
@@ -196,7 +204,7 @@ async def search(
         user_id,
         builder_model.SearchEntry(
             search_query=search_query,
-            filter=filter,
+            filter=filters,
             by_creator=by_creator,
             search_id=search_id,
         ),

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

@@ -621,11 +621,10 @@ async def resume_session_stream(
     if not active_session:
         return Response(status_code=204)
 
-    # Subscribe from the beginning ("0-0") to replay all chunks for this turn.
-    # This is necessary because hydrated messages filter out incomplete tool calls
-    # to avoid "No tool invocation found" errors. The resume stream delivers
-    # those tool calls fresh with proper SDK state.
-    # The AI SDK's deduplication will handle any duplicate chunks.
+    # Always replay from the beginning ("0-0") on resume.
+    # We can't use last_message_id because it's the latest ID in the backend
+    # stream, not the latest the frontend received — the gap causes lost
+    # messages. The frontend deduplicates replayed content.
     subscriber_queue = await stream_registry.subscribe_to_session(
         session_id=session_id,
         user_id=user_id,

autogpt_platform/backend/backend/api/features/library/db_test.py

@@ -144,6 +144,7 @@ async def test_add_agent_to_library(mocker):
     )
 
     mock_library_agent = mocker.patch("prisma.models.LibraryAgent.prisma")
+    mock_library_agent.return_value.find_first = mocker.AsyncMock(return_value=None)
     mock_library_agent.return_value.find_unique = mocker.AsyncMock(return_value=None)
     mock_library_agent.return_value.create = mocker.AsyncMock(
         return_value=mock_library_agent_data
@@ -178,7 +179,6 @@ async def test_add_agent_to_library(mocker):
                 "agentGraphVersion": 1,
             }
         },
-        include={"AgentGraph": True},
     )
     # Check that create was called with the expected data including settings
     create_call_args = mock_library_agent.return_value.create.call_args

autogpt_platform/backend/backend/api/features/library/exceptions.py

@@ -0,0 +1,10 @@
+class FolderValidationError(Exception):
+    """Raised when folder operations fail validation."""
+
+    pass
+
+
+class FolderAlreadyExistsError(FolderValidationError):
+    """Raised when a folder with the same name already exists in the location."""
+
+    pass

autogpt_platform/backend/backend/api/features/library/model.py

@@ -26,6 +26,95 @@ class LibraryAgentStatus(str, Enum):
     ERROR = "ERROR"
 
 
+# === Folder Models ===
+
+
+class LibraryFolder(pydantic.BaseModel):
+    """Represents a folder for organizing library agents."""
+
+    id: str
+    user_id: str
+    name: str
+    icon: str | None = None
+    color: str | None = None
+    parent_id: str | None = None
+    created_at: datetime.datetime
+    updated_at: datetime.datetime
+    agent_count: int = 0  # Direct agents in folder
+    subfolder_count: int = 0  # Direct child folders
+
+    @staticmethod
+    def from_db(
+        folder: prisma.models.LibraryFolder,
+        agent_count: int = 0,
+        subfolder_count: int = 0,
+    ) -> "LibraryFolder":
+        """Factory method that constructs a LibraryFolder from a Prisma model."""
+        return LibraryFolder(
+            id=folder.id,
+            user_id=folder.userId,
+            name=folder.name,
+            icon=folder.icon,
+            color=folder.color,
+            parent_id=folder.parentId,
+            created_at=folder.createdAt,
+            updated_at=folder.updatedAt,
+            agent_count=agent_count,
+            subfolder_count=subfolder_count,
+        )
+
+
+class LibraryFolderTree(LibraryFolder):
+    """Folder with nested children for tree view."""
+
+    children: list["LibraryFolderTree"] = []
+
+
+class FolderCreateRequest(pydantic.BaseModel):
+    """Request model for creating a folder."""
+
+    name: str = pydantic.Field(..., min_length=1, max_length=100)
+    icon: str | None = None
+    color: str | None = pydantic.Field(
+        None, pattern=r"^#[0-9A-Fa-f]{6}$", description="Hex color code (#RRGGBB)"
+    )
+    parent_id: str | None = None
+
+
+class FolderUpdateRequest(pydantic.BaseModel):
+    """Request model for updating a folder."""
+
+    name: str | None = pydantic.Field(None, min_length=1, max_length=100)
+    icon: str | None = None
+    color: str | None = None
+
+
+class FolderMoveRequest(pydantic.BaseModel):
+    """Request model for moving a folder to a new parent."""
+
+    target_parent_id: str | None = None  # None = move to root
+
+
+class BulkMoveAgentsRequest(pydantic.BaseModel):
+    """Request model for moving multiple agents to a folder."""
+
+    agent_ids: list[str]
+    folder_id: str | None = None  # None = move to root
+
+
+class FolderListResponse(pydantic.BaseModel):
+    """Response schema for a list of folders."""
+
+    folders: list[LibraryFolder]
+    pagination: Pagination
+
+
+class FolderTreeResponse(pydantic.BaseModel):
+    """Response schema for folder tree structure."""
+
+    tree: list[LibraryFolderTree]
+
+
 class MarketplaceListingCreator(pydantic.BaseModel):
     """Creator information for a marketplace listing."""
 
@@ -120,6 +209,9 @@ class LibraryAgent(pydantic.BaseModel):
     can_access_graph: bool
     is_latest_version: bool
     is_favorite: bool
+    folder_id: str | None = None
+    folder_name: str | None = None  # Denormalized for display
+
     recommended_schedule_cron: str | None = None
     settings: GraphSettings = pydantic.Field(default_factory=GraphSettings)
     marketplace_listing: Optional["MarketplaceListing"] = None
@@ -259,6 +351,8 @@ class LibraryAgent(pydantic.BaseModel):
             can_access_graph=can_access_graph,
             is_latest_version=is_latest_version,
             is_favorite=agent.isFavorite,
+            folder_id=agent.folderId,
+            folder_name=agent.Folder.name if agent.Folder else None,
             recommended_schedule_cron=agent.AgentGraph.recommendedScheduleCron,
             settings=_parse_settings(agent.settings),
             marketplace_listing=marketplace_listing_data,
@@ -470,3 +564,7 @@ class LibraryAgentUpdateRequest(pydantic.BaseModel):
     settings: Optional[GraphSettings] = pydantic.Field(
         default=None, description="User-specific settings for this library agent"
     )
+    folder_id: Optional[str] = pydantic.Field(
+        default=None,
+        description="Folder ID to move agent to (None to move to root)",
+    )

autogpt_platform/backend/backend/api/features/library/routes/__init__.py

@@ -1,9 +1,11 @@
 import fastapi
 
 from .agents import router as agents_router
+from .folders import router as folders_router
 from .presets import router as presets_router
 
 router = fastapi.APIRouter()
 
 router.include_router(presets_router)
+router.include_router(folders_router)
 router.include_router(agents_router)

autogpt_platform/backend/backend/api/features/library/routes/agents.py

@@ -41,6 +41,14 @@ async def list_library_agents(
         ge=1,
         description="Number of agents per page (must be >= 1)",
     ),
+    folder_id: Optional[str] = Query(
+        None,
+        description="Filter by folder ID",
+    ),
+    include_root_only: bool = Query(
+        False,
+        description="Only return agents without a folder (root-level agents)",
+    ),
 ) -> library_model.LibraryAgentResponse:
     """
     Get all agents in the user's library (both created and saved).
@@ -51,6 +59,8 @@ async def list_library_agents(
         sort_by=sort_by,
         page=page,
         page_size=page_size,
+        folder_id=folder_id,
+        include_root_only=include_root_only,
     )
 
 
@@ -168,6 +178,7 @@ async def update_library_agent(
         is_favorite=payload.is_favorite,
         is_archived=payload.is_archived,
         settings=payload.settings,
+        folder_id=payload.folder_id,
     )
 
 

autogpt_platform/backend/backend/api/features/library/routes/folders.py

@@ -0,0 +1,287 @@
+from typing import Optional
+
+import autogpt_libs.auth as autogpt_auth_lib
+from fastapi import APIRouter, Query, Security, status
+from fastapi.responses import Response
+
+from .. import db as library_db
+from .. import model as library_model
+
+router = APIRouter(
+    prefix="/folders",
+    tags=["library", "folders", "private"],
+    dependencies=[Security(autogpt_auth_lib.requires_user)],
+)
+
+
+@router.get(
+    "",
+    summary="List Library Folders",
+    response_model=library_model.FolderListResponse,
+    responses={
+        200: {"description": "List of folders"},
+        500: {"description": "Server error"},
+    },
+)
+async def list_folders(
+    user_id: str = Security(autogpt_auth_lib.get_user_id),
+    parent_id: Optional[str] = Query(
+        None,
+        description="Filter by parent folder ID. If not provided, returns root-level folders.",
+    ),
+    include_relations: bool = Query(
+        True,
+        description="Include agent and subfolder relations (for counts)",
+    ),
+) -> library_model.FolderListResponse:
+    """
+    List folders for the authenticated user.
+
+    Args:
+        user_id: ID of the authenticated user.
+        parent_id: Optional parent folder ID to filter by.
+        include_relations: Whether to include agent and subfolder relations for counts.
+
+    Returns:
+        A FolderListResponse containing folders.
+    """
+    folders = await library_db.list_folders(
+        user_id=user_id,
+        parent_id=parent_id,
+        include_relations=include_relations,
+    )
+    return library_model.FolderListResponse(
+        folders=folders,
+        pagination=library_model.Pagination(
+            total_items=len(folders),
+            total_pages=1,
+            current_page=1,
+            page_size=len(folders),
+        ),
+    )
+
+
+@router.get(
+    "/tree",
+    summary="Get Folder Tree",
+    response_model=library_model.FolderTreeResponse,
+    responses={
+        200: {"description": "Folder tree structure"},
+        500: {"description": "Server error"},
+    },
+)
+async def get_folder_tree(
+    user_id: str = Security(autogpt_auth_lib.get_user_id),
+) -> library_model.FolderTreeResponse:
+    """
+    Get the full folder tree for the authenticated user.
+
+    Args:
+        user_id: ID of the authenticated user.
+
+    Returns:
+        A FolderTreeResponse containing the nested folder structure.
+    """
+    tree = await library_db.get_folder_tree(user_id=user_id)
+    return library_model.FolderTreeResponse(tree=tree)
+
+
+@router.get(
+    "/{folder_id}",
+    summary="Get Folder",
+    response_model=library_model.LibraryFolder,
+    responses={
+        200: {"description": "Folder details"},
+        404: {"description": "Folder not found"},
+        500: {"description": "Server error"},
+    },
+)
+async def get_folder(
+    folder_id: str,
+    user_id: str = Security(autogpt_auth_lib.get_user_id),
+) -> library_model.LibraryFolder:
+    """
+    Get a specific folder.
+
+    Args:
+        folder_id: ID of the folder to retrieve.
+        user_id: ID of the authenticated user.
+
+    Returns:
+        The requested LibraryFolder.
+    """
+    return await library_db.get_folder(folder_id=folder_id, user_id=user_id)
+
+
+@router.post(
+    "",
+    summary="Create Folder",
+    status_code=status.HTTP_201_CREATED,
+    response_model=library_model.LibraryFolder,
+    responses={
+        201: {"description": "Folder created successfully"},
+        400: {"description": "Validation error"},
+        404: {"description": "Parent folder not found"},
+        409: {"description": "Folder name conflict"},
+        500: {"description": "Server error"},
+    },
+)
+async def create_folder(
+    payload: library_model.FolderCreateRequest,
+    user_id: str = Security(autogpt_auth_lib.get_user_id),
+) -> library_model.LibraryFolder:
+    """
+    Create a new folder.
+
+    Args:
+        payload: The folder creation request.
+        user_id: ID of the authenticated user.
+
+    Returns:
+        The created LibraryFolder.
+    """
+    return await library_db.create_folder(
+        user_id=user_id,
+        name=payload.name,
+        parent_id=payload.parent_id,
+        icon=payload.icon,
+        color=payload.color,
+    )
+
+
+@router.patch(
+    "/{folder_id}",
+    summary="Update Folder",
+    response_model=library_model.LibraryFolder,
+    responses={
+        200: {"description": "Folder updated successfully"},
+        400: {"description": "Validation error"},
+        404: {"description": "Folder not found"},
+        409: {"description": "Folder name conflict"},
+        500: {"description": "Server error"},
+    },
+)
+async def update_folder(
+    folder_id: str,
+    payload: library_model.FolderUpdateRequest,
+    user_id: str = Security(autogpt_auth_lib.get_user_id),
+) -> library_model.LibraryFolder:
+    """
+    Update a folder's properties.
+
+    Args:
+        folder_id: ID of the folder to update.
+        payload: The folder update request.
+        user_id: ID of the authenticated user.
+
+    Returns:
+        The updated LibraryFolder.
+    """
+    return await library_db.update_folder(
+        folder_id=folder_id,
+        user_id=user_id,
+        name=payload.name,
+        icon=payload.icon,
+        color=payload.color,
+    )
+
+
+@router.post(
+    "/{folder_id}/move",
+    summary="Move Folder",
+    response_model=library_model.LibraryFolder,
+    responses={
+        200: {"description": "Folder moved successfully"},
+        400: {"description": "Validation error (circular reference)"},
+        404: {"description": "Folder or target parent not found"},
+        409: {"description": "Folder name conflict in target location"},
+        500: {"description": "Server error"},
+    },
+)
+async def move_folder(
+    folder_id: str,
+    payload: library_model.FolderMoveRequest,
+    user_id: str = Security(autogpt_auth_lib.get_user_id),
+) -> library_model.LibraryFolder:
+    """
+    Move a folder to a new parent.
+
+    Args:
+        folder_id: ID of the folder to move.
+        payload: The move request with target parent.
+        user_id: ID of the authenticated user.
+
+    Returns:
+        The moved LibraryFolder.
+    """
+    return await library_db.move_folder(
+        folder_id=folder_id,
+        user_id=user_id,
+        target_parent_id=payload.target_parent_id,
+    )
+
+
+@router.delete(
+    "/{folder_id}",
+    summary="Delete Folder",
+    status_code=status.HTTP_204_NO_CONTENT,
+    responses={
+        204: {"description": "Folder deleted successfully"},
+        404: {"description": "Folder not found"},
+        500: {"description": "Server error"},
+    },
+)
+async def delete_folder(
+    folder_id: str,
+    user_id: str = Security(autogpt_auth_lib.get_user_id),
+) -> Response:
+    """
+    Soft-delete a folder and all its contents.
+
+    Args:
+        folder_id: ID of the folder to delete.
+        user_id: ID of the authenticated user.
+
+    Returns:
+        204 No Content if successful.
+    """
+    await library_db.delete_folder(
+        folder_id=folder_id,
+        user_id=user_id,
+        soft_delete=True,
+    )
+    return Response(status_code=status.HTTP_204_NO_CONTENT)
+
+
+# === Bulk Agent Operations ===
+
+
+@router.post(
+    "/agents/bulk-move",
+    summary="Bulk Move Agents",
+    response_model=list[library_model.LibraryAgent],
+    responses={
+        200: {"description": "Agents moved successfully"},
+        404: {"description": "Folder not found"},
+        500: {"description": "Server error"},
+    },
+)
+async def bulk_move_agents(
+    payload: library_model.BulkMoveAgentsRequest,
+    user_id: str = Security(autogpt_auth_lib.get_user_id),
+) -> list[library_model.LibraryAgent]:
+    """
+    Move multiple agents to a folder.
+
+    Args:
+        payload: The bulk move request with agent IDs and target folder.
+        user_id: ID of the authenticated user.
+
+    Returns:
+        The updated LibraryAgents.
+    """
+    return await library_db.bulk_move_agents_to_folder(
+        agent_ids=payload.agent_ids,
+        folder_id=payload.folder_id,
+        user_id=user_id,
+    )

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

@@ -115,6 +115,8 @@ async def test_get_library_agents_success(
         sort_by=library_model.LibraryAgentSort.UPDATED_AT,
         page=1,
         page_size=15,
+        folder_id=None,
+        include_root_only=False,
     )
 
 

autogpt_platform/backend/backend/api/features/store/content_handlers.py

@@ -9,15 +9,26 @@ import logging
 from abc import ABC, abstractmethod
 from dataclasses import dataclass
 from pathlib import Path
-from typing import Any
+from typing import Any, get_args, get_origin
 
 from prisma.enums import ContentType
 
+from backend.blocks.llm import LlmModel
 from backend.data.db import query_raw_with_schema
 
 logger = logging.getLogger(__name__)
 
 
+def _contains_type(annotation: Any, target: type) -> bool:
+    """Check if an annotation is or contains the target type (handles Optional/Union/Annotated)."""
+    if annotation is target:
+        return True
+    origin = get_origin(annotation)
+    if origin is None:
+        return False
+    return any(_contains_type(arg, target) for arg in get_args(annotation))
+
+
 @dataclass
 class ContentItem:
     """Represents a piece of content to be embedded."""
@@ -188,45 +199,51 @@ class BlockHandler(ContentHandler):
             try:
                 block_instance = block_cls()
 
-                # Skip disabled blocks - they shouldn't be indexed
                 if block_instance.disabled:
                     continue
 
                 # Build searchable text from block metadata
                 parts = []
-                if hasattr(block_instance, "name") and block_instance.name:
+                if block_instance.name:
                     parts.append(block_instance.name)
-                if (
-                    hasattr(block_instance, "description")
-                    and block_instance.description
-                ):
+                if block_instance.description:
                     parts.append(block_instance.description)
-                if hasattr(block_instance, "categories") and block_instance.categories:
-                    # Convert BlockCategory enum to strings
+                if block_instance.categories:
                     parts.append(
                         " ".join(str(cat.value) for cat in block_instance.categories)
                     )
 
-                # Add input/output schema info
-                if hasattr(block_instance, "input_schema"):
-                    schema = block_instance.input_schema
-                    if hasattr(schema, "model_json_schema"):
-                        schema_dict = schema.model_json_schema()
-                        if "properties" in schema_dict:
-                            for prop_name, prop_info in schema_dict[
-                                "properties"
-                            ].items():
-                                if "description" in prop_info:
-                                    parts.append(
-                                        f"{prop_name}: {prop_info['description']}"
-                                    )
+                # Add input schema field descriptions
+                block_input_fields = block_instance.input_schema.model_fields
+                parts += [
+                    f"{field_name}: {field_info.description}"
+                    for field_name, field_info in block_input_fields.items()
+                    if field_info.description
+                ]
 
                 searchable_text = " ".join(parts)
 
-                # Convert categories set of enums to list of strings for JSON serialization
-                categories = getattr(block_instance, "categories", set())
                 categories_list = (
-                    [cat.value for cat in categories] if categories else []
+                    [cat.value for cat in block_instance.categories]
+                    if block_instance.categories
+                    else []
+                )
+
+                # Extract provider names from credentials fields
+                credentials_info = (
+                    block_instance.input_schema.get_credentials_fields_info()
+                )
+                is_integration = len(credentials_info) > 0
+                provider_names = [
+                    provider.value.lower()
+                    for info in credentials_info.values()
+                    for provider in info.provider
+                ]
+
+                # Check if block has LlmModel field in input schema
+                has_llm_model_field = any(
+                    _contains_type(field.annotation, LlmModel)
+                    for field in block_instance.input_schema.model_fields.values()
                 )
 
                 items.append(
@@ -235,8 +252,11 @@ class BlockHandler(ContentHandler):
                         content_type=ContentType.BLOCK,
                         searchable_text=searchable_text,
                         metadata={
-                            "name": getattr(block_instance, "name", ""),
+                            "name": block_instance.name,
                             "categories": categories_list,
+                            "providers": provider_names,
+                            "has_llm_model_field": has_llm_model_field,
+                            "is_integration": is_integration,
                         },
                         user_id=None,  # Blocks are public
                     )

autogpt_platform/backend/backend/api/features/store/content_handlers_test.py

@@ -82,9 +82,10 @@ async def test_block_handler_get_missing_items(mocker):
     mock_block_instance.description = "Performs calculations"
     mock_block_instance.categories = [MagicMock(value="MATH")]
     mock_block_instance.disabled = False
-    mock_block_instance.input_schema.model_json_schema.return_value = {
-        "properties": {"expression": {"description": "Math expression to evaluate"}}
-    }
+    mock_field = MagicMock()
+    mock_field.description = "Math expression to evaluate"
+    mock_block_instance.input_schema.model_fields = {"expression": mock_field}
+    mock_block_instance.input_schema.get_credentials_fields_info.return_value = {}
     mock_block_class.return_value = mock_block_instance
 
     mock_blocks = {"block-uuid-1": mock_block_class}
@@ -309,19 +310,19 @@ async def test_content_handlers_registry():
 
 
 @pytest.mark.asyncio(loop_scope="session")
-async def test_block_handler_handles_missing_attributes():
-    """Test BlockHandler gracefully handles blocks with missing attributes."""
+async def test_block_handler_handles_empty_attributes():
+    """Test BlockHandler handles blocks with empty/falsy attribute values."""
     handler = BlockHandler()
 
-    # Mock block with minimal attributes
+    # Mock block with empty values (all attributes exist but are falsy)
     mock_block_class = MagicMock()
     mock_block_instance = MagicMock()
     mock_block_instance.name = "Minimal Block"
     mock_block_instance.disabled = False
-    # No description, categories, or schema
-    del mock_block_instance.description
-    del mock_block_instance.categories
-    del mock_block_instance.input_schema
+    mock_block_instance.description = ""
+    mock_block_instance.categories = set()
+    mock_block_instance.input_schema.model_fields = {}
+    mock_block_instance.input_schema.get_credentials_fields_info.return_value = {}
     mock_block_class.return_value = mock_block_instance
 
     mock_blocks = {"block-minimal": mock_block_class}
@@ -352,6 +353,8 @@ async def test_block_handler_skips_failed_blocks():
     good_instance.description = "Works fine"
     good_instance.categories = []
     good_instance.disabled = False
+    good_instance.input_schema.model_fields = {}
+    good_instance.input_schema.get_credentials_fields_info.return_value = {}
     good_block.return_value = good_instance
 
     bad_block = MagicMock()

autogpt_platform/backend/backend/api/rest_api.py

@@ -41,6 +41,10 @@ import backend.data.user
 import backend.integrations.webhooks.utils
 import backend.util.service
 import backend.util.settings
+from backend.api.features.library.exceptions import (
+    FolderAlreadyExistsError,
+    FolderValidationError,
+)
 from backend.blocks.llm import DEFAULT_LLM_MODEL
 from backend.data.model import Credentials
 from backend.integrations.providers import ProviderName
@@ -261,6 +265,10 @@ async def validation_error_handler(
 
 
 app.add_exception_handler(PrismaError, handle_internal_http_error(500))
+app.add_exception_handler(
+    FolderAlreadyExistsError, handle_internal_http_error(409, False)
+)
+app.add_exception_handler(FolderValidationError, handle_internal_http_error(400, False))
 app.add_exception_handler(NotFoundError, handle_internal_http_error(404, False))
 app.add_exception_handler(NotAuthorizedError, handle_internal_http_error(403, False))
 app.add_exception_handler(RequestValidationError, validation_error_handler)

autogpt_platform/backend/backend/blocks/telegram/_api.py

@@ -0,0 +1,182 @@
+"""
+Telegram Bot API helper functions.
+
+Provides utilities for making authenticated requests to the Telegram Bot API.
+"""
+
+import logging
+from io import BytesIO
+from typing import Any, Optional
+
+from pydantic import BaseModel
+
+from backend.data.model import APIKeyCredentials
+from backend.util.request import Requests
+
+logger = logging.getLogger(__name__)
+
+TELEGRAM_API_BASE = "https://api.telegram.org"
+
+
+class TelegramMessageResult(BaseModel, extra="allow"):
+    """Result from Telegram send/edit message API calls."""
+
+    message_id: int = 0
+    chat: dict[str, Any] = {}
+    date: int = 0
+    text: str = ""
+
+
+class TelegramFileResult(BaseModel, extra="allow"):
+    """Result from Telegram getFile API call."""
+
+    file_id: str = ""
+    file_unique_id: str = ""
+    file_size: int = 0
+    file_path: str = ""
+
+
+class TelegramAPIException(ValueError):
+    """Exception raised for Telegram API errors."""
+
+    def __init__(self, message: str, error_code: int = 0):
+        super().__init__(message)
+        self.error_code = error_code
+
+
+def get_bot_api_url(bot_token: str, method: str) -> str:
+    """Construct Telegram Bot API URL for a method."""
+    return f"{TELEGRAM_API_BASE}/bot{bot_token}/{method}"
+
+
+def get_file_url(bot_token: str, file_path: str) -> str:
+    """Construct Telegram file download URL."""
+    return f"{TELEGRAM_API_BASE}/file/bot{bot_token}/{file_path}"
+
+
+async def call_telegram_api(
+    credentials: APIKeyCredentials,
+    method: str,
+    data: Optional[dict[str, Any]] = None,
+) -> TelegramMessageResult:
+    """
+    Make a request to the Telegram Bot API.
+
+    Args:
+        credentials: Bot token credentials
+        method: API method name (e.g., "sendMessage", "getFile")
+        data: Request parameters
+
+    Returns:
+        API response result
+
+    Raises:
+        TelegramAPIException: If the API returns an error
+    """
+    token = credentials.api_key.get_secret_value()
+    url = get_bot_api_url(token, method)
+
+    response = await Requests().post(url, json=data or {})
+    result = response.json()
+
+    if not result.get("ok"):
+        error_code = result.get("error_code", 0)
+        description = result.get("description", "Unknown error")
+        raise TelegramAPIException(description, error_code)
+
+    return TelegramMessageResult(**result.get("result", {}))
+
+
+async def call_telegram_api_with_file(
+    credentials: APIKeyCredentials,
+    method: str,
+    file_field: str,
+    file_data: bytes,
+    filename: str,
+    content_type: str,
+    data: Optional[dict[str, Any]] = None,
+) -> TelegramMessageResult:
+    """
+    Make a multipart/form-data request to the Telegram Bot API with a file upload.
+
+    Args:
+        credentials: Bot token credentials
+        method: API method name (e.g., "sendPhoto", "sendVoice")
+        file_field: Form field name for the file (e.g., "photo", "voice")
+        file_data: Raw file bytes
+        filename: Filename for the upload
+        content_type: MIME type of the file
+        data: Additional form parameters
+
+    Returns:
+        API response result
+
+    Raises:
+        TelegramAPIException: If the API returns an error
+    """
+    token = credentials.api_key.get_secret_value()
+    url = get_bot_api_url(token, method)
+
+    files = [(file_field, (filename, BytesIO(file_data), content_type))]
+
+    response = await Requests().post(url, files=files, data=data or {})
+    result = response.json()
+
+    if not result.get("ok"):
+        error_code = result.get("error_code", 0)
+        description = result.get("description", "Unknown error")
+        raise TelegramAPIException(description, error_code)
+
+    return TelegramMessageResult(**result.get("result", {}))
+
+
+async def get_file_info(
+    credentials: APIKeyCredentials, file_id: str
+) -> TelegramFileResult:
+    """
+    Get file information from Telegram.
+
+    Args:
+        credentials: Bot token credentials
+        file_id: Telegram file_id from message
+
+    Returns:
+        File info dict containing file_id, file_unique_id, file_size, file_path
+    """
+    result = await call_telegram_api(credentials, "getFile", {"file_id": file_id})
+    return TelegramFileResult(**result.model_dump())
+
+
+async def get_file_download_url(credentials: APIKeyCredentials, file_id: str) -> str:
+    """
+    Get the download URL for a Telegram file.
+
+    Args:
+        credentials: Bot token credentials
+        file_id: Telegram file_id from message
+
+    Returns:
+        Full download URL
+    """
+    token = credentials.api_key.get_secret_value()
+    result = await get_file_info(credentials, file_id)
+    file_path = result.file_path
+    if not file_path:
+        raise TelegramAPIException("No file_path returned from getFile")
+    return get_file_url(token, file_path)
+
+
+async def download_telegram_file(credentials: APIKeyCredentials, file_id: str) -> bytes:
+    """
+    Download a file from Telegram servers.
+
+    Args:
+        credentials: Bot token credentials
+        file_id: Telegram file_id
+
+    Returns:
+        File content as bytes
+    """
+    url = await get_file_download_url(credentials, file_id)
+    response = await Requests().get(url)
+    return response.content

autogpt_platform/backend/backend/blocks/telegram/_auth.py

@@ -0,0 +1,43 @@
+"""
+Telegram Bot credentials handling.
+
+Telegram bots use an API key (bot token) obtained from @BotFather.
+"""
+
+from typing import Literal
+
+from pydantic import SecretStr
+
+from backend.data.model import APIKeyCredentials, CredentialsField, CredentialsMetaInput
+from backend.integrations.providers import ProviderName
+
+# Bot token credentials (API key style)
+TelegramCredentials = APIKeyCredentials
+TelegramCredentialsInput = CredentialsMetaInput[
+    Literal[ProviderName.TELEGRAM], Literal["api_key"]
+]
+
+
+def TelegramCredentialsField() -> TelegramCredentialsInput:
+    """Creates a Telegram bot token credentials field."""
+    return CredentialsField(
+        description="Telegram Bot API token from @BotFather. "
+        "Create a bot at https://t.me/BotFather to get your token."
+    )
+
+
+# Test credentials for unit tests
+TEST_CREDENTIALS = APIKeyCredentials(
+    id="01234567-89ab-cdef-0123-456789abcdef",
+    provider="telegram",
+    api_key=SecretStr("test_telegram_bot_token"),
+    title="Mock Telegram Bot Token",
+    expires_at=None,
+)
+
+TEST_CREDENTIALS_INPUT = {
+    "provider": TEST_CREDENTIALS.provider,
+    "id": TEST_CREDENTIALS.id,
+    "type": TEST_CREDENTIALS.type,
+    "title": TEST_CREDENTIALS.title,
+}

autogpt_platform/backend/backend/blocks/telegram/triggers.py

@@ -0,0 +1,377 @@
+"""
+Telegram trigger blocks for receiving messages via webhooks.
+"""
+
+import logging
+
+from pydantic import BaseModel
+
+from backend.blocks._base import (
+    Block,
+    BlockCategory,
+    BlockOutput,
+    BlockSchemaInput,
+    BlockSchemaOutput,
+    BlockWebhookConfig,
+)
+from backend.data.model import SchemaField
+from backend.integrations.providers import ProviderName
+from backend.integrations.webhooks.telegram import TelegramWebhookType
+
+from ._auth import (
+    TEST_CREDENTIALS,
+    TEST_CREDENTIALS_INPUT,
+    TelegramCredentialsField,
+    TelegramCredentialsInput,
+)
+
+logger = logging.getLogger(__name__)
+
+
+# Example payload for testing
+EXAMPLE_MESSAGE_PAYLOAD = {
+    "update_id": 123456789,
+    "message": {
+        "message_id": 1,
+        "from": {
+            "id": 12345678,
+            "is_bot": False,
+            "first_name": "John",
+            "last_name": "Doe",
+            "username": "johndoe",
+            "language_code": "en",
+        },
+        "chat": {
+            "id": 12345678,
+            "first_name": "John",
+            "last_name": "Doe",
+            "username": "johndoe",
+            "type": "private",
+        },
+        "date": 1234567890,
+        "text": "Hello, bot!",
+    },
+}
+
+
+class TelegramTriggerBase:
+    """Base class for Telegram trigger blocks."""
+
+    class Input(BlockSchemaInput):
+        credentials: TelegramCredentialsInput = TelegramCredentialsField()
+        payload: dict = SchemaField(hidden=True, default_factory=dict)
+
+
+class TelegramMessageTriggerBlock(TelegramTriggerBase, Block):
+    """
+    Triggers when a message is received or edited in your Telegram bot.
+
+    Supports text, photos, voice messages, audio files, documents, and videos.
+    Connect the outputs to other blocks to process messages and send responses.
+    """
+
+    class Input(TelegramTriggerBase.Input):
+        class EventsFilter(BaseModel):
+            """Filter for message types to receive."""
+
+            text: bool = True
+            photo: bool = False
+            voice: bool = False
+            audio: bool = False
+            document: bool = False
+            video: bool = False
+            edited_message: bool = False
+
+        events: EventsFilter = SchemaField(
+            title="Message Types", description="Types of messages to receive"
+        )
+
+    class Output(BlockSchemaOutput):
+        payload: dict = SchemaField(
+            description="The complete webhook payload from Telegram"
+        )
+        chat_id: int = SchemaField(
+            description="The chat ID where the message was received. "
+            "Use this to send replies."
+        )
+        message_id: int = SchemaField(description="The unique message ID")
+        user_id: int = SchemaField(description="The user ID who sent the message")
+        username: str = SchemaField(description="Username of the sender (may be empty)")
+        first_name: str = SchemaField(description="First name of the sender")
+        event: str = SchemaField(
+            description="The message type (text, photo, voice, audio, etc.)"
+        )
+        text: str = SchemaField(
+            description="Text content of the message (for text messages)"
+        )
+        photo_file_id: str = SchemaField(
+            description="File ID of the photo (for photo messages). "
+            "Use GetTelegramFileBlock to download."
+        )
+        voice_file_id: str = SchemaField(
+            description="File ID of the voice message (for voice messages). "
+            "Use GetTelegramFileBlock to download."
+        )
+        audio_file_id: str = SchemaField(
+            description="File ID of the audio file (for audio messages). "
+            "Use GetTelegramFileBlock to download."
+        )
+        file_id: str = SchemaField(
+            description="File ID for document/video messages. "
+            "Use GetTelegramFileBlock to download."
+        )
+        file_name: str = SchemaField(
+            description="Original filename (for document/audio messages)"
+        )
+        caption: str = SchemaField(description="Caption for media messages")
+        is_edited: bool = SchemaField(
+            description="Whether this is an edit of a previously sent message"
+        )
+
+    def __init__(self):
+        super().__init__(
+            id="4435e4e0-df6e-4301-8f35-ad70b12fc9ec",
+            description="Triggers when a message is received or edited in your Telegram bot. "
+            "Supports text, photos, voice messages, audio files, documents, and videos.",
+            categories={BlockCategory.SOCIAL},
+            input_schema=TelegramMessageTriggerBlock.Input,
+            output_schema=TelegramMessageTriggerBlock.Output,
+            webhook_config=BlockWebhookConfig(
+                provider=ProviderName.TELEGRAM,
+                webhook_type=TelegramWebhookType.BOT,
+                resource_format="bot",
+                event_filter_input="events",
+                event_format="message.{event}",
+            ),
+            test_input={
+                "events": {"text": True, "photo": True},
+                "credentials": TEST_CREDENTIALS_INPUT,
+                "payload": EXAMPLE_MESSAGE_PAYLOAD,
+            },
+            test_credentials=TEST_CREDENTIALS,
+            test_output=[
+                ("payload", EXAMPLE_MESSAGE_PAYLOAD),
+                ("chat_id", 12345678),
+                ("message_id", 1),
+                ("user_id", 12345678),
+                ("username", "johndoe"),
+                ("first_name", "John"),
+                ("is_edited", False),
+                ("event", "text"),
+                ("text", "Hello, bot!"),
+                ("photo_file_id", ""),
+                ("voice_file_id", ""),
+                ("audio_file_id", ""),
+                ("file_id", ""),
+                ("file_name", ""),
+                ("caption", ""),
+            ],
+        )
+
+    async def run(self, input_data: Input, **kwargs) -> BlockOutput:
+        payload = input_data.payload
+        is_edited = "edited_message" in payload
+        message = payload.get("message") or payload.get("edited_message", {})
+
+        # Extract common fields
+        chat = message.get("chat", {})
+        sender = message.get("from", {})
+
+        yield "payload", payload
+        yield "chat_id", chat.get("id", 0)
+        yield "message_id", message.get("message_id", 0)
+        yield "user_id", sender.get("id", 0)
+        yield "username", sender.get("username", "")
+        yield "first_name", sender.get("first_name", "")
+        yield "is_edited", is_edited
+
+        # For edited messages, yield event as "edited_message" and extract
+        # all content fields from the edited message body
+        if is_edited:
+            yield "event", "edited_message"
+            yield "text", message.get("text", "")
+            photos = message.get("photo", [])
+            yield "photo_file_id", photos[-1].get("file_id", "") if photos else ""
+            voice = message.get("voice", {})
+            yield "voice_file_id", voice.get("file_id", "")
+            audio = message.get("audio", {})
+            yield "audio_file_id", audio.get("file_id", "")
+            document = message.get("document", {})
+            video = message.get("video", {})
+            yield "file_id", (document.get("file_id", "") or video.get("file_id", ""))
+            yield "file_name", (
+                document.get("file_name", "") or audio.get("file_name", "")
+            )
+            yield "caption", message.get("caption", "")
+        # Determine message type and extract content
+        elif "text" in message:
+            yield "event", "text"
+            yield "text", message.get("text", "")
+            yield "photo_file_id", ""
+            yield "voice_file_id", ""
+            yield "audio_file_id", ""
+            yield "file_id", ""
+            yield "file_name", ""
+            yield "caption", ""
+        elif "photo" in message:
+            # Get the largest photo (last in array)
+            photos = message.get("photo", [])
+            photo_fid = photos[-1].get("file_id", "") if photos else ""
+            yield "event", "photo"
+            yield "text", ""
+            yield "photo_file_id", photo_fid
+            yield "voice_file_id", ""
+            yield "audio_file_id", ""
+            yield "file_id", ""
+            yield "file_name", ""
+            yield "caption", message.get("caption", "")
+        elif "voice" in message:
+            voice = message.get("voice", {})
+            yield "event", "voice"
+            yield "text", ""
+            yield "photo_file_id", ""
+            yield "voice_file_id", voice.get("file_id", "")
+            yield "audio_file_id", ""
+            yield "file_id", ""
+            yield "file_name", ""
+            yield "caption", message.get("caption", "")
+        elif "audio" in message:
+            audio = message.get("audio", {})
+            yield "event", "audio"
+            yield "text", ""
+            yield "photo_file_id", ""
+            yield "voice_file_id", ""
+            yield "audio_file_id", audio.get("file_id", "")
+            yield "file_id", ""
+            yield "file_name", audio.get("file_name", "")
+            yield "caption", message.get("caption", "")
+        elif "document" in message:
+            document = message.get("document", {})
+            yield "event", "document"
+            yield "text", ""
+            yield "photo_file_id", ""
+            yield "voice_file_id", ""
+            yield "audio_file_id", ""
+            yield "file_id", document.get("file_id", "")
+            yield "file_name", document.get("file_name", "")
+            yield "caption", message.get("caption", "")
+        elif "video" in message:
+            video = message.get("video", {})
+            yield "event", "video"
+            yield "text", ""
+            yield "photo_file_id", ""
+            yield "voice_file_id", ""
+            yield "audio_file_id", ""
+            yield "file_id", video.get("file_id", "")
+            yield "file_name", video.get("file_name", "")
+            yield "caption", message.get("caption", "")
+        else:
+            yield "event", "other"
+            yield "text", ""
+            yield "photo_file_id", ""
+            yield "voice_file_id", ""
+            yield "audio_file_id", ""
+            yield "file_id", ""
+            yield "file_name", ""
+            yield "caption", ""
+
+
+# Example payload for reaction trigger testing
+EXAMPLE_REACTION_PAYLOAD = {
+    "update_id": 123456790,
+    "message_reaction": {
+        "chat": {
+            "id": 12345678,
+            "first_name": "John",
+            "last_name": "Doe",
+            "username": "johndoe",
+            "type": "private",
+        },
+        "message_id": 42,
+        "user": {
+            "id": 12345678,
+            "is_bot": False,
+            "first_name": "John",
+            "username": "johndoe",
+        },
+        "date": 1234567890,
+        "new_reaction": [{"type": "emoji", "emoji": "👍"}],
+        "old_reaction": [],
+    },
+}
+
+
+class TelegramMessageReactionTriggerBlock(TelegramTriggerBase, Block):
+    """
+    Triggers when a reaction to a message is changed.
+
+    Works automatically in private chats. In group chats, the bot must be
+    an administrator to receive reaction updates.
+    """
+
+    class Input(TelegramTriggerBase.Input):
+        pass
+
+    class Output(BlockSchemaOutput):
+        payload: dict = SchemaField(
+            description="The complete webhook payload from Telegram"
+        )
+        chat_id: int = SchemaField(
+            description="The chat ID where the reaction occurred"
+        )
+        message_id: int = SchemaField(description="The message ID that was reacted to")
+        user_id: int = SchemaField(description="The user ID who changed the reaction")
+        username: str = SchemaField(description="Username of the user (may be empty)")
+        new_reactions: list = SchemaField(
+            description="List of new reactions on the message"
+        )
+        old_reactions: list = SchemaField(
+            description="List of previous reactions on the message"
+        )
+
+    def __init__(self):
+        super().__init__(
+            id="82525328-9368-4966-8f0c-cd78e80181fd",
+            description="Triggers when a reaction to a message is changed. "
+            "Works in private chats automatically. "
+            "In groups, the bot must be an administrator.",
+            categories={BlockCategory.SOCIAL},
+            input_schema=TelegramMessageReactionTriggerBlock.Input,
+            output_schema=TelegramMessageReactionTriggerBlock.Output,
+            webhook_config=BlockWebhookConfig(
+                provider=ProviderName.TELEGRAM,
+                webhook_type=TelegramWebhookType.BOT,
+                resource_format="bot",
+                event_filter_input="",
+                event_format="message_reaction",
+            ),
+            test_input={
+                "credentials": TEST_CREDENTIALS_INPUT,
+                "payload": EXAMPLE_REACTION_PAYLOAD,
+            },
+            test_credentials=TEST_CREDENTIALS,
+            test_output=[
+                ("payload", EXAMPLE_REACTION_PAYLOAD),
+                ("chat_id", 12345678),
+                ("message_id", 42),
+                ("user_id", 12345678),
+                ("username", "johndoe"),
+                ("new_reactions", [{"type": "emoji", "emoji": "👍"}]),
+                ("old_reactions", []),
+            ],
+        )
+
+    async def run(self, input_data: Input, **kwargs) -> BlockOutput:
+        payload = input_data.payload
+        reaction = payload.get("message_reaction", {})
+
+        chat = reaction.get("chat", {})
+        user = reaction.get("user", {})
+
+        yield "payload", payload
+        yield "chat_id", chat.get("id", 0)
+        yield "message_id", reaction.get("message_id", 0)
+        yield "user_id", user.get("id", 0)
+        yield "username", user.get("username", "")
+        yield "new_reactions", reaction.get("new_reaction", [])
+        yield "old_reactions", reaction.get("old_reaction", [])

autogpt_platform/backend/backend/copilot/config.py

@@ -85,7 +85,7 @@ class ChatConfig(BaseSettings):
     )
     claude_agent_max_subtasks: int = Field(
         default=10,
-        description="Max number of sub-agent Tasks the SDK can spawn per session.",
+        description="Max number of concurrent sub-agent Tasks the SDK can run per session.",
     )
     claude_agent_use_resume: bool = Field(
         default=True,

autogpt_platform/backend/backend/copilot/executor/manager.py

@@ -4,6 +4,7 @@ This module contains the CoPilotExecutor class that consumes chat tasks from
 RabbitMQ and processes them using a thread pool, following the graph executor pattern.
 """
 
+import asyncio
 import logging
 import os
 import threading
@@ -409,14 +410,19 @@ class CoPilotExecutor(AppProcess):
 
         def on_run_done(f: Future):
             logger.info(f"Run completed for {session_id}")
+            error_msg = None
             try:
                 if exec_error := f.exception():
-                    logger.error(f"Execution for {session_id} failed: {exec_error}")
+                    error_msg = str(exec_error) or type(exec_error).__name__
+                    logger.error(f"Execution for {session_id} failed: {error_msg}")
                     ack_message(reject=True, requeue=False)
                 else:
                     ack_message(reject=False, requeue=False)
+            except asyncio.CancelledError:
+                logger.info(f"Run completion callback cancelled for {session_id}")
             except BaseException as e:
-                logger.exception(f"Error in run completion callback: {e}")
+                error_msg = str(e) or type(e).__name__
+                logger.exception(f"Error in run completion callback: {error_msg}")
             finally:
                 # Release the cluster lock
                 if session_id in self._task_locks:

autogpt_platform/backend/backend/copilot/executor/processor.py

@@ -125,7 +125,10 @@ class CoPilotProcessor:
             )
             future.result(timeout=5)
         except Exception as e:
-            logger.warning(f"[CoPilotExecutor] Worker {self.tid} cleanup error: {e}")
+            error_msg = str(e) or type(e).__name__
+            logger.warning(
+                f"[CoPilotExecutor] Worker {self.tid} cleanup error: {error_msg}"
+            )
 
         # Stop the event loop
         self.execution_loop.call_soon_threadsafe(self.execution_loop.stop)
@@ -157,47 +160,30 @@ class CoPilotProcessor:
 
         start_time = time.monotonic()
 
-        try:
-            # Run the async execution in our event loop
-            future = asyncio.run_coroutine_threadsafe(
-                self._execute_async(entry, cancel, cluster_lock, log),
-                self.execution_loop,
-            )
+        # Run the async execution in our event loop
+        future = asyncio.run_coroutine_threadsafe(
+            self._execute_async(entry, cancel, cluster_lock, log),
+            self.execution_loop,
+        )
 
-            # Wait for completion, checking cancel periodically
-            while not future.done():
-                try:
-                    future.result(timeout=1.0)
-                except asyncio.TimeoutError:
-                    if cancel.is_set():
-                        log.info("Cancellation requested")
-                        future.cancel()
-                        break
-                    # Refresh cluster lock to maintain ownership
-                    cluster_lock.refresh()
-
-            if not future.cancelled():
-                # Get result to propagate any exceptions
-                future.result()
-
-            elapsed = time.monotonic() - start_time
-            log.info(f"Execution completed in {elapsed:.2f}s")
-
-        except BaseException as e:
-            elapsed = time.monotonic() - start_time
-            log.error(f"Execution failed after {elapsed:.2f}s: {e}")
-            # Safety net: if _execute_async's error handler failed to mark
-            # the session (e.g. RuntimeError from SDK cleanup), do it here.
+        # Wait for completion, checking cancel periodically
+        while not future.done():
             try:
-                asyncio.run_coroutine_threadsafe(
-                    stream_registry.mark_session_completed(
-                        entry.session_id, error_message=str(e) or "Unknown error"
-                    ),
-                    self.execution_loop,
-                ).result(timeout=5.0)
-            except Exception as cleanup_err:
-                log.error(f"Safety net mark_session_completed failed: {cleanup_err}")
-            raise
+                future.result(timeout=1.0)
+            except asyncio.TimeoutError:
+                if cancel.is_set():
+                    log.info("Cancellation requested")
+                    future.cancel()
+                    break
+                # Refresh cluster lock to maintain ownership
+                cluster_lock.refresh()
+
+        if not future.cancelled():
+            # Get result to propagate any exceptions
+            future.result()
+
+        elapsed = time.monotonic() - start_time
+        log.info(f"Execution completed in {elapsed:.2f}s")
 
     async def _execute_async(
         self,
@@ -219,6 +205,7 @@ class CoPilotProcessor:
         """
         last_refresh = time.monotonic()
         refresh_interval = 30.0  # Refresh lock every 30 seconds
+        error_msg = None
 
         try:
             # Choose service based on LaunchDarkly flag
@@ -264,17 +251,26 @@ class CoPilotProcessor:
                         exc_info=True,
                     )
 
-            error_message = "Operation cancelled" if cancel.is_set() else None
-            await stream_registry.mark_session_completed(
-                entry.session_id, error_message=error_message
-            )
+            # Stream loop completed
+            if cancel.is_set():
+                log.info("Stream cancelled by user")
 
         except BaseException as e:
-            log.error(f"Turn failed: {e}")
+            # Handle all exceptions (including CancelledError) with appropriate logging
+            if isinstance(e, asyncio.CancelledError):
+                log.info("Turn cancelled")
+                error_msg = "Operation cancelled"
+            else:
+                error_msg = str(e) or type(e).__name__
+                log.error(f"Turn failed: {error_msg}")
+            raise
+        finally:
+            # If no exception but user cancelled, still mark as cancelled
+            if not error_msg and cancel.is_set():
+                error_msg = "Operation cancelled"
             try:
                 await stream_registry.mark_session_completed(
-                    entry.session_id, error_message=str(e) or "Unknown error"
+                    entry.session_id, error_message=error_msg
                 )
             except Exception as mark_err:
-                log.error(f"mark_session_completed also failed: {mark_err}")
-            raise
+                log.error(f"Failed to mark session completed: {mark_err}")

autogpt_platform/backend/backend/copilot/sdk/security_hooks.py

@@ -160,7 +160,7 @@ def create_security_hooks(
     Args:
         user_id: Current user ID for isolation validation
         sdk_cwd: SDK working directory for workspace-scoped tool validation
-        max_subtasks: Maximum Task (sub-agent) spawns allowed per session
+        max_subtasks: Maximum concurrent Task (sub-agent) spawns allowed per session
         on_stop: Callback ``(transcript_path, sdk_session_id)`` invoked when
             the SDK finishes processing — used to read the JSONL transcript
             before the CLI process exits.
@@ -172,8 +172,9 @@ def create_security_hooks(
         from claude_agent_sdk import HookMatcher
         from claude_agent_sdk.types import HookContext, HookInput, SyncHookJSONOutput
 
-        # Per-session counter for Task sub-agent spawns
-        task_spawn_count = 0
+        # Per-session tracking for Task sub-agent concurrency.
+        # Set of tool_use_ids that consumed a slot — len() is the active count.
+        task_tool_use_ids: set[str] = set()
 
         async def pre_tool_use_hook(
             input_data: HookInput,
@@ -181,7 +182,6 @@ def create_security_hooks(
             context: HookContext,
         ) -> SyncHookJSONOutput:
             """Combined pre-tool-use validation hook."""
-            nonlocal task_spawn_count
             _ = context  # unused but required by signature
             tool_name = cast(str, input_data.get("tool_name", ""))
             tool_input = cast(dict[str, Any], input_data.get("tool_input", {}))
@@ -200,18 +200,18 @@ def create_security_hooks(
                             "(remove the run_in_background parameter)."
                         ),
                     )
-                if task_spawn_count >= max_subtasks:
+                if len(task_tool_use_ids) >= max_subtasks:
                     logger.warning(
                         f"[SDK] Task limit reached ({max_subtasks}), user={user_id}"
                     )
                     return cast(
                         SyncHookJSONOutput,
                         _deny(
-                            f"Maximum {max_subtasks} sub-tasks per session. "
-                            "Please continue in the main conversation."
+                            f"Maximum {max_subtasks} concurrent sub-tasks. "
+                            "Wait for running sub-tasks to finish, "
+                            "or continue in the main conversation."
                         ),
                     )
-                task_spawn_count += 1
 
             # Strip MCP prefix for consistent validation
             is_copilot_tool = tool_name.startswith(MCP_TOOL_PREFIX)
@@ -229,9 +229,24 @@ def create_security_hooks(
             if result:
                 return cast(SyncHookJSONOutput, result)
 
+            # Reserve the Task slot only after all validations pass
+            if tool_name == "Task" and tool_use_id is not None:
+                task_tool_use_ids.add(tool_use_id)
+
             logger.debug(f"[SDK] Tool start: {tool_name}, user={user_id}")
             return cast(SyncHookJSONOutput, {})
 
+        def _release_task_slot(tool_name: str, tool_use_id: str | None) -> None:
+            """Release a Task concurrency slot if one was reserved."""
+            if tool_name == "Task" and tool_use_id in task_tool_use_ids:
+                task_tool_use_ids.discard(tool_use_id)
+                logger.info(
+                    "[SDK] Task slot released, active=%d/%d, user=%s",
+                    len(task_tool_use_ids),
+                    max_subtasks,
+                    user_id,
+                )
+
         async def post_tool_use_hook(
             input_data: HookInput,
             tool_use_id: str | None,
@@ -246,6 +261,8 @@ def create_security_hooks(
             """
             _ = context
             tool_name = cast(str, input_data.get("tool_name", ""))
+
+            _release_task_slot(tool_name, tool_use_id)
             is_builtin = not tool_name.startswith(MCP_TOOL_PREFIX)
             logger.info(
                 "[SDK] PostToolUse: %s (builtin=%s, tool_use_id=%s)",
@@ -289,6 +306,9 @@ def create_security_hooks(
                 f"[SDK] Tool failed: {tool_name}, error={error}, "
                 f"user={user_id}, tool_use_id={tool_use_id}"
             )
+
+            _release_task_slot(tool_name, tool_use_id)
+
             return cast(SyncHookJSONOutput, {})
 
         async def pre_compact_hook(

autogpt_platform/backend/backend/copilot/sdk/security_hooks_test.py

@@ -208,19 +208,22 @@ def test_bash_builtin_blocked_message_clarity():
 
 @pytest.fixture()
 def _hooks():
-    """Create security hooks and return the PreToolUse handler."""
+    """Create security hooks and return (pre, post, post_failure) handlers."""
     from .security_hooks import create_security_hooks
 
     hooks = create_security_hooks(user_id="u1", sdk_cwd=SDK_CWD, max_subtasks=2)
     pre = hooks["PreToolUse"][0].hooks[0]
-    return pre
+    post = hooks["PostToolUse"][0].hooks[0]
+    post_failure = hooks["PostToolUseFailure"][0].hooks[0]
+    return pre, post, post_failure
 
 
 @pytest.mark.skipif(not _sdk_available(), reason="claude_agent_sdk not installed")
 @pytest.mark.asyncio
 async def test_task_background_blocked(_hooks):
     """Task with run_in_background=true must be denied."""
-    result = await _hooks(
+    pre, _, _ = _hooks
+    result = await pre(
         {"tool_name": "Task", "tool_input": {"run_in_background": True, "prompt": "x"}},
         tool_use_id=None,
         context={},
@@ -233,9 +236,10 @@ async def test_task_background_blocked(_hooks):
 @pytest.mark.asyncio
 async def test_task_foreground_allowed(_hooks):
     """Task without run_in_background should be allowed."""
-    result = await _hooks(
+    pre, _, _ = _hooks
+    result = await pre(
         {"tool_name": "Task", "tool_input": {"prompt": "do stuff"}},
-        tool_use_id=None,
+        tool_use_id="tu-1",
         context={},
     )
     assert not _is_denied(result)
@@ -245,25 +249,102 @@ async def test_task_foreground_allowed(_hooks):
 @pytest.mark.asyncio
 async def test_task_limit_enforced(_hooks):
     """Task spawns beyond max_subtasks should be denied."""
+    pre, _, _ = _hooks
     # First two should pass
-    for _ in range(2):
-        result = await _hooks(
+    for i in range(2):
+        result = await pre(
             {"tool_name": "Task", "tool_input": {"prompt": "ok"}},
-            tool_use_id=None,
+            tool_use_id=f"tu-limit-{i}",
             context={},
         )
         assert not _is_denied(result)
 
     # Third should be denied (limit=2)
-    result = await _hooks(
+    result = await pre(
         {"tool_name": "Task", "tool_input": {"prompt": "over limit"}},
-        tool_use_id=None,
+        tool_use_id="tu-limit-2",
         context={},
     )
     assert _is_denied(result)
     assert "Maximum" in _reason(result)
 
 
+@pytest.mark.skipif(not _sdk_available(), reason="claude_agent_sdk not installed")
+@pytest.mark.asyncio
+async def test_task_slot_released_on_completion(_hooks):
+    """Completing a Task should free a slot so new Tasks can be spawned."""
+    pre, post, _ = _hooks
+    # Fill both slots
+    for i in range(2):
+        result = await pre(
+            {"tool_name": "Task", "tool_input": {"prompt": "ok"}},
+            tool_use_id=f"tu-comp-{i}",
+            context={},
+        )
+        assert not _is_denied(result)
+
+    # Third should be denied — at capacity
+    result = await pre(
+        {"tool_name": "Task", "tool_input": {"prompt": "over"}},
+        tool_use_id="tu-comp-2",
+        context={},
+    )
+    assert _is_denied(result)
+
+    # Complete first task — frees a slot
+    await post(
+        {"tool_name": "Task", "tool_input": {}},
+        tool_use_id="tu-comp-0",
+        context={},
+    )
+
+    # Now a new Task should be allowed
+    result = await pre(
+        {"tool_name": "Task", "tool_input": {"prompt": "after release"}},
+        tool_use_id="tu-comp-3",
+        context={},
+    )
+    assert not _is_denied(result)
+
+
+@pytest.mark.skipif(not _sdk_available(), reason="claude_agent_sdk not installed")
+@pytest.mark.asyncio
+async def test_task_slot_released_on_failure(_hooks):
+    """A failed Task should also free its concurrency slot."""
+    pre, _, post_failure = _hooks
+    # Fill both slots
+    for i in range(2):
+        result = await pre(
+            {"tool_name": "Task", "tool_input": {"prompt": "ok"}},
+            tool_use_id=f"tu-fail-{i}",
+            context={},
+        )
+        assert not _is_denied(result)
+
+    # At capacity
+    result = await pre(
+        {"tool_name": "Task", "tool_input": {"prompt": "over"}},
+        tool_use_id="tu-fail-2",
+        context={},
+    )
+    assert _is_denied(result)
+
+    # Fail first task — should free a slot
+    await post_failure(
+        {"tool_name": "Task", "tool_input": {}, "error": "something broke"},
+        tool_use_id="tu-fail-0",
+        context={},
+    )
+
+    # New Task should be allowed
+    result = await pre(
+        {"tool_name": "Task", "tool_input": {"prompt": "after failure"}},
+        tool_use_id="tu-fail-3",
+        context={},
+    )
+    assert not _is_denied(result)
+
+
 # -- _is_tool_error_or_denial ------------------------------------------------
 
 
@@ -298,7 +379,9 @@ class TestIsToolErrorOrDenial:
     def test_subtask_limit_denial(self):
         assert (
             _is_tool_error_or_denial(
-                "Maximum 2 sub-tasks per session. Please continue in the main conversation."
+                "Maximum 2 concurrent sub-tasks. "
+                "Wait for running sub-tasks to finish, "
+                "or continue in the main conversation."
             )
             is True
         )

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

@@ -75,14 +75,21 @@ class CapturedTranscript:
 
 _SDK_CWD_PREFIX = WORKSPACE_PREFIX
 
+# Special message prefixes for text-based markers (parsed by frontend)
+COPILOT_ERROR_PREFIX = "[COPILOT_ERROR]"  # Renders as ErrorCard
+COPILOT_SYSTEM_PREFIX = "[COPILOT_SYSTEM]"  # Renders as system info message
+
 # Heartbeat interval — keep SSE alive through proxies/LBs during tool execution.
 # IMPORTANT: Must be less than frontend timeout (12s in useCopilotPage.ts)
 _HEARTBEAT_INTERVAL = 10.0  # seconds
 
+
 # Appended to the system prompt to inform the agent about available tools.
 # The SDK built-in Bash is NOT available — use mcp__copilot__bash_exec instead,
 # which has kernel-level network isolation (unshare --net).
-_SDK_TOOL_SUPPLEMENT = """
+def _build_sdk_tool_supplement(cwd: str) -> str:
+    """Build the SDK tool supplement with the actual working directory injected."""
+    return f"""
 
 ## Tool notes
 
@@ -90,9 +97,16 @@ _SDK_TOOL_SUPPLEMENT = """
 - The SDK built-in Bash tool is NOT available.  Use the `bash_exec` MCP tool
   for shell commands — it runs in a network-isolated sandbox.
 
+### Working directory
+- Your working directory is: `{cwd}`
+- All SDK Read/Write/Edit/Glob/Grep tools AND `bash_exec` operate inside this
+  directory.  This is the ONLY writable path — do not attempt to read or write
+  anywhere else on the filesystem.
+- Use relative paths or absolute paths under `{cwd}` for all file operations.
+
 ### Two storage systems — CRITICAL to understand
 
-1. **Ephemeral working directory** (`/tmp/copilot-<session>/`):
+1. **Ephemeral working directory** (`{cwd}`):
    - Shared by SDK Read/Write/Edit/Glob/Grep tools AND `bash_exec`
    - Files here are **lost between turns** — do NOT rely on them persisting
    - Use for temporary work: running scripts, processing data, etc.
@@ -118,6 +132,21 @@ When you create or modify important files (code, configs, outputs), you MUST:
 2. At the start of a new turn, call `list_workspace_files` to see what files
    are available from previous turns
 
+### Sharing files with the user
+After saving a file to the persistent workspace with `write_workspace_file`,
+share it with the user by embedding the `download_url` from the response in
+your message as a Markdown link or image:
+
+- **Any file** — shows as a clickable download link:
+  `[report.csv](workspace://file_id#text/csv)`
+- **Image** — renders inline in chat:
+  `![chart](workspace://file_id#image/png)`
+- **Video** — renders inline in chat with player controls:
+  `![recording](workspace://file_id#video/mp4)`
+
+The `download_url` field in the `write_workspace_file` response is already
+in the correct format — paste it directly after the `(` in the Markdown.
+
 ### Long-running tools
 Long-running tools (create_agent, edit_agent, etc.) are handled
 asynchronously.  You will receive an immediate response; the actual result
@@ -128,6 +157,7 @@ is delivered to the user via a background stream.
   All tasks must run in the foreground.
 """
 
+
 STREAM_LOCK_PREFIX = "copilot:stream:lock:"
 
 
@@ -413,6 +443,20 @@ async def stream_chat_completion_sdk(
     # Type narrowing: session is guaranteed ChatSession after the check above
     session = cast(ChatSession, session)
 
+    # Clean up stale error markers from previous turn before starting new turn
+    # If the last message contains an error marker, remove it (user is retrying)
+    if (
+        len(session.messages) > 0
+        and session.messages[-1].role == "assistant"
+        and session.messages[-1].content
+        and COPILOT_ERROR_PREFIX in session.messages[-1].content
+    ):
+        logger.info(
+            "[SDK] [%s] Removing stale error marker from previous turn",
+            session_id[:12],
+        )
+        session.messages.pop()
+
     # Append the new message to the session if it's not already there
     new_message_role = "user" if is_user_message else "assistant"
     if message and (
@@ -442,14 +486,13 @@ async def stream_chat_completion_sdk(
                 _background_tasks.add(task)
                 task.add_done_callback(_background_tasks.discard)
 
-    # Build system prompt (reuses non-SDK path with Langfuse support)
-    has_history = len(session.messages) > 1
-    system_prompt, _ = await _build_system_prompt(
-        user_id, has_conversation_history=has_history
-    )
-    system_prompt += _SDK_TOOL_SUPPLEMENT
     message_id = str(uuid.uuid4())
     stream_id = str(uuid.uuid4())
+    stream_completed = False
+    use_resume = False
+    resume_file: str | None = None
+    captured_transcript = CapturedTranscript()
+    sdk_cwd = ""
 
     # Acquire stream lock to prevent concurrent streams to the same session
     lock = AsyncClusterLock(
@@ -472,21 +515,30 @@ async def stream_chat_completion_sdk(
         )
         return
 
-    yield StreamStart(messageId=message_id, sessionId=session_id)
-
-    stream_completed = False
-    # Initialise variables before the try so the finally block can
-    # always attempt transcript upload regardless of errors.
-    sdk_cwd = ""
-    use_resume = False
-    resume_file: str | None = None
-    captured_transcript = CapturedTranscript()
-
+    # Make sure there is no more code between the lock acquitition and try-block.
     try:
-        # Use a session-specific temp dir to avoid cleanup race conditions
-        # between concurrent sessions.
-        sdk_cwd = _make_sdk_cwd(session_id)
-        os.makedirs(sdk_cwd, exist_ok=True)
+        # Build system prompt (reuses non-SDK path with Langfuse support).
+        # Pre-compute the cwd here so the exact working directory path can be
+        # injected into the supplement instead of the generic placeholder.
+        # Catch ValueError early so the failure yields a clean StreamError rather
+        # than propagating outside the stream error-handling path.
+        has_history = len(session.messages) > 1
+        try:
+            sdk_cwd = _make_sdk_cwd(session_id)
+            os.makedirs(sdk_cwd, exist_ok=True)
+        except (ValueError, OSError) as e:
+            logger.error("[SDK] [%s] Invalid SDK cwd: %s", session_id[:12], e)
+            yield StreamError(
+                errorText="Unable to initialize working directory.",
+                code="sdk_cwd_error",
+            )
+            return
+        system_prompt, _ = await _build_system_prompt(
+            user_id, has_conversation_history=has_history
+        )
+        system_prompt += _build_sdk_tool_supplement(sdk_cwd)
+
+        yield StreamStart(messageId=message_id, sessionId=session_id)
 
         set_execution_context(user_id, session)
         try:
@@ -725,6 +777,25 @@ async def stream_chat_completion_sdk(
                                     - len(adapter.resolved_tool_calls),
                                 )
 
+                        # Log ResultMessage details for debugging
+                        if isinstance(sdk_msg, ResultMessage):
+                            logger.info(
+                                "[SDK] [%s] Received: ResultMessage %s "
+                                "(unresolved=%d, current=%d, resolved=%d)",
+                                session_id[:12],
+                                sdk_msg.subtype,
+                                len(adapter.current_tool_calls)
+                                - len(adapter.resolved_tool_calls),
+                                len(adapter.current_tool_calls),
+                                len(adapter.resolved_tool_calls),
+                            )
+                            if sdk_msg.subtype in ("error", "error_during_execution"):
+                                logger.error(
+                                    "[SDK] [%s] SDK execution failed with error: %s",
+                                    session_id[:12],
+                                    sdk_msg.result or "(no error message provided)",
+                                )
+
                         for response in adapter.convert_message(sdk_msg):
                             if isinstance(response, StreamStart):
                                 continue
@@ -749,6 +820,15 @@ async def stream_chat_completion_sdk(
                                     extra,
                                 )
 
+                            # Log errors being sent to frontend
+                            if isinstance(response, StreamError):
+                                logger.error(
+                                    "[SDK] [%s] Sending error to frontend: %s (code=%s)",
+                                    session_id[:12],
+                                    response.errorText,
+                                    response.code,
+                                )
+
                             yield response
 
                             if isinstance(response, StreamTextDelta):
@@ -855,13 +935,13 @@ async def stream_chat_completion_sdk(
                         yield response
 
                 # If the stream ended without a ResultMessage, the SDK
-                # CLI exited unexpectedly.  Close any open text/step so
-                # the chunks are well-formed.  StreamFinish is published
-                # by mark_session_completed in the processor.
+                # CLI exited unexpectedly or the user stopped execution.
+                # Close any open text/step so chunks are well-formed, and
+                # append a cancellation message so users see feedback.
+                # StreamFinish is published by mark_session_completed in the processor.
                 if not stream_completed:
-                    logger.warning(
-                        "[SDK] [%s] Stream ended without ResultMessage "
-                        "(StopAsyncIteration)",
+                    logger.info(
+                        "[SDK] [%s] Stream ended without ResultMessage (stopped by user)",
                         session_id[:12],
                     )
                     closing_responses: list[StreamBaseResponse] = []
@@ -869,6 +949,15 @@ async def stream_chat_completion_sdk(
                     for r in closing_responses:
                         yield r
 
+                    # Add "Stopped by user" message so it persists after refresh
+                    # Use COPILOT_SYSTEM_PREFIX so frontend renders it as system message, not assistant
+                    session.messages.append(
+                        ChatMessage(
+                            role="assistant",
+                            content=f"{COPILOT_SYSTEM_PREFIX} Execution stopped by user",
+                        )
+                    )
+
                 if (
                     assistant_response.content or assistant_response.tool_calls
                 ) and not has_appended_assistant:
@@ -922,43 +1011,76 @@ async def stream_chat_completion_sdk(
                 "to use the OpenAI-compatible fallback."
             )
 
-        session = cast(ChatSession, await asyncio.shield(upsert_chat_session(session)))
         logger.info(
-            "[SDK] [%s] Session saved with %d messages",
+            "[SDK] [%s] Stream completed successfully with %d messages",
             session_id[:12],
             len(session.messages),
         )
-    except asyncio.CancelledError:
-        # Client disconnect / server shutdown — save session before re-raising
-        # so accumulated messages aren't lost.
-        logger.warning("[SDK] [%s] Session cancelled (CancelledError)", session_id[:12])
+    except BaseException as e:
+        # Catch BaseException to handle both Exception and CancelledError
+        # (CancelledError inherits from BaseException in Python 3.8+)
+        if isinstance(e, asyncio.CancelledError):
+            logger.warning("[SDK] [%s] Session cancelled", session_id[:12])
+            error_msg = "Operation cancelled"
+        else:
+            error_msg = str(e) or type(e).__name__
+            # SDK cleanup RuntimeError is expected during cancellation, log as warning
+            if isinstance(e, RuntimeError) and "cancel scope" in str(e):
+                logger.warning(
+                    "[SDK] [%s] SDK cleanup error: %s", session_id[:12], error_msg
+                )
+            else:
+                logger.error(
+                    f"[SDK] [%s] Error: {error_msg}", session_id[:12], exc_info=True
+                )
+
+        # Append error marker to session (non-invasive text parsing approach)
+        # The finally block will persist the session with this error marker
         if session:
+            session.messages.append(
+                ChatMessage(
+                    role="assistant", content=f"{COPILOT_ERROR_PREFIX} {error_msg}"
+                )
+            )
+            logger.debug(
+                "[SDK] [%s] Appended error marker, will be persisted in finally",
+                session_id[:12],
+            )
+
+        # Yield StreamError for immediate feedback (only for non-cancellation errors)
+        # Skip for CancelledError and RuntimeError cleanup issues (both are cancellations)
+        is_cancellation = isinstance(e, asyncio.CancelledError) or (
+            isinstance(e, RuntimeError) and "cancel scope" in str(e)
+        )
+        if not is_cancellation:
+            yield StreamError(
+                errorText=error_msg,
+                code="sdk_error",
+            )
+
+        raise
+    finally:
+        # --- Persist session messages ---
+        # This MUST run in finally to persist messages even when the generator
+        # is stopped early (e.g., user clicks stop, processor breaks stream loop).
+        # Without this, messages disappear after refresh because they were never
+        # saved to the database.
+        if session is not None:
             try:
                 await asyncio.shield(upsert_chat_session(session))
                 logger.info(
-                    "[SDK] [%s] Session saved on cancel (%d messages)",
+                    "[SDK] [%s] Session persisted in finally with %d messages",
                     session_id[:12],
                     len(session.messages),
                 )
-            except Exception as save_err:
+            except Exception as persist_err:
                 logger.error(
-                    "[SDK] [%s] Failed to save session on cancel: %s",
+                    "[SDK] [%s] Failed to persist session in finally: %s",
                     session_id[:12],
-                    save_err,
+                    persist_err,
+                    exc_info=True,
                 )
-        raise
-    except Exception as e:
-        logger.error(f"[SDK] Error: {e}", exc_info=True)
-        if session:
-            try:
-                await asyncio.shield(upsert_chat_session(session))
-            except Exception as save_err:
-                logger.error(f"[SDK] Failed to save session on error: {save_err}")
-        yield StreamError(
-            errorText="An error occurred. Please try again.",
-            code="sdk_error",
-        )
-    finally:
+
         # --- Upload transcript for next-turn --resume ---
         # This MUST run in finally so the transcript is uploaded even when
         # the streaming loop raises an exception.  The CLI uses

autogpt_platform/backend/backend/copilot/stream_registry.py

@@ -707,7 +707,6 @@ async def mark_session_completed(
         True if session was newly marked completed, False if already completed/failed
     """
     status: Literal["completed", "failed"] = "failed" if error_message else "completed"
-
     redis = await get_redis_async()
     meta_key = _get_session_meta_key(session_id)
 

autogpt_platform/backend/backend/copilot/tools/agent_output.py

@@ -5,7 +5,7 @@ import re
 from datetime import datetime, timedelta, timezone
 from typing import Any
 
-from pydantic import BaseModel, field_validator
+from pydantic import BaseModel, Field, field_validator
 
 from backend.api.features.library.model import LibraryAgent
 from backend.copilot.model import ChatSession
@@ -13,6 +13,7 @@ from backend.data.db_accessors import execution_db, library_db
 from backend.data.execution import ExecutionStatus, GraphExecution, GraphExecutionMeta
 
 from .base import BaseTool
+from .execution_utils import TERMINAL_STATUSES, wait_for_execution
 from .models import (
     AgentOutputResponse,
     ErrorResponse,
@@ -33,6 +34,7 @@ class AgentOutputInput(BaseModel):
     store_slug: str = ""
     execution_id: str = ""
     run_time: str = "latest"
+    wait_if_running: int = Field(default=0, ge=0, le=300)
 
     @field_validator(
         "agent_name",
@@ -116,6 +118,11 @@ class AgentOutputTool(BaseTool):
         Select which run to retrieve using:
         - execution_id: Specific execution ID
         - run_time: 'latest' (default), 'yesterday', 'last week', or ISO date 'YYYY-MM-DD'
+
+        Wait for completion (optional):
+        - wait_if_running: Max seconds to wait if execution is still running (0-300).
+          If the execution is running/queued, waits up to this many seconds for completion.
+          Returns current status on timeout. If already finished, returns immediately.
         """
 
     @property
@@ -145,6 +152,13 @@ class AgentOutputTool(BaseTool):
                         "Time filter: 'latest', 'yesterday', 'last week', or 'YYYY-MM-DD'"
                     ),
                 },
+                "wait_if_running": {
+                    "type": "integer",
+                    "description": (
+                        "Max seconds to wait if execution is still running (0-300). "
+                        "If running, waits for completion. Returns current state on timeout."
+                    ),
+                },
             },
             "required": [],
         }
@@ -224,10 +238,14 @@ class AgentOutputTool(BaseTool):
         execution_id: str | None,
         time_start: datetime | None,
         time_end: datetime | None,
+        include_running: bool = False,
     ) -> tuple[GraphExecution | None, list[GraphExecutionMeta], str | None]:
         """
         Fetch execution(s) based on filters.
         Returns (single_execution, available_executions_meta, error_message).
+
+        Args:
+            include_running: If True, also look for running/queued executions (for waiting)
         """
         exec_db = execution_db()
 
@@ -242,11 +260,25 @@ class AgentOutputTool(BaseTool):
                 return None, [], f"Execution '{execution_id}' not found"
             return execution, [], None
 
-        # Get completed executions with time filters
+        # Determine which statuses to query
+        statuses = [ExecutionStatus.COMPLETED]
+        if include_running:
+            statuses.extend(
+                [
+                    ExecutionStatus.RUNNING,
+                    ExecutionStatus.QUEUED,
+                    ExecutionStatus.INCOMPLETE,
+                    ExecutionStatus.REVIEW,
+                    ExecutionStatus.FAILED,
+                    ExecutionStatus.TERMINATED,
+                ]
+            )
+
+        # Get executions with time filters
         executions = await exec_db.get_graph_executions(
             graph_id=graph_id,
             user_id=user_id,
-            statuses=[ExecutionStatus.COMPLETED],
+            statuses=statuses,
             created_time_gte=time_start,
             created_time_lte=time_end,
             limit=10,
@@ -313,10 +345,33 @@ class AgentOutputTool(BaseTool):
                 for e in available_executions[:5]
             ]
 
-        message = f"Found execution outputs for agent '{agent.name}'"
+        # Build appropriate message based on execution status
+        if execution.status == ExecutionStatus.COMPLETED:
+            message = f"Found execution outputs for agent '{agent.name}'"
+        elif execution.status == ExecutionStatus.FAILED:
+            message = f"Execution for agent '{agent.name}' failed"
+        elif execution.status == ExecutionStatus.TERMINATED:
+            message = f"Execution for agent '{agent.name}' was terminated"
+        elif execution.status == ExecutionStatus.REVIEW:
+            message = (
+                f"Execution for agent '{agent.name}' is awaiting human review. "
+                "The user needs to approve it before it can continue."
+            )
+        elif execution.status in (
+            ExecutionStatus.RUNNING,
+            ExecutionStatus.QUEUED,
+            ExecutionStatus.INCOMPLETE,
+        ):
+            message = (
+                f"Execution for agent '{agent.name}' is still {execution.status.value}. "
+                "Results may be incomplete. Use wait_if_running to wait for completion."
+            )
+        else:
+            message = f"Found execution for agent '{agent.name}' (status: {execution.status.value})"
+
         if len(available_executions) > 1:
             message += (
-                f". Showing latest of {len(available_executions)} matching executions."
+                f" Showing latest of {len(available_executions)} matching executions."
             )
 
         return AgentOutputResponse(
@@ -431,13 +486,17 @@ class AgentOutputTool(BaseTool):
         # Parse time expression
         time_start, time_end = parse_time_expression(input_data.run_time)
 
-        # Fetch execution(s)
+        # Check if we should wait for running executions
+        wait_timeout = input_data.wait_if_running
+
+        # Fetch execution(s) - include running if we're going to wait
         execution, available_executions, exec_error = await self._get_execution(
             user_id=user_id,
             graph_id=agent.graph_id,
             execution_id=input_data.execution_id or None,
             time_start=time_start,
             time_end=time_end,
+            include_running=wait_timeout > 0,
         )
 
         if exec_error:
@@ -446,4 +505,17 @@ class AgentOutputTool(BaseTool):
                 session_id=session_id,
             )
 
+        # If we have an execution that's still running and we should wait
+        if execution and wait_timeout > 0 and execution.status not in TERMINAL_STATUSES:
+            logger.info(
+                f"Execution {execution.id} is {execution.status}, "
+                f"waiting up to {wait_timeout}s for completion"
+            )
+            execution = await wait_for_execution(
+                user_id=user_id,
+                graph_id=agent.graph_id,
+                execution_id=execution.id,
+                timeout_seconds=wait_timeout,
+            )
+
         return self._build_response(agent, execution, available_executions, session_id)

autogpt_platform/backend/backend/copilot/tools/agent_search.py

@@ -1,8 +1,13 @@
 """Shared agent search functionality for find_agent and find_library_agent tools."""
 
+from __future__ import annotations
+
 import logging
 import re
-from typing import Literal
+from typing import TYPE_CHECKING, Literal
+
+if TYPE_CHECKING:
+    from backend.api.features.library.model import LibraryAgent
 
 from backend.data.db_accessors import library_db, store_db
 from backend.util.exceptions import DatabaseError, NotFoundError
@@ -24,94 +29,24 @@ _UUID_PATTERN = re.compile(
     re.IGNORECASE,
 )
 
-
-def _is_uuid(text: str) -> bool:
-    """Check if text is a valid UUID v4."""
-    return bool(_UUID_PATTERN.match(text.strip()))
-
-
-async def _get_library_agent_by_id(user_id: str, agent_id: str) -> AgentInfo | None:
-    """Fetch a library agent by ID (library agent ID or graph_id).
-
-    Tries multiple lookup strategies:
-    1. First by graph_id (AgentGraph primary key)
-    2. Then by library agent ID (LibraryAgent primary key)
-
-    Args:
-        user_id: The user ID
-        agent_id: The ID to look up (can be graph_id or library agent ID)
-
-    Returns:
-        AgentInfo if found, None otherwise
-    """
-    lib_db = library_db()
-
-    try:
-        agent = await lib_db.get_library_agent_by_graph_id(user_id, agent_id)
-        if agent:
-            logger.debug(f"Found library agent by graph_id: {agent.name}")
-            return AgentInfo(
-                id=agent.id,
-                name=agent.name,
-                description=agent.description or "",
-                source="library",
-                in_library=True,
-                creator=agent.creator_name,
-                status=agent.status.value,
-                can_access_graph=agent.can_access_graph,
-                has_external_trigger=agent.has_external_trigger,
-                new_output=agent.new_output,
-                graph_id=agent.graph_id,
-            )
-    except DatabaseError:
-        raise
-    except Exception as e:
-        logger.warning(
-            f"Could not fetch library agent by graph_id {agent_id}: {e}",
-            exc_info=True,
-        )
-
-    try:
-        agent = await lib_db.get_library_agent(agent_id, user_id)
-        if agent:
-            logger.debug(f"Found library agent by library_id: {agent.name}")
-            return AgentInfo(
-                id=agent.id,
-                name=agent.name,
-                description=agent.description or "",
-                source="library",
-                in_library=True,
-                creator=agent.creator_name,
-                status=agent.status.value,
-                can_access_graph=agent.can_access_graph,
-                has_external_trigger=agent.has_external_trigger,
-                new_output=agent.new_output,
-                graph_id=agent.graph_id,
-            )
-    except NotFoundError:
-        logger.debug(f"Library agent not found by library_id: {agent_id}")
-    except DatabaseError:
-        raise
-    except Exception as e:
-        logger.warning(
-            f"Could not fetch library agent by library_id {agent_id}: {e}",
-            exc_info=True,
-        )
-
-    return None
+# Keywords that should be treated as "list all" rather than a literal search
+_LIST_ALL_KEYWORDS = frozenset({"all", "*", "everything", "any", ""})
 
 
 async def search_agents(
     query: str,
     source: SearchSource,
-    session_id: str | None,
+    session_id: str | None = None,
     user_id: str | None = None,
 ) -> ToolResponseBase:
     """
     Search for agents in marketplace or user library.
 
+    For library searches, keywords like "all", "*", "everything", or an empty
+    query will list all agents without filtering.
+
     Args:
-        query: Search query string
+        query: Search query string. Special keywords list all library agents.
         source: "marketplace" or "library"
         session_id: Chat session ID
         user_id: User ID (required for library search)
@@ -119,7 +54,11 @@ async def search_agents(
     Returns:
         AgentsFoundResponse, NoResultsResponse, or ErrorResponse
     """
-    if not query:
+    # Normalize list-all keywords to empty string for library searches
+    if source == "library" and query.lower().strip() in _LIST_ALL_KEYWORDS:
+        query = ""
+
+    if source == "marketplace" and not query:
         return ErrorResponse(
             message="Please provide a search query", session_id=session_id
         )
@@ -159,28 +98,18 @@ async def search_agents(
                     logger.info(f"Found agent by direct ID lookup: {agent.name}")
 
             if not agents:
-                logger.info(f"Searching user library for: {query}")
+                search_term = query or None
+                logger.info(
+                    f"{'Listing all agents in' if not query else 'Searching'} "
+                    f"user library{'' if not query else f' for: {query}'}"
+                )
                 results = await library_db().list_library_agents(
                     user_id=user_id,  # type: ignore[arg-type]
-                    search_term=query,
-                    page_size=10,
+                    search_term=search_term,
+                    page_size=50 if not query else 10,
                 )
                 for agent in results.agents:
-                    agents.append(
-                        AgentInfo(
-                            id=agent.id,
-                            name=agent.name,
-                            description=agent.description or "",
-                            source="library",
-                            in_library=True,
-                            creator=agent.creator_name,
-                            status=agent.status.value,
-                            can_access_graph=agent.can_access_graph,
-                            has_external_trigger=agent.has_external_trigger,
-                            new_output=agent.new_output,
-                            graph_id=agent.graph_id,
-                        )
-                    )
+                    agents.append(_library_agent_to_info(agent))
         logger.info(f"Found {len(agents)} agents in {source}")
     except NotFoundError:
         pass
@@ -193,42 +122,62 @@ async def search_agents(
         )
 
     if not agents:
-        suggestions = (
-            [
+        if source == "marketplace":
+            suggestions = [
                 "Try more general terms",
                 "Browse categories in the marketplace",
                 "Check spelling",
             ]
-            if source == "marketplace"
-            else [
+            no_results_msg = (
+                f"No agents found matching '{query}'. Let the user know they can "
+                "try different keywords or browse the marketplace. Also let them "
+                "know you can create a custom agent for them based on their needs."
+            )
+        elif not query:
+            # User asked to list all but library is empty
+            suggestions = [
+                "Browse the marketplace to find and add agents",
+                "Use find_agent to search the marketplace",
+            ]
+            no_results_msg = (
+                "Your library is empty. Let the user know they can browse the "
+                "marketplace to find agents, or you can create a custom agent "
+                "for them based on their needs."
+            )
+        else:
+            suggestions = [
                 "Try different keywords",
                 "Use find_agent to search the marketplace",
                 "Check your library at /library",
             ]
-        )
-        no_results_msg = (
-            f"No agents found matching '{query}'. Let the user know they can try different keywords or browse the marketplace. Also let them know you can create a custom agent for them based on their needs."
-            if source == "marketplace"
-            else f"No agents matching '{query}' found in your library. Let the user know you can create a custom agent for them based on their needs."
-        )
+            no_results_msg = (
+                f"No agents matching '{query}' found in your library. Let the "
+                "user know you can create a custom agent for them based on "
+                "their needs."
+            )
         return NoResultsResponse(
             message=no_results_msg, session_id=session_id, suggestions=suggestions
         )
 
-    title = f"Found {len(agents)} agent{'s' if len(agents) != 1 else ''} "
-    title += (
-        f"for '{query}'"
-        if source == "marketplace"
-        else f"in your library for '{query}'"
-    )
+    if source == "marketplace":
+        title = (
+            f"Found {len(agents)} agent{'s' if len(agents) != 1 else ''} for '{query}'"
+        )
+    elif not query:
+        title = f"Found {len(agents)} agent{'s' if len(agents) != 1 else ''} in your library"
+    else:
+        title = f"Found {len(agents)} agent{'s' if len(agents) != 1 else ''} in your library for '{query}'"
 
     message = (
         "Now you have found some options for the user to choose from. "
         "You can add a link to a recommended agent at: /marketplace/agent/agent_id "
-        "Please ask the user if they would like to use any of these agents. Let the user know we can create a custom agent for them based on their needs."
+        "Please ask the user if they would like to use any of these agents. "
+        "Let the user know we can create a custom agent for them based on their needs."
         if source == "marketplace"
-        else "Found agents in the user's library. You can provide a link to view an agent at: "
-        "/library/agents/{agent_id}. Use agent_output to get execution results, or run_agent to execute. Let the user know we can create a custom agent for them based on their needs."
+        else "Found agents in the user's library. You can provide a link to view "
+        "an agent at: /library/agents/{agent_id}. Use agent_output to get "
+        "execution results, or run_agent to execute. Let the user know we can "
+        "create a custom agent for them based on their needs."
     )
 
     return AgentsFoundResponse(
@@ -238,3 +187,67 @@ async def search_agents(
         count=len(agents),
         session_id=session_id,
     )
+
+
+def _is_uuid(text: str) -> bool:
+    """Check if text is a valid UUID v4."""
+    return bool(_UUID_PATTERN.match(text.strip()))
+
+
+def _library_agent_to_info(agent: LibraryAgent) -> AgentInfo:
+    """Convert a library agent model to an AgentInfo."""
+    return AgentInfo(
+        id=agent.id,
+        name=agent.name,
+        description=agent.description or "",
+        source="library",
+        in_library=True,
+        creator=agent.creator_name,
+        status=agent.status.value,
+        can_access_graph=agent.can_access_graph,
+        has_external_trigger=agent.has_external_trigger,
+        new_output=agent.new_output,
+        graph_id=agent.graph_id,
+    )
+
+
+async def _get_library_agent_by_id(user_id: str, agent_id: str) -> AgentInfo | None:
+    """Fetch a library agent by ID (library agent ID or graph_id).
+
+    Tries multiple lookup strategies:
+    1. First by graph_id (AgentGraph primary key)
+    2. Then by library agent ID (LibraryAgent primary key)
+    """
+    lib_db = library_db()
+
+    try:
+        agent = await lib_db.get_library_agent_by_graph_id(user_id, agent_id)
+        if agent:
+            logger.debug(f"Found library agent by graph_id: {agent.name}")
+            return _library_agent_to_info(agent)
+    except NotFoundError:
+        logger.debug(f"Library agent not found by graph_id: {agent_id}")
+    except DatabaseError:
+        raise
+    except Exception as e:
+        logger.warning(
+            f"Could not fetch library agent by graph_id {agent_id}: {e}",
+            exc_info=True,
+        )
+
+    try:
+        agent = await lib_db.get_library_agent(agent_id, user_id)
+        if agent:
+            logger.debug(f"Found library agent by library_id: {agent.name}")
+            return _library_agent_to_info(agent)
+    except NotFoundError:
+        logger.debug(f"Library agent not found by library_id: {agent_id}")
+    except DatabaseError:
+        raise
+    except Exception as e:
+        logger.warning(
+            f"Could not fetch library agent by library_id {agent_id}: {e}",
+            exc_info=True,
+        )
+
+    return None

autogpt_platform/backend/backend/copilot/tools/execution_utils.py

@@ -0,0 +1,186 @@
+"""Shared utilities for execution waiting and status handling."""
+
+import asyncio
+import logging
+from typing import Any
+
+from backend.data.db_accessors import execution_db
+from backend.data.execution import (
+    AsyncRedisExecutionEventBus,
+    ExecutionStatus,
+    GraphExecution,
+    GraphExecutionEvent,
+)
+
+logger = logging.getLogger(__name__)
+
+# Terminal statuses that indicate execution is complete
+TERMINAL_STATUSES = frozenset(
+    {
+        ExecutionStatus.COMPLETED,
+        ExecutionStatus.FAILED,
+        ExecutionStatus.TERMINATED,
+    }
+)
+
+# Statuses where execution is paused but not finished (e.g. human-in-the-loop)
+PAUSED_STATUSES = frozenset(
+    {
+        ExecutionStatus.REVIEW,
+    }
+)
+
+# Statuses that mean "stop waiting" (terminal or paused)
+STOP_WAITING_STATUSES = TERMINAL_STATUSES | PAUSED_STATUSES
+
+_POST_SUBSCRIBE_RECHECK_DELAY = 0.1  # seconds to wait for subscription to establish
+
+
+async def wait_for_execution(
+    user_id: str,
+    graph_id: str,
+    execution_id: str,
+    timeout_seconds: int,
+) -> GraphExecution | None:
+    """
+    Wait for an execution to reach a terminal or paused status using Redis pubsub.
+
+    Handles the race condition between checking status and subscribing by
+    re-checking the DB after the subscription is established.
+
+    Args:
+        user_id: User ID
+        graph_id: Graph ID
+        execution_id: Execution ID to wait for
+        timeout_seconds: Max seconds to wait
+
+    Returns:
+        The execution with current status, or None if not found
+    """
+    exec_db = execution_db()
+
+    # Quick check — maybe it's already done
+    execution = await exec_db.get_graph_execution(
+        user_id=user_id,
+        execution_id=execution_id,
+        include_node_executions=False,
+    )
+    if not execution:
+        return None
+
+    if execution.status in STOP_WAITING_STATUSES:
+        logger.debug(
+            f"Execution {execution_id} already in stop-waiting state: "
+            f"{execution.status}"
+        )
+        return execution
+
+    logger.info(
+        f"Waiting up to {timeout_seconds}s for execution {execution_id} "
+        f"(current status: {execution.status})"
+    )
+
+    event_bus = AsyncRedisExecutionEventBus()
+    channel_key = f"{user_id}/{graph_id}/{execution_id}"
+
+    # Mutable container so _subscribe_and_wait can surface the task even if
+    # asyncio.wait_for cancels the coroutine before it returns.
+    task_holder: list[asyncio.Task] = []
+
+    try:
+        result = await asyncio.wait_for(
+            _subscribe_and_wait(
+                event_bus, channel_key, user_id, execution_id, exec_db, task_holder
+            ),
+            timeout=timeout_seconds,
+        )
+        return result
+    except asyncio.TimeoutError:
+        logger.info(f"Timeout waiting for execution {execution_id}")
+    except Exception as e:
+        logger.error(f"Error waiting for execution: {e}", exc_info=True)
+    finally:
+        for task in task_holder:
+            if not task.done():
+                task.cancel()
+                try:
+                    await task
+                except asyncio.CancelledError:
+                    pass
+        await event_bus.close()
+
+    # Return current state on timeout/error
+    return await exec_db.get_graph_execution(
+        user_id=user_id,
+        execution_id=execution_id,
+        include_node_executions=False,
+    )
+
+
+async def _subscribe_and_wait(
+    event_bus: AsyncRedisExecutionEventBus,
+    channel_key: str,
+    user_id: str,
+    execution_id: str,
+    exec_db: Any,
+    task_holder: list[asyncio.Task],
+) -> GraphExecution | None:
+    """
+    Subscribe to execution events and wait for a terminal/paused status.
+
+    Appends the consumer task to ``task_holder`` so the caller can clean it up
+    even if this coroutine is cancelled by ``asyncio.wait_for``.
+
+    To avoid the race condition where the execution completes between the
+    initial DB check and the Redis subscription, we:
+    1. Start listening (which subscribes internally)
+    2. Re-check the DB after subscription is active
+    3. If still running, wait for pubsub events
+    """
+    listen_iter = event_bus.listen_events(channel_key).__aiter__()
+
+    done = asyncio.Event()
+    result_execution: GraphExecution | None = None
+
+    async def _consume() -> None:
+        nonlocal result_execution
+        try:
+            async for event in listen_iter:
+                if isinstance(event, GraphExecutionEvent):
+                    logger.debug(f"Received execution update: {event.status}")
+                    if event.status in STOP_WAITING_STATUSES:
+                        result_execution = await exec_db.get_graph_execution(
+                            user_id=user_id,
+                            execution_id=execution_id,
+                            include_node_executions=False,
+                        )
+                        done.set()
+                        return
+        except Exception as e:
+            logger.error(f"Error in execution consumer: {e}", exc_info=True)
+            done.set()
+
+    consume_task = asyncio.create_task(_consume())
+    task_holder.append(consume_task)
+
+    # Give the subscription a moment to establish, then re-check DB
+    await asyncio.sleep(_POST_SUBSCRIBE_RECHECK_DELAY)
+
+    execution = await exec_db.get_graph_execution(
+        user_id=user_id,
+        execution_id=execution_id,
+        include_node_executions=False,
+    )
+    if execution and execution.status in STOP_WAITING_STATUSES:
+        return execution
+
+    # Wait for the pubsub consumer to find a terminal event
+    await done.wait()
+    return result_execution
+
+
+def get_execution_outputs(execution: GraphExecution | None) -> dict[str, Any] | None:
+    """Extract outputs from an execution, or return None."""
+    if execution is None:
+        return None
+    return execution.outputs

autogpt_platform/backend/backend/copilot/tools/find_library_agent.py

@@ -19,9 +19,10 @@ class FindLibraryAgentTool(BaseTool):
     @property
     def description(self) -> str:
         return (
-            "Search for agents in the user's library. Use this to find agents "
-            "the user has already added to their library, including agents they "
-            "created or added from the marketplace."
+            "Search for or list agents in the user's library. Use this to find "
+            "agents the user has already added to their library, including agents "
+            "they created or added from the marketplace. "
+            "Omit the query to list all agents."
         )
 
     @property
@@ -31,10 +32,13 @@ class FindLibraryAgentTool(BaseTool):
             "properties": {
                 "query": {
                     "type": "string",
-                    "description": "Search query to find agents by name or description.",
+                    "description": (
+                        "Search query to find agents by name or description. "
+                        "Omit to list all agents in the library."
+                    ),
                 },
             },
-            "required": ["query"],
+            "required": [],
         }
 
     @property
@@ -45,7 +49,7 @@ class FindLibraryAgentTool(BaseTool):
         self, user_id: str | None, session: ChatSession, **kwargs
     ) -> ToolResponseBase:
         return await search_agents(
-            query=kwargs.get("query", "").strip(),
+            query=(kwargs.get("query") or "").strip(),
             source="library",
             session_id=session.session_id,
             user_id=user_id,

autogpt_platform/backend/backend/copilot/tools/run_agent.py

@@ -9,6 +9,7 @@ from backend.copilot.config import ChatConfig
 from backend.copilot.model import ChatSession
 from backend.copilot.tracking import track_agent_run_success, track_agent_scheduled
 from backend.data.db_accessors import graph_db, library_db, user_db
+from backend.data.execution import ExecutionStatus
 from backend.data.graph import GraphModel
 from backend.data.model import CredentialsMetaInput
 from backend.executor import utils as execution_utils
@@ -20,12 +21,15 @@ from backend.util.timezone_utils import (
 )
 
 from .base import BaseTool
+from .execution_utils import get_execution_outputs, wait_for_execution
 from .helpers import get_inputs_from_schema
 from .models import (
     AgentDetails,
     AgentDetailsResponse,
+    AgentOutputResponse,
     ErrorResponse,
     ExecutionOptions,
+    ExecutionOutputInfo,
     ExecutionStartedResponse,
     InputValidationErrorResponse,
     SetupInfo,
@@ -66,6 +70,7 @@ class RunAgentInput(BaseModel):
     schedule_name: str = ""
     cron: str = ""
     timezone: str = "UTC"
+    wait_for_result: int = Field(default=0, ge=0, le=300)
 
     @field_validator(
         "username_agent_slug",
@@ -147,6 +152,14 @@ class RunAgentTool(BaseTool):
                     "type": "string",
                     "description": "IANA timezone for schedule (default: UTC)",
                 },
+                "wait_for_result": {
+                    "type": "integer",
+                    "description": (
+                        "Max seconds to wait for execution to complete (0-300). "
+                        "If >0, blocks until the execution finishes or times out. "
+                        "Returns execution outputs when complete."
+                    ),
+                },
             },
             "required": [],
         }
@@ -341,6 +354,7 @@ class RunAgentTool(BaseTool):
                     graph=graph,
                     graph_credentials=graph_credentials,
                     inputs=params.inputs,
+                    wait_for_result=params.wait_for_result,
                 )
 
         except NotFoundError as e:
@@ -424,8 +438,9 @@ class RunAgentTool(BaseTool):
         graph: GraphModel,
         graph_credentials: dict[str, CredentialsMetaInput],
         inputs: dict[str, Any],
+        wait_for_result: int = 0,
     ) -> ToolResponseBase:
-        """Execute an agent immediately."""
+        """Execute an agent immediately, optionally waiting for completion."""
         session_id = session.session_id
 
         # Check rate limits
@@ -462,6 +477,91 @@ class RunAgentTool(BaseTool):
         )
 
         library_agent_link = f"/library/agents/{library_agent.id}"
+
+        # If wait_for_result is requested, wait for execution to complete
+        if wait_for_result > 0:
+            logger.info(
+                f"Waiting up to {wait_for_result}s for execution {execution.id}"
+            )
+            completed = await wait_for_execution(
+                user_id=user_id,
+                graph_id=library_agent.graph_id,
+                execution_id=execution.id,
+                timeout_seconds=wait_for_result,
+            )
+
+            if completed and completed.status == ExecutionStatus.COMPLETED:
+                outputs = get_execution_outputs(completed)
+                return AgentOutputResponse(
+                    message=(
+                        f"Agent '{library_agent.name}' completed successfully. "
+                        f"View at {library_agent_link}."
+                    ),
+                    session_id=session_id,
+                    agent_name=library_agent.name,
+                    agent_id=library_agent.graph_id,
+                    library_agent_id=library_agent.id,
+                    library_agent_link=library_agent_link,
+                    execution=ExecutionOutputInfo(
+                        execution_id=execution.id,
+                        status=completed.status.value,
+                        started_at=completed.started_at,
+                        ended_at=completed.ended_at,
+                        outputs=outputs or {},
+                    ),
+                )
+            elif completed and completed.status == ExecutionStatus.FAILED:
+                error_detail = completed.stats.error if completed.stats else None
+                return ErrorResponse(
+                    message=(
+                        f"Agent '{library_agent.name}' execution failed. "
+                        f"View details at {library_agent_link}."
+                    ),
+                    session_id=session_id,
+                    error=error_detail,
+                )
+            elif completed and completed.status == ExecutionStatus.TERMINATED:
+                error_detail = completed.stats.error if completed.stats else None
+                return ErrorResponse(
+                    message=(
+                        f"Agent '{library_agent.name}' execution was terminated. "
+                        f"View details at {library_agent_link}."
+                    ),
+                    session_id=session_id,
+                    error=error_detail,
+                )
+            elif completed and completed.status == ExecutionStatus.REVIEW:
+                return ExecutionStartedResponse(
+                    message=(
+                        f"Agent '{library_agent.name}' is awaiting human review. "
+                        f"Check at {library_agent_link}."
+                    ),
+                    session_id=session_id,
+                    execution_id=execution.id,
+                    graph_id=library_agent.graph_id,
+                    graph_name=library_agent.name,
+                    library_agent_id=library_agent.id,
+                    library_agent_link=library_agent_link,
+                    status=ExecutionStatus.REVIEW.value,
+                )
+            else:
+                status = completed.status.value if completed else "unknown"
+                return ExecutionStartedResponse(
+                    message=(
+                        f"Agent '{library_agent.name}' is still {status} after "
+                        f"{wait_for_result}s. Check results later at "
+                        f"{library_agent_link}. "
+                        f"Use view_agent_output with wait_if_running to check again."
+                    ),
+                    session_id=session_id,
+                    execution_id=execution.id,
+                    graph_id=library_agent.graph_id,
+                    graph_name=library_agent.name,
+                    library_agent_id=library_agent.id,
+                    library_agent_link=library_agent_link,
+                    status=status,
+                )
+
         return ExecutionStartedResponse(
             message=(
                 f"Agent '{library_agent.name}' execution started successfully. "

autogpt_platform/backend/backend/copilot/tools/workspace_files.py

@@ -214,7 +214,11 @@ class WorkspaceWriteResponse(ToolResponseBase):
     file_id: str
     name: str
     path: str
+    mime_type: str
     size_bytes: int
+    # workspace:// URL the agent can embed directly in chat to give the user a link.
+    # Format: workspace://<file_id>#<mime_type>  (frontend resolves to download URL)
+    download_url: str
     source: str | None = None  # "content", "base64", or "copied from <path>"
     content_preview: str | None = None  # First 200 chars for text files
 
@@ -680,11 +684,21 @@ class WriteWorkspaceFileTool(BaseTool):
                 except Exception:
                     pass
 
+            # Strip MIME parameters (e.g. "text/html; charset=utf-8" → "text/html")
+            # and normalise to lowercase so the fragment is URL-safe.
+            normalized_mime = (rec.mime_type or "").split(";", 1)[0].strip().lower()
+            download_url = (
+                f"workspace://{rec.id}#{normalized_mime}"
+                if normalized_mime
+                else f"workspace://{rec.id}"
+            )
             return WorkspaceWriteResponse(
                 file_id=rec.id,
                 name=rec.name,
                 path=rec.path,
+                mime_type=normalized_mime,
                 size_bytes=rec.size_bytes,
+                download_url=download_url,
                 source=source,
                 content_preview=preview,
                 message=msg,

autogpt_platform/backend/backend/data/includes.py

@@ -79,6 +79,12 @@ INTEGRATION_WEBHOOK_INCLUDE: prisma.types.IntegrationWebhookInclude = {
 }
 
 
+LIBRARY_FOLDER_INCLUDE: prisma.types.LibraryFolderInclude = {
+    "LibraryAgents": {"where": {"isDeleted": False}},
+    "Children": {"where": {"isDeleted": False}},
+}
+
+
 def library_agent_include(
     user_id: str,
     include_nodes: bool = True,
@@ -105,6 +111,7 @@ def library_agent_include(
     """
     result: prisma.types.LibraryAgentInclude = {
         "Creator": True,  # Always needed for creator info
+        "Folder": True,  # Always needed for folder info
     }
 
     # Build AgentGraph include based on requested options

autogpt_platform/backend/backend/data/integrations.py

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

autogpt_platform/backend/backend/integrations/providers.py

@@ -47,6 +47,7 @@ class ProviderName(str, Enum):
     SLANT3D = "slant3d"
     SMARTLEAD = "smartlead"
     SMTP = "smtp"
+    TELEGRAM = "telegram"
     TWITTER = "twitter"
     TODOIST = "todoist"
     UNREAL_SPEECH = "unreal_speech"

autogpt_platform/backend/backend/integrations/webhooks/__init__.py

@@ -15,6 +15,7 @@ def load_webhook_managers() -> dict["ProviderName", type["BaseWebhooksManager"]]
     from .compass import CompassWebhookManager
     from .github import GithubWebhooksManager
     from .slant3d import Slant3DWebhooksManager
+    from .telegram import TelegramWebhooksManager
 
     webhook_managers.update(
         {
@@ -23,6 +24,7 @@ def load_webhook_managers() -> dict["ProviderName", type["BaseWebhooksManager"]]
                 CompassWebhookManager,
                 GithubWebhooksManager,
                 Slant3DWebhooksManager,
+                TelegramWebhooksManager,
             ]
         }
     )

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

@@ -0,0 +1,242 @@
+"""
+Telegram Bot API Webhooks Manager.
+
+Handles webhook registration and validation for Telegram bots.
+"""
+
+import hmac
+import logging
+
+from fastapi import HTTPException, Request
+from strenum import StrEnum
+
+from backend.data import integrations
+from backend.data.model import APIKeyCredentials, Credentials
+from backend.integrations.providers import ProviderName
+from backend.util.exceptions import MissingConfigError
+from backend.util.request import Requests
+from backend.util.settings import Config
+
+from ._base import BaseWebhooksManager
+from .utils import webhook_ingress_url
+
+logger = logging.getLogger(__name__)
+
+
+class TelegramWebhookType(StrEnum):
+    BOT = "bot"
+
+
+class TelegramWebhooksManager(BaseWebhooksManager):
+    """
+    Manages Telegram bot webhooks.
+
+    Telegram webhooks are registered via the setWebhook API method.
+    Incoming requests are validated using the secret_token header.
+    """
+
+    PROVIDER_NAME = ProviderName.TELEGRAM
+    WebhookType = TelegramWebhookType
+
+    TELEGRAM_API_BASE = "https://api.telegram.org"
+
+    async def get_suitable_auto_webhook(
+        self,
+        user_id: str,
+        credentials: Credentials,
+        webhook_type: TelegramWebhookType,
+        resource: str,
+        events: list[str],
+    ) -> integrations.Webhook:
+        """
+        Telegram only supports one webhook per bot. Instead of creating a new
+        webhook object when events change (which causes the old one to be pruned
+        and deregistered — removing the ONLY webhook for the bot), we find the
+        existing webhook and update its events in place.
+        """
+        app_config = Config()
+        if not app_config.platform_base_url:
+            raise MissingConfigError(
+                "PLATFORM_BASE_URL must be set to use Webhook functionality"
+            )
+
+        # Exact match — no re-registration needed
+        if webhook := await integrations.find_webhook_by_credentials_and_props(
+            user_id=user_id,
+            credentials_id=credentials.id,
+            webhook_type=webhook_type,
+            resource=resource,
+            events=events,
+        ):
+            return webhook
+
+        # Find any existing webhook for the same bot, regardless of events
+        if existing := await integrations.find_webhook_by_credentials_and_props(
+            user_id=user_id,
+            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)
+            _, config = await self._register_webhook(
+                credentials,
+                webhook_type,
+                resource,
+                events,
+                ingress_url,
+                existing.secret,
+            )
+            return await integrations.update_webhook(
+                existing.id, events=events, config=config
+            )
+
+        # No existing webhook at all — create a new one
+        return await self._create_webhook(
+            user_id=user_id,
+            webhook_type=webhook_type,
+            events=events,
+            resource=resource,
+            credentials=credentials,
+        )
+
+    @classmethod
+    async def validate_payload(
+        cls,
+        webhook: integrations.Webhook,
+        request: Request,
+        credentials: Credentials | None,
+    ) -> tuple[dict, str]:
+        """
+        Validates incoming Telegram webhook request.
+
+        Telegram sends X-Telegram-Bot-Api-Secret-Token header when secret_token
+        was set in setWebhook call.
+
+        Returns:
+            tuple: (payload dict, event_type string)
+        """
+        # Verify secret token header
+        secret_header = request.headers.get("X-Telegram-Bot-Api-Secret-Token")
+        if not secret_header or not hmac.compare_digest(secret_header, webhook.secret):
+            raise HTTPException(
+                status_code=403,
+                detail="Invalid or missing X-Telegram-Bot-Api-Secret-Token",
+            )
+
+        payload = await request.json()
+
+        # Determine event type based on update content
+        if "message" in payload:
+            message = payload["message"]
+            if "text" in message:
+                event_type = "message.text"
+            elif "photo" in message:
+                event_type = "message.photo"
+            elif "voice" in message:
+                event_type = "message.voice"
+            elif "audio" in message:
+                event_type = "message.audio"
+            elif "document" in message:
+                event_type = "message.document"
+            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"
+        elif "message_reaction" in payload:
+            event_type = "message_reaction"
+        else:
+            event_type = "unknown"
+
+        return payload, event_type
+
+    async def _register_webhook(
+        self,
+        credentials: Credentials,
+        webhook_type: TelegramWebhookType,
+        resource: str,
+        events: list[str],
+        ingress_url: str,
+        secret: str,
+    ) -> tuple[str, dict]:
+        """
+        Register webhook with Telegram using setWebhook API.
+
+        Args:
+            credentials: Bot token credentials
+            webhook_type: Type of webhook (always BOT for Telegram)
+            resource: Resource identifier (unused for Telegram, bots are global)
+            events: Events to subscribe to
+            ingress_url: URL to receive webhook payloads
+            secret: Secret token for request validation
+
+        Returns:
+            tuple: (provider_webhook_id, config dict)
+        """
+        if not isinstance(credentials, APIKeyCredentials):
+            raise ValueError("API key (bot token) is required for Telegram webhooks")
+
+        token = credentials.api_key.get_secret_value()
+        url = f"{self.TELEGRAM_API_BASE}/bot{token}/setWebhook"
+
+        # Map event filter to Telegram allowed_updates
+        if events:
+            telegram_updates: set[str] = set()
+            for event in events:
+                telegram_updates.add(event.split(".")[0])
+                # "message.edited_message" requires the "edited_message" update type
+                if "edited_message" in event:
+                    telegram_updates.add("edited_message")
+            sorted_updates = sorted(telegram_updates)
+        else:
+            sorted_updates = ["message", "message_reaction"]
+
+        webhook_data = {
+            "url": ingress_url,
+            "secret_token": secret,
+            "allowed_updates": sorted_updates,
+        }
+
+        response = await Requests().post(url, json=webhook_data)
+        result = response.json()
+
+        if not result.get("ok"):
+            error_desc = result.get("description", "Unknown error")
+            raise ValueError(f"Failed to set Telegram webhook: {error_desc}")
+
+        # Telegram doesn't return a webhook ID, use empty string
+        config = {
+            "url": ingress_url,
+            "allowed_updates": webhook_data["allowed_updates"],
+        }
+
+        return "", config
+
+    async def _deregister_webhook(
+        self, webhook: integrations.Webhook, credentials: Credentials
+    ) -> None:
+        """
+        Deregister webhook by calling setWebhook with empty URL.
+
+        This removes the webhook from Telegram's servers.
+        """
+        if not isinstance(credentials, APIKeyCredentials):
+            raise ValueError("API key (bot token) is required for Telegram webhooks")
+
+        token = credentials.api_key.get_secret_value()
+        url = f"{self.TELEGRAM_API_BASE}/bot{token}/setWebhook"
+
+        # Setting empty URL removes the webhook
+        response = await Requests().post(url, json={"url": ""})
+        result = response.json()
+
+        if not result.get("ok"):
+            error_desc = result.get("description", "Unknown error")
+            logger.warning(f"Failed to deregister Telegram webhook: {error_desc}")

autogpt_platform/backend/migrations/20260123110033_add_folders_in_library/migration.sql

@@ -0,0 +1,33 @@
+-- AlterTable
+ALTER TABLE "LibraryAgent" ADD COLUMN     "folderId" TEXT;
+
+-- CreateTable
+CREATE TABLE "LibraryFolder" (
+    "id" TEXT NOT NULL,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "userId" TEXT NOT NULL,
+    "name" TEXT NOT NULL,
+    "icon" TEXT,
+    "color" TEXT,
+    "parentId" TEXT,
+    "isDeleted" BOOLEAN NOT NULL DEFAULT false,
+
+    CONSTRAINT "LibraryFolder_pkey" PRIMARY KEY ("id")
+);
+
+
+-- CreateIndex
+CREATE UNIQUE INDEX "LibraryFolder_userId_parentId_name_key" ON "LibraryFolder"("userId", "parentId", "name");
+
+-- CreateIndex
+CREATE INDEX "LibraryAgent_folderId_idx" ON "LibraryAgent"("folderId");
+
+-- AddForeignKey
+ALTER TABLE "LibraryAgent" ADD CONSTRAINT "LibraryAgent_folderId_fkey" FOREIGN KEY ("folderId") REFERENCES "LibraryFolder"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "LibraryFolder" ADD CONSTRAINT "LibraryFolder_userId_fkey" FOREIGN KEY ("userId") REFERENCES "User"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "LibraryFolder" ADD CONSTRAINT "LibraryFolder_parentId_fkey" FOREIGN KEY ("parentId") REFERENCES "LibraryFolder"("id") ON DELETE CASCADE ON UPDATE CASCADE;

autogpt_platform/backend/migrations/20260129090000_add_suggested_blocks_materialized_view/migration.sql

@@ -0,0 +1,97 @@
+-- This migration creates a materialized view for suggested blocks based on execution counts
+-- The view aggregates execution counts per block for the last 14 days
+--
+-- IMPORTANT: For production environments, pg_cron is REQUIRED for automatic refresh
+-- Prerequisites for production:
+--   1. pg_cron extension must be installed: CREATE EXTENSION pg_cron;
+--   2. pg_cron must be configured in postgresql.conf:
+--      shared_preload_libraries = 'pg_cron'
+--      cron.database_name = 'your_database_name'
+--
+-- For development environments without pg_cron:
+--   The migration will succeed but you must manually refresh views with:
+--   SET search_path TO platform;
+--   SELECT refresh_suggested_blocks_view();
+
+-- Check if pg_cron extension is installed
+DO $$
+DECLARE
+    has_pg_cron BOOLEAN;
+BEGIN
+    SELECT EXISTS (SELECT 1 FROM pg_extension WHERE extname = 'pg_cron') INTO has_pg_cron;
+
+    IF NOT has_pg_cron THEN
+        RAISE WARNING 'pg_cron is not installed. Materialized view will be created but will NOT refresh automatically. For production, install pg_cron. For development, manually refresh with: SELECT refresh_suggested_blocks_view();';
+    END IF;
+END
+$$;
+
+-- Create materialized view for suggested blocks based on execution counts in last 14 days
+-- The 14-day threshold is hardcoded to ensure consistent behavior
+CREATE MATERIALIZED VIEW IF NOT EXISTS "mv_suggested_blocks" AS
+SELECT
+    agent_node."agentBlockId" AS block_id,
+    COUNT(execution.id) AS execution_count
+FROM "AgentNodeExecution" execution
+JOIN "AgentNode" agent_node ON execution."agentNodeId" = agent_node.id
+WHERE execution."endedTime" >= (NOW() - INTERVAL '14 days')
+GROUP BY agent_node."agentBlockId"
+ORDER BY execution_count DESC;
+
+-- Create unique index for concurrent refresh support
+CREATE UNIQUE INDEX IF NOT EXISTS "idx_mv_suggested_blocks_block_id" ON "mv_suggested_blocks"("block_id");
+
+-- Create refresh function
+CREATE OR REPLACE FUNCTION refresh_suggested_blocks_view()
+RETURNS void
+LANGUAGE plpgsql
+AS $$
+DECLARE
+    target_schema text := current_schema();
+BEGIN
+    -- Use CONCURRENTLY for better performance during refresh
+    REFRESH MATERIALIZED VIEW CONCURRENTLY "mv_suggested_blocks";
+    RAISE NOTICE 'Suggested blocks materialized view refreshed in schema % at %', target_schema, NOW();
+EXCEPTION
+    WHEN OTHERS THEN
+        -- Fallback to non-concurrent refresh if concurrent fails
+        REFRESH MATERIALIZED VIEW "mv_suggested_blocks";
+        RAISE NOTICE 'Suggested blocks materialized view refreshed (non-concurrent) in schema % at %. Concurrent refresh failed due to: %', target_schema, NOW(), SQLERRM;
+END;
+$$;
+
+-- Initial refresh of the materialized view
+SELECT refresh_suggested_blocks_view();
+
+-- Schedule automatic refresh every hour (only if pg_cron is available)
+DO $$
+DECLARE
+    has_pg_cron BOOLEAN;
+    current_schema_name text := current_schema();
+    job_name text;
+BEGIN
+    -- Check if pg_cron extension exists
+    SELECT EXISTS (SELECT 1 FROM pg_extension WHERE extname = 'pg_cron') INTO has_pg_cron;
+
+    IF has_pg_cron THEN
+        job_name := format('refresh-suggested-blocks_%s', current_schema_name);
+
+        -- Try to unschedule existing job (ignore errors if it doesn't exist)
+        BEGIN
+            PERFORM cron.unschedule(job_name);
+        EXCEPTION WHEN OTHERS THEN
+            NULL;
+        END;
+
+        -- Schedule the new job to run every hour
+        PERFORM cron.schedule(
+            job_name,
+            '0 * * * *',  -- Every hour at minute 0
+            format('SET search_path TO %I; SELECT refresh_suggested_blocks_view();', current_schema_name)
+        );
+        RAISE NOTICE 'Scheduled job %; runs every hour for schema %', job_name, current_schema_name;
+    ELSE
+        RAISE WARNING 'Automatic refresh NOT configured - pg_cron is not available. Manually refresh with: SELECT refresh_suggested_blocks_view();';
+    END IF;
+END;
+$$;

autogpt_platform/backend/migrations/20260225163452_add_library_api_key_permission/migration.sql

@@ -0,0 +1,7 @@
+-- This migration adds more than one value to an enum.
+-- With PostgreSQL versions 11 and earlier, this is not possible
+-- in a single migration. This can be worked around by creating
+-- multiple migrations, each migration adding only one value to
+-- the enum.
+ALTER TYPE "APIKeyPermission" ADD VALUE 'WRITE_GRAPH';
+ALTER TYPE "APIKeyPermission" ADD VALUE 'WRITE_LIBRARY';

autogpt_platform/backend/schema.prisma

@@ -51,6 +51,7 @@ model User {
   ChatSessions         ChatSession[]
   AgentPresets         AgentPreset[]
   LibraryAgents        LibraryAgent[]
+  LibraryFolders       LibraryFolder[]
 
   Profile               Profile[]
   UserOnboarding        UserOnboarding?
@@ -395,6 +396,9 @@ model LibraryAgent {
   creatorId String?
   Creator   Profile? @relation(fields: [creatorId], references: [id])
 
+  folderId String?
+  Folder   LibraryFolder? @relation(fields: [folderId], references: [id], onDelete: Restrict)
+
   useGraphIsActiveVersion Boolean @default(false)
 
   isFavorite      Boolean @default(false)
@@ -407,6 +411,30 @@ model LibraryAgent {
   @@unique([userId, agentGraphId, agentGraphVersion])
   @@index([agentGraphId, agentGraphVersion])
   @@index([creatorId])
+  @@index([folderId])
+}
+
+model LibraryFolder {
+  id        String   @id @default(uuid())
+  createdAt DateTime @default(now())
+  updatedAt DateTime @default(now()) @updatedAt
+
+  userId String
+  User   User   @relation(fields: [userId], references: [id], onDelete: Cascade)
+
+  name  String
+  icon  String?
+  color String?
+
+  parentId String?
+  Parent   LibraryFolder?  @relation("FolderHierarchy", fields: [parentId], references: [id], onDelete: Cascade)
+  Children LibraryFolder[] @relation("FolderHierarchy")
+
+  isDeleted Boolean @default(false)
+
+  LibraryAgents LibraryAgent[]
+
+  @@unique([userId, parentId, name]) // Name unique per parent per user
 }
 
 ////////////////////////////////////////////////////////////
@@ -920,6 +948,17 @@ view mv_review_stats {
   // Refresh uses CONCURRENTLY to avoid blocking reads
 }
 
+// Note: This is actually a MATERIALIZED VIEW in the database
+// Refreshed automatically every hour via pg_cron (with fallback to manual refresh)
+view mv_suggested_blocks {
+  block_id        String @unique
+  execution_count Int
+
+  // Pre-aggregated execution counts per block for the last 14 days
+  // Used by builder suggestions for ordering blocks by popularity
+  // Refresh uses CONCURRENTLY to avoid blocking reads
+}
+
 model StoreListing {
   id        String   @id @default(uuid())
   createdAt DateTime @default(now())
@@ -1092,21 +1131,21 @@ enum APIKeyPermission {
   IDENTITY // Info about the authenticated user
   EXECUTE_GRAPH // Can execute agent graphs (v1 only)
   READ_GRAPH // Can get graph versions and details
+  WRITE_GRAPH // Can create and update agent graphs
   EXECUTE_BLOCK // Can execute individual blocks (v1 only)
   READ_BLOCK // Can get block information
   READ_STORE // Can read store/marketplace agents and creators
+  WRITE_LIBRARY // Can add agents to library
   USE_TOOLS // Can use chat tools via external API (v1 only)
   MANAGE_INTEGRATIONS // Can initiate OAuth flows and complete them (v1 only)
   READ_INTEGRATIONS // Can list credentials and providers
   DELETE_INTEGRATIONS // Can delete credentials (v1 only)
 
   // V2 permissions
-  WRITE_GRAPH // Can create, update, delete graphs
   READ_SCHEDULE // Can list schedules
   WRITE_SCHEDULE // Can create and delete schedules
   WRITE_STORE // Can create, update, delete marketplace submissions
   READ_LIBRARY // Can list library agents and runs
-  WRITE_LIBRARY // Can create, update, delete library agents
   RUN_AGENT // Can run agents from library
   READ_RUN // Can list and get run details
   WRITE_RUN // Can stop and delete runs

autogpt_platform/backend/snapshots/lib_agts_search

@@ -38,6 +38,8 @@
       "can_access_graph": true,
       "is_latest_version": true,
       "is_favorite": false,
+      "folder_id": null,
+      "folder_name": null,
       "recommended_schedule_cron": null,
       "settings": {
         "human_in_the_loop_safe_mode": true,
@@ -83,6 +85,8 @@
       "can_access_graph": false,
       "is_latest_version": true,
       "is_favorite": false,
+      "folder_id": null,
+      "folder_name": null,
       "recommended_schedule_cron": null,
       "settings": {
         "human_in_the_loop_safe_mode": true,

autogpt_platform/frontend/.storybook/main.ts

@@ -6,6 +6,7 @@ const config: StorybookConfig = {
     "../src/components/tokens/**/*.stories.@(js|jsx|mjs|ts|tsx)",
     "../src/components/atoms/**/*.stories.@(js|jsx|mjs|ts|tsx)",
     "../src/components/molecules/**/*.stories.@(js|jsx|mjs|ts|tsx)",
+    "../src/components/ai-elements/**/*.stories.@(js|jsx|mjs|ts|tsx)",
   ],
   addons: [
     "@storybook/addon-a11y",

autogpt_platform/frontend/package.json

@@ -32,6 +32,7 @@
   "dependencies": {
     "@ai-sdk/react": "3.0.61",
     "@faker-js/faker": "10.0.0",
+    "@ferrucc-io/emoji-picker": "0.0.48",
     "@hookform/resolvers": "5.2.2",
     "@next/third-parties": "15.4.6",
     "@phosphor-icons/react": "2.1.10",

autogpt_platform/frontend/pnpm-lock.yaml

@@ -18,6 +18,9 @@ importers:
       '@faker-js/faker':
         specifier: 10.0.0
         version: 10.0.0
+      '@ferrucc-io/emoji-picker':
+        specifier: 0.0.48
+        version: 0.0.48(@babel/core@7.28.5)(@babel/template@7.27.2)(@types/react@18.3.17)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(tailwindcss@3.4.17)
       '@hookform/resolvers':
         specifier: 5.2.2
         version: 5.2.2(react-hook-form@7.66.0(react@18.3.1))
@@ -1507,6 +1510,14 @@ packages:
     resolution: {integrity: sha512-UollFEUkVXutsaP+Vndjxar40Gs5JL2HeLcl8xO1QAjJgOdhc3OmBFWyEylS+RddWaaBiAzH+5/17PLQJwDiLw==}
     engines: {node: ^20.19.0 || ^22.13.0 || ^23.5.0 || >=24.0.0, npm: '>=10'}
 
+  '@ferrucc-io/emoji-picker@0.0.48':
+    resolution: {integrity: sha512-DJ5u+6VLF9OK7x+S/luwrVb5CHC6W16jL5b8vBUYNpxKWSuFgyliDHVtw1SGe6+dr5RUbf8WQwPJdKZmU3Ittg==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      react: ^18.2.0 || ^19.0.0
+      react-dom: ^18.2.0 || ^19.0.0
+      tailwindcss: '>=3.0.0'
+
   '@floating-ui/core@1.7.3':
     resolution: {integrity: sha512-sGnvb5dmrJaKEZ+LDIpguvdX3bDlEllmv4/ClQ9awcmCZrlx5jQyyMWFM5kBI+EyNOCDDiKk8il0zeuX3Zlg/w==}
 
@@ -3114,6 +3125,10 @@ packages:
   '@shikijs/vscode-textmate@10.0.2':
     resolution: {integrity: sha512-83yeghZ2xxin3Nj8z1NMd/NCuca+gsYXswywDy5bHvwlWL8tpTQmzGeUuHd9FC3E/SBEMvzJRwWEOz5gGes9Qg==}
 
+  '@sindresorhus/is@4.6.0':
+    resolution: {integrity: sha512-t09vSN3MdfsyCHoFcTRCH/iUtG7OJ0CsjzB8cjAmKc/va/kIgeDI/TxsigdncE/4be734m0cvIYwNaV4i2XqAw==}
+    engines: {node: '>=10'}
+
   '@standard-schema/spec@1.0.0':
     resolution: {integrity: sha512-m2bOd0f2RT9k8QJx1JN85cZYyH1RqFBdlwtkSlf4tBDYLCiiZnv1fIIwacK6cqwXavOydf0NPToMQgpKq+dVlA==}
 
@@ -3376,10 +3391,19 @@ packages:
       react: '>=16.8'
       react-dom: '>=16.8'
 
+  '@tanstack/react-virtual@3.13.18':
+    resolution: {integrity: sha512-dZkhyfahpvlaV0rIKnvQiVoWPyURppl6w4m9IwMDpuIjcJ1sD9YGWrt0wISvgU7ewACXx2Ct46WPgI6qAD4v6A==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+
   '@tanstack/table-core@8.21.3':
     resolution: {integrity: sha512-ldZXEhOBb8Is7xLs01fR3YEc3DERiz5silj8tnGkFZytt1abEvl/GhUmCE0PMLaMPTa3Jk4HbKmRlHmu+gCftg==}
     engines: {node: '>=12'}
 
+  '@tanstack/virtual-core@3.13.18':
+    resolution: {integrity: sha512-Mx86Hqu1k39icq2Zusq+Ey2J6dDWTjDvEv43PJtRCoEYTLyfaPnxIQ6iy7YAOK0NV/qOEmZQ/uCufrppZxTgcg==}
+
   '@testing-library/dom@10.4.1':
     resolution: {integrity: sha512-o4PXJQidqJl82ckFaXUeoAW+XysPLauYI43Abki5hABd853iMhitooc6znOnczgbTYmEP6U6/y1ZyKAIsvMKGg==}
     engines: {node: '>=18'}
@@ -4373,6 +4397,10 @@ packages:
     resolution: {integrity: sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==}
     engines: {node: '>=10'}
 
+  char-regex@1.0.2:
+    resolution: {integrity: sha512-kWWXztvZ5SBQV+eRgKFeh8q5sLuZY2+8WUIzlxWVTg+oGwY14qylx1KbKzHd8P6ZYkAg0xyIDU9JMHhyJMZ1jw==}
+    engines: {node: '>=10'}
+
   character-entities-html4@2.1.0:
     resolution: {integrity: sha512-1v7fgQRj6hnSwFpq1Eu0ynr/CDEw0rXo2B61qXrLNdHZmPKgb7fqS1a2JwF0rISo9q77jDI8VMEHoApn8qDoZA==}
 
@@ -4990,6 +5018,9 @@ packages:
   emoji-regex@9.2.2:
     resolution: {integrity: sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==}
 
+  emojilib@2.4.0:
+    resolution: {integrity: sha512-5U0rVMU5Y2n2+ykNLQqMoqklN9ICBT/KsvC1Gz6vqHbz2AXXGkG+Pm5rMWk/8Vjrr/mY9985Hi8DYzn1F09Nyw==}
+
   emojis-list@3.0.0:
     resolution: {integrity: sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==}
     engines: {node: '>= 4'}
@@ -5970,6 +6001,24 @@ packages:
     resolution: {integrity: sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ==}
     hasBin: true
 
+  jotai@2.17.1:
+    resolution: {integrity: sha512-TFNZZDa/0ewCLQyRC/Sq9crtixNj/Xdf/wmj9631xxMuKToVJZDbqcHIYN0OboH+7kh6P6tpIK7uKWClj86PKw==}
+    engines: {node: '>=12.20.0'}
+    peerDependencies:
+      '@babel/core': '>=7.0.0'
+      '@babel/template': '>=7.0.0'
+      '@types/react': '>=17.0.0'
+      react: '>=17.0.0'
+    peerDependenciesMeta:
+      '@babel/core':
+        optional: true
+      '@babel/template':
+        optional: true
+      '@types/react':
+        optional: true
+      react:
+        optional: true
+
   js-tokens@4.0.0:
     resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==}
 
@@ -6588,6 +6637,10 @@ packages:
   node-abort-controller@3.1.1:
     resolution: {integrity: sha512-AGK2yQKIjRuqnc6VkX2Xj5d+QW8xZ87pa1UK6yA6ouUyuxfHuMP6umE5QK7UmTeOAymo+Zx1Fxiuw9rVx8taHQ==}
 
+  node-emoji@2.2.0:
+    resolution: {integrity: sha512-Z3lTE9pLaJF47NyMhd4ww1yFTAP8YhYI8SleJiHzM46Fgpm5cnNzSl9XfzFNqbaz+VlJrIj3fXQ4DeN1Rjm6cw==}
+    engines: {node: '>=18'}
+
   node-fetch-h2@2.3.0:
     resolution: {integrity: sha512-ofRW94Ab0T4AOh5Fk8t0h8OBWrmjb0SSB20xh1H8YnPV9EJ+f5AMoYSUQ2zgJ4Iq2HAK0I2l5/Nequ8YzFS3Hg==}
     engines: {node: 4.x || >=6.0.0}
@@ -7686,6 +7739,10 @@ packages:
     resolution: {integrity: sha512-LH7FpTAkeD+y5xQC4fzS+tFtaNlvt3Ib1zKzvhjv/Y+cioV4zIuw4IZr2yhRLu67CWL7FR9/6KXKnjRoZTvGGQ==}
     engines: {node: '>=12'}
 
+  skin-tone@2.0.0:
+    resolution: {integrity: sha512-kUMbT1oBJCpgrnKoSr0o6wPtvRWT9W9UKvGLwfJYO2WuahZRHOpEyL1ckyMGgMWh0UdpmaoFqKKD29WTomNEGA==}
+    engines: {node: '>=8'}
+
   slash@3.0.0:
     resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==}
     engines: {node: '>=8'}
@@ -8163,6 +8220,13 @@ packages:
     resolution: {integrity: sha512-dA8WbNeb2a6oQzAQ55YlT5vQAWGV9WXOsi3SskE3bcCdM0P4SDd+24zS/OCacdRq5BkdsRj9q3Pg6YyQoxIGqg==}
     engines: {node: '>=4'}
 
+  unicode-emoji-json@0.8.0:
+    resolution: {integrity: sha512-3wDXXvp6YGoKGhS2O2H7+V+bYduOBydN1lnI0uVfr1cIdY02uFFiEH1i3kE5CCE4l6UqbLKVmEFW9USxTAMD1g==}
+
+  unicode-emoji-modifier-base@1.0.0:
+    resolution: {integrity: sha512-yLSH4py7oFH3oG/9K+XWrz1pSi3dfUrWEnInbxMfArOfc1+33BlGPQtLsOYwvdMy11AwUBetYuaRxSPqgkq+8g==}
+    engines: {node: '>=4'}
+
   unicode-match-property-ecmascript@2.0.0:
     resolution: {integrity: sha512-5kaZCrbp5mmbz5ulBkDkbY0SsPOjKqVS35VpL9ulMPfSl0J0Xsm+9Evphv9CoIZFwre7aJoa94AY6seMKGVN5Q==}
     engines: {node: '>=4'}
@@ -9772,6 +9836,22 @@ snapshots:
 
   '@faker-js/faker@10.0.0': {}
 
+  '@ferrucc-io/emoji-picker@0.0.48(@babel/core@7.28.5)(@babel/template@7.27.2)(@types/react@18.3.17)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(tailwindcss@3.4.17)':
+    dependencies:
+      '@tanstack/react-virtual': 3.13.18(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      clsx: 2.1.1
+      jotai: 2.17.1(@babel/core@7.28.5)(@babel/template@7.27.2)(@types/react@18.3.17)(react@18.3.1)
+      node-emoji: 2.2.0
+      react: 18.3.1
+      react-dom: 18.3.1(react@18.3.1)
+      tailwind-merge: 2.6.0
+      tailwindcss: 3.4.17
+      unicode-emoji-json: 0.8.0
+    transitivePeerDependencies:
+      - '@babel/core'
+      - '@babel/template'
+      - '@types/react'
+
   '@floating-ui/core@1.7.3':
     dependencies:
       '@floating-ui/utils': 0.2.10
@@ -11533,6 +11613,8 @@ snapshots:
 
   '@shikijs/vscode-textmate@10.0.2': {}
 
+  '@sindresorhus/is@4.6.0': {}
+
   '@standard-schema/spec@1.0.0': {}
 
   '@standard-schema/spec@1.1.0': {}
@@ -12001,8 +12083,16 @@ snapshots:
       react: 18.3.1
       react-dom: 18.3.1(react@18.3.1)
 
+  '@tanstack/react-virtual@3.13.18(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
+    dependencies:
+      '@tanstack/virtual-core': 3.13.18
+      react: 18.3.1
+      react-dom: 18.3.1(react@18.3.1)
+
   '@tanstack/table-core@8.21.3': {}
 
+  '@tanstack/virtual-core@3.13.18': {}
+
   '@testing-library/dom@10.4.1':
     dependencies:
       '@babel/code-frame': 7.27.1
@@ -13094,6 +13184,8 @@ snapshots:
       ansi-styles: 4.3.0
       supports-color: 7.2.0
 
+  char-regex@1.0.2: {}
+
   character-entities-html4@2.1.0: {}
 
   character-entities-legacy@3.0.0: {}
@@ -13737,6 +13829,8 @@ snapshots:
 
   emoji-regex@9.2.2: {}
 
+  emojilib@2.4.0: {}
+
   emojis-list@3.0.0: {}
 
   endent@2.1.0:
@@ -15018,6 +15112,13 @@ snapshots:
 
   jiti@2.6.1: {}
 
+  jotai@2.17.1(@babel/core@7.28.5)(@babel/template@7.27.2)(@types/react@18.3.17)(react@18.3.1):
+    optionalDependencies:
+      '@babel/core': 7.28.5
+      '@babel/template': 7.27.2
+      '@types/react': 18.3.17
+      react: 18.3.1
+
   js-tokens@4.0.0: {}
 
   js-yaml@4.1.0:
@@ -15886,6 +15987,13 @@ snapshots:
 
   node-abort-controller@3.1.1: {}
 
+  node-emoji@2.2.0:
+    dependencies:
+      '@sindresorhus/is': 4.6.0
+      char-regex: 1.0.2
+      emojilib: 2.4.0
+      skin-tone: 2.0.0
+
   node-fetch-h2@2.3.0:
     dependencies:
       http2-client: 1.3.5
@@ -17186,6 +17294,10 @@ snapshots:
     dependencies:
       jsep: 1.4.0
 
+  skin-tone@2.0.0:
+    dependencies:
+      unicode-emoji-modifier-base: 1.0.0
+
   slash@3.0.0: {}
 
   sonner@2.0.7(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
@@ -17701,6 +17813,10 @@ snapshots:
 
   unicode-canonical-property-names-ecmascript@2.0.1: {}
 
+  unicode-emoji-json@0.8.0: {}
+
+  unicode-emoji-modifier-base@1.0.0: {}
+
   unicode-match-property-ecmascript@2.0.0:
     dependencies:
       unicode-canonical-property-names-ecmascript: 2.0.1

autogpt_platform/frontend/src/app/(platform)/auth/authorize/page.tsx

@@ -19,6 +19,8 @@ const SCOPE_DESCRIPTIONS: { [key in APIKeyPermission]: string } = {
   IDENTITY: "View your user ID, e-mail, and timezone",
   EXECUTE_GRAPH: "Run your agents",
   READ_GRAPH: "View your agents and their configurations",
+  WRITE_GRAPH: "Create agent graphs",
+  WRITE_LIBRARY: "Add agents to your library",
   EXECUTE_BLOCK: "Execute individual blocks",
   READ_BLOCK: "View available blocks",
   READ_STORE: "Access the Marketplace",

autogpt_platform/frontend/src/app/(platform)/build/components/FlowEditor/edges/CustomEdge.tsx

@@ -63,8 +63,19 @@ const CustomEdge = ({
 
   return (
     <>
+      <path
+        d={edgePath}
+        fill="none"
+        stroke="black"
+        strokeOpacity={0}
+        strokeWidth={20}
+        className="react-flow__edge-interaction cursor-pointer"
+        onMouseEnter={() => setIsHovered(true)}
+        onMouseLeave={() => setIsHovered(false)}
+      />
       <BaseEdge
         path={edgePath}
+        interactionWidth={0}
         markerEnd={markerEnd}
         className={cn(
           isStatic && "!stroke-[1.5px] [stroke-dasharray:6]",

autogpt_platform/frontend/src/app/(platform)/build/components/NewControlPanel/NewBlockMenu/Block.tsx

@@ -127,7 +127,10 @@ export const Block: BlockComponent = ({
     // preview when user drags it
     const dragPreview = document.createElement("div");
     dragPreview.style.cssText = blockDragPreviewStyle;
-    dragPreview.textContent = beautifyString(title || "");
+    dragPreview.textContent = beautifyString(title || "").replace(
+      / Block$/,
+      "",
+    );
 
     document.body.appendChild(dragPreview);
     e.dataTransfer.setDragImage(dragPreview, 0, 0);
@@ -162,7 +165,10 @@ export const Block: BlockComponent = ({
                 "line-clamp-1 font-sans text-sm font-medium leading-[1.375rem] text-zinc-800 group-disabled:text-zinc-400",
               )}
             >
-              {highlightText(beautifyString(title), highlightedText)}
+              {highlightText(
+                beautifyString(title).replace(/ Block$/, ""),
+                highlightedText,
+              )}
             </span>
           )}
           {description && (

autogpt_platform/frontend/src/app/(platform)/build/components/NewControlPanel/NewBlockMenu/BlockMenuFilters/BlockMenuFilters.tsx

@@ -2,7 +2,7 @@ import { useBlockMenuStore } from "@/app/(platform)/build/stores/blockMenuStore"
 import { FilterChip } from "../FilterChip";
 import { categories } from "./constants";
 import { FilterSheet } from "../FilterSheet/FilterSheet";
-import { GetV2BuilderSearchFilterAnyOfItem } from "@/app/api/__generated__/models/getV2BuilderSearchFilterAnyOfItem";
+import { CategoryKey } from "./types";
 
 export const BlockMenuFilters = () => {
   const {
@@ -15,7 +15,7 @@ export const BlockMenuFilters = () => {
     removeCreator,
   } = useBlockMenuStore();
 
-  const handleFilterClick = (filter: GetV2BuilderSearchFilterAnyOfItem) => {
+  const handleFilterClick = (filter: CategoryKey) => {
     if (filters.includes(filter)) {
       removeFilter(filter);
     } else {

autogpt_platform/frontend/src/app/(platform)/build/components/NewControlPanel/NewBlockMenu/BlockMenuFilters/constants.ts

@@ -1,15 +1,15 @@
-import { GetV2BuilderSearchFilterAnyOfItem } from "@/app/api/__generated__/models/getV2BuilderSearchFilterAnyOfItem";
+import { SearchEntryFilterAnyOfItem } from "@/app/api/__generated__/models/searchEntryFilterAnyOfItem";
 import { CategoryKey } from "./types";
 
 export const categories: Array<{ key: CategoryKey; name: string }> = [
-  { key: GetV2BuilderSearchFilterAnyOfItem.blocks, name: "Blocks" },
+  { key: SearchEntryFilterAnyOfItem.blocks, name: "Blocks" },
   {
-    key: GetV2BuilderSearchFilterAnyOfItem.integrations,
+    key: SearchEntryFilterAnyOfItem.integrations,
     name: "Integrations",
   },
   {
-    key: GetV2BuilderSearchFilterAnyOfItem.marketplace_agents,
+    key: SearchEntryFilterAnyOfItem.marketplace_agents,
     name: "Marketplace agents",
   },
-  { key: GetV2BuilderSearchFilterAnyOfItem.my_agents, name: "My agents" },
+  { key: SearchEntryFilterAnyOfItem.my_agents, name: "My agents" },
 ];

autogpt_platform/frontend/src/app/(platform)/build/components/NewControlPanel/NewBlockMenu/BlockMenuFilters/types.ts

@@ -1,4 +1,4 @@
-import { GetV2BuilderSearchFilterAnyOfItem } from "@/app/api/__generated__/models/getV2BuilderSearchFilterAnyOfItem";
+import { SearchEntryFilterAnyOfItem } from "@/app/api/__generated__/models/searchEntryFilterAnyOfItem";
 
 export type DefaultStateType =
   | "suggestion"
@@ -10,7 +10,7 @@ export type DefaultStateType =
   | "marketplace_agents"
   | "my_agents";
 
-export type CategoryKey = GetV2BuilderSearchFilterAnyOfItem;
+export type CategoryKey = SearchEntryFilterAnyOfItem;
 
 export interface Filters {
   categories: {

autogpt_platform/frontend/src/app/(platform)/build/components/NewControlPanel/NewBlockMenu/BlockMenuSearchContent/useBlockMenuSearchContent.tsx

@@ -23,7 +23,7 @@ import { LibraryAgent } from "@/app/api/__generated__/models/libraryAgent";
 import { getQueryClient } from "@/lib/react-query/queryClient";
 import { useToast } from "@/components/molecules/Toast/use-toast";
 import * as Sentry from "@sentry/nextjs";
-import { GetV2BuilderSearchFilterAnyOfItem } from "@/app/api/__generated__/models/getV2BuilderSearchFilterAnyOfItem";
+import { CategoryCounts } from "../BlockMenuFilters/types";
 
 export const useBlockMenuSearchContent = () => {
   const {
@@ -67,7 +67,7 @@ export const useBlockMenuSearchContent = () => {
       page_size: 8,
       search_query: searchQuery,
       search_id: searchId,
-      filter: filters.length > 0 ? filters : undefined,
+      filter: filters.length > 0 ? filters.join(",") : undefined,
       by_creator: creators.length > 0 ? creators : undefined,
     },
     {
@@ -117,10 +117,7 @@ export const useBlockMenuSearchContent = () => {
     }
     const latestData = okData(searchQueryData.pages.at(-1));
     setCategoryCounts(
-      (latestData?.total_items as Record<
-        GetV2BuilderSearchFilterAnyOfItem,
-        number
-      >) || {
+      (latestData?.total_items as CategoryCounts) || {
         blocks: 0,
         integrations: 0,
         marketplace_agents: 0,

autogpt_platform/frontend/src/app/(platform)/build/components/NewControlPanel/NewBlockMenu/FilterSheet/useFilterSheet.ts

@@ -1,7 +1,7 @@
 import { useBlockMenuStore } from "@/app/(platform)/build/stores/blockMenuStore";
 import { useState } from "react";
 import { INITIAL_CREATORS_TO_SHOW } from "./constant";
-import { GetV2BuilderSearchFilterAnyOfItem } from "@/app/api/__generated__/models/getV2BuilderSearchFilterAnyOfItem";
+import { CategoryKey } from "../BlockMenuFilters/types";
 
 export const useFilterSheet = () => {
   const { filters, creators_list, creators, setFilters, setCreators } =
@@ -9,15 +9,13 @@ export const useFilterSheet = () => {
 
   const [isOpen, setIsOpen] = useState(false);
   const [localCategories, setLocalCategories] =
-    useState<GetV2BuilderSearchFilterAnyOfItem[]>(filters);
+    useState<CategoryKey[]>(filters);
   const [localCreators, setLocalCreators] = useState<string[]>(creators);
   const [displayedCreatorsCount, setDisplayedCreatorsCount] = useState(
     INITIAL_CREATORS_TO_SHOW,
   );
 
-  const handleLocalCategoryChange = (
-    category: GetV2BuilderSearchFilterAnyOfItem,
-  ) => {
+  const handleLocalCategoryChange = (category: CategoryKey) => {
     setLocalCategories((prev) => {
       if (prev.includes(category)) {
         return prev.filter((c) => c !== category);

autogpt_platform/frontend/src/app/(platform)/build/components/NewControlPanel/NewBlockMenu/IntergrationBlock.tsx

@@ -61,7 +61,10 @@ export const IntegrationBlock: IntegrationBlockComponent = ({
     // preview when user drags it
     const dragPreview = document.createElement("div");
     dragPreview.style.cssText = blockDragPreviewStyle;
-    dragPreview.textContent = beautifyString(title || "");
+    dragPreview.textContent = beautifyString(title || "").replace(
+      / Block$/,
+      "",
+    );
 
     document.body.appendChild(dragPreview);
     e.dataTransfer.setDragImage(dragPreview, 0, 0);
@@ -100,7 +103,10 @@ export const IntegrationBlock: IntegrationBlockComponent = ({
               "line-clamp-1 font-sans text-sm font-medium leading-[1.375rem] text-zinc-800 group-disabled:text-zinc-400",
             )}
           >
-            {highlightText(beautifyString(title), highlightedText)}
+            {highlightText(
+              beautifyString(title).replace(/ Block$/, ""),
+              highlightedText,
+            )}
           </span>
         )}
         {description && (

autogpt_platform/frontend/src/app/(platform)/build/components/NewControlPanel/NewBlockMenu/UGCAgentBlock.tsx

@@ -81,6 +81,14 @@ export const UGCAgentBlock: UGCAgentBlockComponent = ({
           >
             Version {version}
           </span>
+
+          <span
+            className={cn(
+              "rounded-[0.75rem] bg-zinc-200 px-[0.5rem] font-sans text-xs leading-[1.25rem] text-zinc-500",
+            )}
+          >
+            Your Agent
+          </span>
         </div>
       </div>
       <div

autogpt_platform/frontend/src/app/(platform)/build/stores/blockMenuStore.ts

@@ -3,28 +3,29 @@ import { DefaultStateType } from "../components/NewControlPanel/NewBlockMenu/typ
 import { SearchResponseItemsItem } from "@/app/api/__generated__/models/searchResponseItemsItem";
 import { getSearchItemType } from "../components/NewControlPanel/NewBlockMenu/BlockMenuSearchContent/helper";
 import { StoreAgent } from "@/app/api/__generated__/models/storeAgent";
-import { GetV2BuilderSearchFilterAnyOfItem } from "@/app/api/__generated__/models/getV2BuilderSearchFilterAnyOfItem";
+import {
+  CategoryKey,
+  CategoryCounts,
+} from "../components/NewControlPanel/NewBlockMenu/BlockMenuFilters/types";
 
 type BlockMenuStore = {
   searchQuery: string;
   searchId: string | undefined;
   defaultState: DefaultStateType;
   integration: string | undefined;
-  filters: GetV2BuilderSearchFilterAnyOfItem[];
+  filters: CategoryKey[];
   creators: string[];
   creators_list: string[];
-  categoryCounts: Record<GetV2BuilderSearchFilterAnyOfItem, number>;
+  categoryCounts: CategoryCounts;
 
-  setCategoryCounts: (
-    counts: Record<GetV2BuilderSearchFilterAnyOfItem, number>,
-  ) => void;
+  setCategoryCounts: (counts: CategoryCounts) => void;
   setCreatorsList: (searchData: SearchResponseItemsItem[]) => void;
   addCreator: (creator: string) => void;
   setCreators: (creators: string[]) => void;
   removeCreator: (creator: string) => void;
-  addFilter: (filter: GetV2BuilderSearchFilterAnyOfItem) => void;
-  setFilters: (filters: GetV2BuilderSearchFilterAnyOfItem[]) => void;
-  removeFilter: (filter: GetV2BuilderSearchFilterAnyOfItem) => void;
+  addFilter: (filter: CategoryKey) => void;
+  setFilters: (filters: CategoryKey[]) => void;
+  removeFilter: (filter: CategoryKey) => void;
   setSearchQuery: (query: string) => void;
   setSearchId: (id: string | undefined) => void;
   setDefaultState: (state: DefaultStateType) => void;

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

@@ -0,0 +1,61 @@
+"use client";
+
+import { Button } from "@/components/atoms/Button/Button";
+import { Text } from "@/components/atoms/Text/Text";
+import { BookOpenIcon, PencilSimpleIcon } from "@phosphor-icons/react";
+import Image from "next/image";
+import sparklesImg from "../MiniGame/assets/sparkles.png";
+
+interface Props {
+  agentName: string;
+  message: string;
+  libraryAgentLink: string;
+  agentPageLink: string;
+}
+
+export function AgentSavedCard({
+  agentName,
+  message,
+  libraryAgentLink,
+  agentPageLink,
+}: Props) {
+  return (
+    <div className="rounded-xl border border-border/60 bg-card p-4 shadow-sm">
+      <div className="flex items-baseline gap-2">
+        <Image
+          src={sparklesImg}
+          alt="sparkles"
+          width={24}
+          height={24}
+          className="relative top-1"
+        />
+        <Text variant="body-medium" className="mb-2 text-[16px] text-black">
+          Agent <span className="text-violet-600">{agentName}</span> {message}
+        </Text>
+      </div>
+      <div className="mt-3 flex flex-wrap gap-2">
+        <Button
+          size="small"
+          as="NextLink"
+          href={libraryAgentLink}
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          <BookOpenIcon size={14} weight="regular" />
+          Open in library
+        </Button>
+        <Button
+          as="NextLink"
+          variant="secondary"
+          size="small"
+          href={agentPageLink}
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          <PencilSimpleIcon size={14} weight="regular" />
+          Open in builder
+        </Button>
+      </div>
+    </div>
+  );
+}

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

@@ -10,6 +10,7 @@ import {
   MessageResponse,
 } from "@/components/ai-elements/message";
 import { LoadingSpinner } from "@/components/atoms/LoadingSpinner/LoadingSpinner";
+import { ErrorCard } from "@/components/molecules/ErrorCard/ErrorCard";
 import { ToolUIPart, UIDataTypes, UIMessage, UITools } from "ai";
 import { useEffect, useState } from "react";
 import { CreateAgentTool } from "../../tools/CreateAgent/CreateAgent";
@@ -27,18 +28,68 @@ import { GenericTool } from "../../tools/GenericTool/GenericTool";
 import { ViewAgentOutputTool } from "../../tools/ViewAgentOutput/ViewAgentOutput";
 
 // ---------------------------------------------------------------------------
-// Workspace media support
+// Special text parsing (error markers, workspace URLs, etc.)
 // ---------------------------------------------------------------------------
 
+// Special message prefixes for text-based markers (set by backend)
+const COPILOT_ERROR_PREFIX = "[COPILOT_ERROR]";
+const COPILOT_SYSTEM_PREFIX = "[COPILOT_SYSTEM]";
+
+type MarkerType = "error" | "system" | null;
+
+/**
+ * Parse special markers from message content (error, system).
+ *
+ * Detects markers added by the backend for special rendering:
+ * - `[COPILOT_ERROR] message` → ErrorCard
+ * - `[COPILOT_SYSTEM] message` → System info message
+ *
+ * Returns marker type, marker text, and cleaned text.
+ */
+function parseSpecialMarkers(text: string): {
+  markerType: MarkerType;
+  markerText: string;
+  cleanText: string;
+} {
+  // Check for error marker
+  const errorMatch = text.match(
+    new RegExp(`\\${COPILOT_ERROR_PREFIX}\\s*(.+?)$`, "s"),
+  );
+  if (errorMatch) {
+    return {
+      markerType: "error",
+      markerText: errorMatch[1].trim(),
+      cleanText: text.replace(errorMatch[0], "").trim(),
+    };
+  }
+
+  // Check for system marker
+  const systemMatch = text.match(
+    new RegExp(`\\${COPILOT_SYSTEM_PREFIX}\\s*(.+?)$`, "s"),
+  );
+  if (systemMatch) {
+    return {
+      markerType: "system",
+      markerText: systemMatch[1].trim(),
+      cleanText: text.replace(systemMatch[0], "").trim(),
+    };
+  }
+
+  return { markerType: null, markerText: "", cleanText: text };
+}
+
 /**
  * Resolve workspace:// URLs in markdown text to proxy download URLs.
- * Detects MIME type from the hash fragment (e.g. workspace://id#video/mp4)
- * and prefixes the alt text with "video:" so the custom img component can
- * render a <video> element instead.
+ *
+ * Handles both image syntax  `![alt](workspace://id#mime)` and regular link
+ * syntax `[text](workspace://id)`.  For images the MIME type hash fragment is
+ * inspected so that videos can be rendered with a `<video>` element via the
+ * custom img component.
  */
 function resolveWorkspaceUrls(text: string): string {
-  return text.replace(
-    /!\[([^\]]*)\]\(workspace:\/\/([^)#\s]+)(?:#([^)\s]*))?\)/g,
+  // Handle image links: ![alt](workspace://id#mime)
+  let resolved = text.replace(
+    /!\[([^\]]*)\]\(workspace:\/\/([^)#\s]+)(?:#([^)#\s]*))?\)/g,
     (_match, alt: string, fileId: string, mimeHint?: string) => {
       const apiPath = getGetWorkspaceDownloadFileByIdUrl(fileId);
       const url = `/api/proxy${apiPath}`;
@@ -48,6 +99,25 @@ function resolveWorkspaceUrls(text: string): string {
       return `![${alt || "Image"}](${url})`;
     },
   );
+
+  // Handle regular links: [text](workspace://id) — without the leading "!"
+  // These are blocked by Streamdown's rehype-harden sanitizer because
+  // "workspace://" is not in the allowed URL-scheme whitelist, which causes
+  // "[blocked]" to appear next to the link text.
+  // Use an absolute URL so Streamdown's "Copy link" button copies the full
+  // URL (including host) rather than just the path.
+  resolved = resolved.replace(
+    /(?<!!)\[([^\]]*)\]\(workspace:\/\/([^)#\s]+)(?:#[^)#\s]*)?\)/g,
+    (_match, linkText: string, fileId: string) => {
+      const apiPath = getGetWorkspaceDownloadFileByIdUrl(fileId);
+      const origin =
+        typeof window !== "undefined" ? window.location.origin : "";
+      const url = `${origin}/api/proxy${apiPath}`;
+      return `[${linkText || "Download file"}](${url})`;
+    },
+  );
+
+  return resolved;
 }
 
 /**
@@ -129,24 +199,42 @@ export const ChatMessagesContainer = ({
 }: ChatMessagesContainerProps) => {
   const [thinkingPhrase, setThinkingPhrase] = useState(getRandomPhrase);
 
-  useEffect(() => {
-    if (status === "submitted") {
-      setThinkingPhrase(getRandomPhrase());
-    }
-  }, [status]);
-
   const lastMessage = messages[messages.length - 1];
-  const lastAssistantHasVisibleContent =
-    lastMessage?.role === "assistant" &&
-    lastMessage.parts.some(
-      (p) =>
-        (p.type === "text" && p.text.trim().length > 0) ||
-        p.type.startsWith("tool-"),
-    );
+
+  // Determine if something is visibly "in-flight" in the last assistant message:
+  // - Text is actively streaming (last part is non-empty text)
+  // - A tool call is pending (state is input-streaming or input-available)
+  const hasInflight = (() => {
+    if (lastMessage?.role !== "assistant") return false;
+    const parts = lastMessage.parts;
+    if (parts.length === 0) return false;
+
+    const lastPart = parts[parts.length - 1];
+
+    // Text is actively being written
+    if (lastPart.type === "text" && lastPart.text.trim().length > 0)
+      return true;
+
+    // A tool call is still pending (no output yet)
+    if (
+      lastPart.type.startsWith("tool-") &&
+      "state" in lastPart &&
+      (lastPart.state === "input-streaming" ||
+        lastPart.state === "input-available")
+    )
+      return true;
+
+    return false;
+  })();
 
   const showThinking =
-    status === "submitted" ||
-    (status === "streaming" && !lastAssistantHasVisibleContent);
+    status === "submitted" || (status === "streaming" && !hasInflight);
+
+  useEffect(() => {
+    if (showThinking) {
+      setThinkingPhrase(getRandomPhrase());
+    }
+  }, [showThinking]);
 
   return (
     <Conversation className="min-h-0 flex-1">
@@ -164,11 +252,6 @@ export const ChatMessagesContainer = ({
           const isLastAssistant =
             messageIndex === messages.length - 1 &&
             message.role === "assistant";
-          const messageHasVisibleContent = message.parts.some(
-            (p) =>
-              (p.type === "text" && p.text.trim().length > 0) ||
-              p.type.startsWith("tool-"),
-          );
 
           return (
             <Message from={message.role} key={message.id}>
@@ -181,15 +264,41 @@ export const ChatMessagesContainer = ({
               >
                 {message.parts.map((part, i) => {
                   switch (part.type) {
-                    case "text":
+                    case "text": {
+                      // Check for special markers (error, system)
+                      const { markerType, markerText, cleanText } =
+                        parseSpecialMarkers(part.text);
+
+                      if (markerType === "error") {
+                        return (
+                          <ErrorCard
+                            key={`${message.id}-${i}`}
+                            responseError={{ message: markerText }}
+                            context="execution"
+                          />
+                        );
+                      }
+
+                      if (markerType === "system") {
+                        return (
+                          <div
+                            key={`${message.id}-${i}`}
+                            className="my-2 rounded-lg bg-neutral-100 px-3 py-2 text-sm italic text-neutral-600"
+                          >
+                            {markerText}
+                          </div>
+                        );
+                      }
+
                       return (
                         <MessageResponse
                           key={`${message.id}-${i}`}
                           components={STREAMDOWN_COMPONENTS}
                         >
-                          {resolveWorkspaceUrls(part.text)}
+                          {resolveWorkspaceUrls(cleanText)}
                         </MessageResponse>
                       );
+                    }
                     case "tool-find_block":
                       return (
                         <FindBlocksTool
@@ -277,13 +386,11 @@ export const ChatMessagesContainer = ({
                       return null;
                   }
                 })}
-                {isLastAssistant &&
-                  !messageHasVisibleContent &&
-                  showThinking && (
-                    <span className="inline-block animate-shimmer bg-gradient-to-r from-neutral-400 via-neutral-600 to-neutral-400 bg-[length:200%_100%] bg-clip-text text-transparent">
-                      {thinkingPhrase}
-                    </span>
-                  )}
+                {isLastAssistant && showThinking && (
+                  <span className="inline-block animate-shimmer bg-gradient-to-r from-neutral-400 via-neutral-600 to-neutral-400 bg-[length:200%_100%] bg-clip-text text-transparent">
+                    {thinkingPhrase}
+                  </span>
+                )}
               </MessageContent>
             </Message>
           );

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

@@ -0,0 +1,69 @@
+"use client";
+
+import { Button } from "@/components/atoms/Button/Button";
+import { Text } from "@/components/atoms/Text/Text";
+import { WarningDiamondIcon } from "@phosphor-icons/react";
+
+interface Props {
+  message?: string;
+  fallbackMessage: string;
+  error?: string;
+  details?: string;
+  actions: Array<{
+    label: string;
+    onClick: () => void;
+    variant?: "outline" | "ghost";
+  }>;
+}
+
+export function ToolErrorCard({
+  message,
+  fallbackMessage,
+  error,
+  details,
+  actions,
+}: Props) {
+  return (
+    <div className="space-y-3 rounded-lg border border-red-200 bg-red-50 p-4">
+      <div className="flex items-start gap-2">
+        <WarningDiamondIcon
+          size={20}
+          weight="regular"
+          className="mt-0.5 shrink-0 text-red-500"
+        />
+        <div className="flex-1 space-y-2">
+          <Text variant="body-medium" className="text-red-900">
+            {message || fallbackMessage}
+          </Text>
+          {error && (
+            <details className="text-xs text-red-700">
+              <summary className="cursor-pointer font-medium">
+                Technical details
+              </summary>
+              <pre className="mt-2 max-h-40 overflow-auto whitespace-pre-wrap break-words rounded bg-red-100 p-2">
+                {error}
+              </pre>
+            </details>
+          )}
+          {details && (
+            <pre className="max-h-40 overflow-auto whitespace-pre-wrap break-words rounded bg-red-100 p-2 text-xs text-red-700">
+              {details}
+            </pre>
+          )}
+        </div>
+      </div>
+      <div className="flex gap-2 pt-3">
+        {actions.map((action, i) => (
+          <Button
+            key={i}
+            variant={action.variant ?? "outline"}
+            size="small"
+            onClick={action.onClick}
+          >
+            {action.label}
+          </Button>
+        ))}
+      </div>
+    </div>
+  );
+}

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

@@ -921,26 +921,29 @@ export default function StyleguidePage() {
                     output: {
                       type: ResponseType.agent_details,
                       agent: {
+                        id: "agent-yt-1",
                         name: "YouTube Summarizer",
                         description:
                           "Summarizes YouTube videos into key points.",
-                        inputs: [
-                          {
-                            name: "video_url",
-                            title: "Video URL",
-                            type: "string",
-                            required: true,
-                            description: "The YouTube video URL to summarize",
+                        inputs: {
+                          type: "object",
+                          properties: {
+                            video_url: {
+                              type: "string",
+                              title: "Video URL",
+                              description: "The YouTube video URL to summarize",
+                              default: "https://youtube.com/watch?v=example",
+                            },
+                            language: {
+                              type: "string",
+                              title: "Output Language",
+                              description:
+                                "Language for the summary (default: English)",
+                              default: "English",
+                            },
                           },
-                          {
-                            name: "language",
-                            title: "Output Language",
-                            type: "string",
-                            required: false,
-                            description:
-                              "Language for the summary (default: English)",
-                          },
-                        ],
+                          required: ["video_url"],
+                        },
                       },
                       message: "This agent requires inputs to run.",
                     },

autogpt_platform/frontend/src/app/(platform)/copilot/tools/CreateAgent/CreateAgent.tsx

@@ -1,16 +1,9 @@
 "use client";
 
-import { Button } from "@/components/atoms/Button/Button";
-import { Text } from "@/components/atoms/Text/Text";
-import {
-  BookOpenIcon,
-  PencilSimpleIcon,
-  WarningDiamondIcon,
-} from "@phosphor-icons/react";
 import type { ToolUIPart } from "ai";
-import Image from "next/image";
-import NextLink from "next/link";
+import { AgentSavedCard } from "../../components/AgentSavedCard/AgentSavedCard";
 import { useCopilotChatActions } from "../../components/CopilotChatActionsProvider/useCopilotChatActions";
+import { ToolErrorCard } from "../../components/ToolErrorCard/ToolErrorCard";
 import { MorphingTextAnimation } from "../../components/MorphingTextAnimation/MorphingTextAnimation";
 import {
   ContentCardDescription,
@@ -20,11 +13,7 @@ import {
   ContentMessage,
 } from "../../components/ToolAccordion/AccordionContent";
 import { ToolAccordion } from "../../components/ToolAccordion/ToolAccordion";
-import {
-  ClarificationQuestionsCard,
-  ClarifyingQuestion,
-} from "./components/ClarificationQuestionsCard";
-import sparklesImg from "../../components/MiniGame/assets/sparkles.png";
+import { ClarificationQuestionsCard } from "./components/ClarificationQuestionsCard";
 import { MiniGame } from "../../components/MiniGame/MiniGame";
 import { SuggestedGoalCard } from "./components/SuggestedGoalCard";
 import {
@@ -39,6 +28,7 @@ import {
   isSuggestedGoalOutput,
   ToolIcon,
   truncateText,
+  normalizeClarifyingQuestions,
   type CreateAgentToolOutput,
 } from "./helpers";
 
@@ -66,9 +56,6 @@ function getAccordionMeta(output: CreateAgentToolOutput | null) {
     };
   }
 
-  if (isAgentSavedOutput(output)) {
-    return { icon, title: output.agent_name, expanded: true };
-  }
   if (isAgentPreviewOutput(output)) {
     return {
       icon,
@@ -92,13 +79,7 @@ function getAccordionMeta(output: CreateAgentToolOutput | null) {
       expanded: true,
     };
   }
-  return {
-    icon: (
-      <WarningDiamondIcon size={32} weight="light" className="text-red-500" />
-    ),
-    title: "Error",
-    titleClassName: "text-red-500",
-  };
+  return { icon, title: "" };
 }
 
 export function CreateAgentTool({ part }: Props) {
@@ -154,154 +135,79 @@ export function CreateAgentTool({ part }: Props) {
       )}
 
       {isError && output && isErrorOutput(output) && (
-        <div className="space-y-3 rounded-lg border border-red-200 bg-red-50 p-4">
-          <div className="flex items-start gap-2">
-            <WarningDiamondIcon
-              size={20}
-              weight="regular"
-              className="mt-0.5 shrink-0 text-red-500"
-            />
-            <div className="flex-1 space-y-2">
-              <Text variant="body-medium" className="text-red-900">
-                {output.message ||
-                  "Failed to generate the agent. Please try again."}
-              </Text>
-              {output.error && (
-                <details className="text-xs text-red-700">
-                  <summary className="cursor-pointer font-medium">
-                    Technical details
-                  </summary>
-                  <pre className="mt-2 max-h-40 overflow-auto whitespace-pre-wrap break-words rounded bg-red-100 p-2">
-                    {formatMaybeJson(output.error)}
-                  </pre>
-                </details>
-              )}
-              {output.details && (
-                <pre className="max-h-40 overflow-auto whitespace-pre-wrap break-words rounded bg-red-100 p-2 text-xs text-red-700">
-                  {formatMaybeJson(output.details)}
-                </pre>
-              )}
-            </div>
-          </div>
-          <div className="flex gap-2">
-            <Button
-              variant="outline"
-              size="small"
-              onClick={() => onSend("Please try creating the agent again.")}
-            >
-              Try again
-            </Button>
-            <Button
-              variant="outline"
-              size="small"
-              onClick={() => onSend("Can you help me simplify this goal?")}
-            >
-              Simplify goal
-            </Button>
-          </div>
-        </div>
+        <ToolErrorCard
+          message={output.message}
+          fallbackMessage="Failed to generate the agent. Please try again."
+          error={output.error ? formatMaybeJson(output.error) : undefined}
+          details={output.details ? formatMaybeJson(output.details) : undefined}
+          actions={[
+            {
+              label: "Try again",
+              onClick: () => onSend("Please try creating the agent again."),
+            },
+            {
+              label: "Simplify goal",
+              variant: "ghost",
+              onClick: () => onSend("Can you help me simplify this goal?"),
+            },
+          ]}
+        />
       )}
 
-      {hasExpandableContent && (
-        <ToolAccordion {...getAccordionMeta(output)}>
-          {isOperating && (
-            <ContentGrid>
-              <MiniGame />
-              <ContentHint>
-                This could take a few minutes — play while you wait!
-              </ContentHint>
-            </ContentGrid>
-          )}
+      {hasExpandableContent &&
+        !(output && isClarificationNeededOutput(output)) &&
+        !(output && isAgentSavedOutput(output)) && (
+          <ToolAccordion {...getAccordionMeta(output)}>
+            {isOperating && (
+              <ContentGrid>
+                <MiniGame />
+                <ContentHint>
+                  This could take a few minutes — play while you wait!
+                </ContentHint>
+              </ContentGrid>
+            )}
 
-          {output && isAgentSavedOutput(output) && (
-            <div className="rounded-xl border border-border/60 bg-card p-4 shadow-sm">
-              <div className="flex items-baseline gap-2">
-                <Image
-                  src={sparklesImg}
-                  alt="sparkles"
-                  width={24}
-                  height={24}
-                  className="relative top-1"
-                />
-                <Text
-                  variant="body-medium"
-                  className="mb-2 text-[16px] text-black"
-                >
-                  Agent{" "}
-                  <span className="text-violet-600">{output.agent_name}</span>{" "}
-                  has been saved to your library!
-                </Text>
-              </div>
-              <div className="mt-3 flex flex-wrap gap-4">
-                <Button variant="outline" size="small">
-                  <NextLink
-                    href={output.library_agent_link}
-                    className="inline-flex items-center gap-1.5"
-                    target="_blank"
-                    rel="noopener noreferrer"
-                  >
-                    <BookOpenIcon size={14} weight="regular" />
-                    Open in library
-                  </NextLink>
-                </Button>
-                <Button variant="outline" size="small">
-                  <NextLink
-                    href={output.agent_page_link}
-                    target="_blank"
-                    rel="noopener noreferrer"
-                    className="inline-flex items-center gap-1.5"
-                  >
-                    <PencilSimpleIcon size={14} weight="regular" />
-                    Open in builder
-                  </NextLink>
-                </Button>
-              </div>
-            </div>
-          )}
+            {output && isAgentPreviewOutput(output) && (
+              <ContentGrid>
+                <ContentMessage>{output.message}</ContentMessage>
+                {output.description?.trim() && (
+                  <ContentCardDescription>
+                    {output.description}
+                  </ContentCardDescription>
+                )}
+                <ContentCodeBlock>
+                  {truncateText(formatMaybeJson(output.agent_json), 1600)}
+                </ContentCodeBlock>
+              </ContentGrid>
+            )}
 
-          {output && isAgentPreviewOutput(output) && (
-            <ContentGrid>
-              <ContentMessage>{output.message}</ContentMessage>
-              {output.description?.trim() && (
-                <ContentCardDescription>
-                  {output.description}
-                </ContentCardDescription>
-              )}
-              <ContentCodeBlock>
-                {truncateText(formatMaybeJson(output.agent_json), 1600)}
-              </ContentCodeBlock>
-            </ContentGrid>
-          )}
+            {output && isSuggestedGoalOutput(output) && (
+              <SuggestedGoalCard
+                message={output.message}
+                suggestedGoal={output.suggested_goal}
+                reason={output.reason}
+                goalType={output.goal_type ?? "vague"}
+                onUseSuggestedGoal={handleUseSuggestedGoal}
+              />
+            )}
+          </ToolAccordion>
+        )}
 
-          {output && isClarificationNeededOutput(output) && (
-            <ClarificationQuestionsCard
-              questions={(output.questions ?? []).map((q) => {
-                const item: ClarifyingQuestion = {
-                  question: q.question,
-                  keyword: q.keyword,
-                };
-                const example =
-                  typeof q.example === "string" && q.example.trim()
-                    ? q.example.trim()
-                    : null;
-                if (example) item.example = example;
-                return item;
-              })}
-              message={output.message}
-              onSubmitAnswers={handleClarificationAnswers}
-            />
-          )}
+      {output && isAgentSavedOutput(output) && (
+        <AgentSavedCard
+          agentName={output.agent_name}
+          message="has been saved to your library!"
+          libraryAgentLink={output.library_agent_link}
+          agentPageLink={output.agent_page_link}
+        />
+      )}
 
-          {output && isSuggestedGoalOutput(output) && (
-            <SuggestedGoalCard
-              message={output.message}
-              suggestedGoal={output.suggested_goal}
-              reason={output.reason}
-              goalType={output.goal_type ?? "vague"}
-              onUseSuggestedGoal={handleUseSuggestedGoal}
-            />
-          )}
-        </ToolAccordion>
+      {output && isClarificationNeededOutput(output) && (
+        <ClarificationQuestionsCard
+          questions={normalizeClarifyingQuestions(output.questions ?? [])}
+          message={output.message}
+          onSubmitAnswers={handleClarificationAnswers}
+        />
       )}
     </div>
   );

autogpt_platform/frontend/src/app/(platform)/copilot/tools/CreateAgent/components/ClarificationQuestionsCard.tsx

@@ -5,14 +5,9 @@ import { Card } from "@/components/atoms/Card/Card";
 import { Input } from "@/components/atoms/Input/Input";
 import { Text } from "@/components/atoms/Text/Text";
 import { cn } from "@/lib/utils";
-import { CheckCircleIcon, QuestionIcon } from "@phosphor-icons/react";
+import { ChatTeardropDotsIcon, CheckCircleIcon } from "@phosphor-icons/react";
 import { useEffect, useRef, useState } from "react";
-
-export interface ClarifyingQuestion {
-  question: string;
-  keyword: string;
-  example?: string;
-}
+import type { ClarifyingQuestion } from "../helpers";
 
 interface Props {
   questions: ClarifyingQuestion[];
@@ -133,29 +128,26 @@ export function ClarificationQuestionsCard({
   return (
     <div
       className={cn(
-        "group relative flex w-full justify-start gap-3 px-4 py-3",
+        "group relative flex w-full justify-start gap-3",
         className,
       )}
     >
       <div className="flex w-full max-w-3xl gap-3">
-        <div className="flex-shrink-0">
-          <div className="flex h-7 w-7 items-center justify-center rounded-lg bg-indigo-500">
-            <QuestionIcon className="h-4 w-4 text-indigo-50" weight="bold" />
-          </div>
-        </div>
-
         <div className="flex min-w-0 flex-1 flex-col">
-          <Card className="space-y-4 p-4">
+          <Card className="space-y-6 p-8">
             <div>
-              <Text variant="h4" className="mb-1 text-slate-900">
-                I need more information
-              </Text>
-              <Text variant="small" className="text-slate-600">
+              <div className="flex gap-3">
+                <ChatTeardropDotsIcon className="size-6" />
+                <Text variant="h4" className="mb-1 text-slate-900">
+                  I need more information
+                </Text>
+              </div>
+              <Text variant="body" className="text-slate-600">
                 {message}
               </Text>
             </div>
 
-            <div className="space-y-3">
+            <div className="space-y-6">
               {questions.map((q, index) => {
                 const isAnswered = !!answers[q.keyword]?.trim();
 
@@ -163,34 +155,34 @@ export function ClarificationQuestionsCard({
                   <div
                     key={`${q.keyword}-${index}`}
                     className={cn(
-                      "relative rounded-lg border p-3",
+                      "relative rounded-lg border border-dotted p-3",
                       isAnswered
                         ? "border-green-500 bg-green-50/50"
-                        : "border-slate-200 bg-white/50",
+                        : "border-slate-100 bg-slate-50/50",
                     )}
                   >
                     <div className="mb-2 flex items-start gap-2">
                       {isAnswered ? (
                         <CheckCircleIcon
-                          size={16}
+                          size={20}
                           className="mt-0.5 text-green-500"
                           weight="bold"
                         />
                       ) : (
-                        <div className="mt-0.5 flex h-4 w-4 items-center justify-center rounded-full border border-slate-300 bg-white text-xs text-slate-500">
+                        <div className="mt-0 flex h-6 w-6 items-center justify-center rounded-full border border-slate-300 font-mono">
                           {index + 1}
                         </div>
                       )}
                       <div className="flex-1">
                         <Text
-                          variant="small"
+                          variant="h5"
                           className="mb-2 font-semibold text-slate-900"
                         >
                           {q.question}
                         </Text>
                         {q.example && (
                           <Text
-                            variant="small"
+                            variant="body"
                             className="mb-2 italic text-slate-500"
                           >
                             Example: {q.example}
@@ -215,11 +207,11 @@ export function ClarificationQuestionsCard({
               })}
             </div>
 
-            <div className="flex gap-2">
+            <div className="flex max-w-[25rem] gap-2">
               <Button
                 onClick={handleSubmit}
                 disabled={!allAnswered}
-                className="flex-1"
+                className="w-auto flex-1"
                 variant="primary"
               >
                 Submit Answers

autogpt_platform/frontend/src/app/(platform)/copilot/tools/CreateAgent/helpers.tsx

@@ -157,3 +157,41 @@ export function truncateText(text: string, maxChars: number): string {
   if (trimmed.length <= maxChars) return trimmed;
   return `${trimmed.slice(0, maxChars).trimEnd()}…`;
 }
+
+export interface ClarifyingQuestion {
+  question: string;
+  keyword: string;
+  example?: string;
+}
+
+export function normalizeClarifyingQuestions(
+  questions: Array<{ question: string; keyword: string; example?: unknown }>,
+): ClarifyingQuestion[] {
+  const seen = new Set<string>();
+
+  return questions.map((q, index) => {
+    let keyword = q.keyword?.trim().toLowerCase() || "";
+    if (!keyword) {
+      keyword = `question-${index}`;
+    }
+
+    let unique = keyword;
+    let suffix = 1;
+    while (seen.has(unique)) {
+      unique = `${keyword}-${suffix}`;
+      suffix++;
+    }
+    seen.add(unique);
+
+    const item: ClarifyingQuestion = {
+      question: q.question,
+      keyword: unique,
+    };
+    const example =
+      typeof q.example === "string" && q.example.trim()
+        ? q.example.trim()
+        : null;
+    if (example) item.example = example;
+    return item;
+  });
+}

autogpt_platform/frontend/src/app/(platform)/copilot/tools/EditAgent/EditAgent.tsx

@@ -1,17 +1,9 @@
 "use client";
 
-import { Button } from "@/components/atoms/Button/Button";
-import { Text } from "@/components/atoms/Text/Text";
-import {
-  BookOpenIcon,
-  PencilSimpleIcon,
-  WarningDiamondIcon,
-} from "@phosphor-icons/react";
 import type { ToolUIPart } from "ai";
-import Image from "next/image";
-import NextLink from "next/link";
+import { AgentSavedCard } from "../../components/AgentSavedCard/AgentSavedCard";
 import { useCopilotChatActions } from "../../components/CopilotChatActionsProvider/useCopilotChatActions";
-import sparklesImg from "../../components/MiniGame/assets/sparkles.png";
+import { ToolErrorCard } from "../../components/ToolErrorCard/ToolErrorCard";
 import { MiniGame } from "../../components/MiniGame/MiniGame";
 import { MorphingTextAnimation } from "../../components/MorphingTextAnimation/MorphingTextAnimation";
 import {
@@ -22,10 +14,8 @@ import {
   ContentMessage,
 } from "../../components/ToolAccordion/AccordionContent";
 import { ToolAccordion } from "../../components/ToolAccordion/ToolAccordion";
-import {
-  ClarificationQuestionsCard,
-  ClarifyingQuestion,
-} from "../CreateAgent/components/ClarificationQuestionsCard";
+import { ClarificationQuestionsCard } from "../CreateAgent/components/ClarificationQuestionsCard";
+import { normalizeClarifyingQuestions } from "../CreateAgent/helpers";
 import {
   AccordionIcon,
   formatMaybeJson,
@@ -69,9 +59,6 @@ function getAccordionMeta(output: EditAgentToolOutput | null): {
     };
   }
 
-  if (isAgentSavedOutput(output)) {
-    return { icon, title: output.agent_name, expanded: true };
-  }
   if (isAgentPreviewOutput(output)) {
     return {
       icon,
@@ -87,13 +74,7 @@ function getAccordionMeta(output: EditAgentToolOutput | null): {
       description: `${questions.length} question${questions.length === 1 ? "" : "s"}`,
     };
   }
-  return {
-    icon: (
-      <WarningDiamondIcon size={32} weight="light" className="text-red-500" />
-    ),
-    title: "Error",
-    titleClassName: "text-red-500",
-  };
+  return { icon, title: "" };
 }
 
 export function EditAgentTool({ part }: Props) {
@@ -143,135 +124,64 @@ export function EditAgentTool({ part }: Props) {
       )}
 
       {isError && output && isErrorOutput(output) && (
-        <div className="space-y-3 rounded-lg border border-red-200 bg-red-50 p-4">
-          <div className="flex items-start gap-2">
-            <WarningDiamondIcon
-              size={20}
-              weight="regular"
-              className="mt-0.5 shrink-0 text-red-500"
-            />
-            <div className="flex-1 space-y-2">
-              <Text variant="body-medium" className="text-red-900">
-                {output.message ||
-                  "Failed to edit the agent. Please try again."}
-              </Text>
-              {output.error && (
-                <details className="text-xs text-red-700">
-                  <summary className="cursor-pointer font-medium">
-                    Technical details
-                  </summary>
-                  <pre className="mt-2 max-h-40 overflow-auto whitespace-pre-wrap break-words rounded bg-red-100 p-2">
-                    {formatMaybeJson(output.error)}
-                  </pre>
-                </details>
-              )}
-              {output.details && (
-                <pre className="max-h-40 overflow-auto whitespace-pre-wrap break-words rounded bg-red-100 p-2 text-xs text-red-700">
-                  {formatMaybeJson(output.details)}
-                </pre>
-              )}
-            </div>
-          </div>
-          <Button
-            variant="outline"
-            size="small"
-            onClick={() => onSend("Please try editing the agent again.")}
-          >
-            Try again
-          </Button>
-        </div>
+        <ToolErrorCard
+          message={output.message}
+          fallbackMessage="Failed to edit the agent. Please try again."
+          error={output.error ? formatMaybeJson(output.error) : undefined}
+          details={output.details ? formatMaybeJson(output.details) : undefined}
+          actions={[
+            {
+              label: "Try again",
+              onClick: () => onSend("Please try editing the agent again."),
+            },
+          ]}
+        />
       )}
 
-      {hasExpandableContent && (
-        <ToolAccordion {...getAccordionMeta(output)}>
-          {isOperating && (
-            <ContentGrid>
-              <MiniGame />
-              <ContentHint>
-                This could take a few minutes — play while you wait!
-              </ContentHint>
-            </ContentGrid>
-          )}
+      {hasExpandableContent &&
+        !(output && isClarificationNeededOutput(output)) &&
+        !(output && isAgentSavedOutput(output)) && (
+          <ToolAccordion {...getAccordionMeta(output)}>
+            {isOperating && (
+              <ContentGrid>
+                <MiniGame />
+                <ContentHint>
+                  This could take a few minutes — play while you wait!
+                </ContentHint>
+              </ContentGrid>
+            )}
 
-          {output && isAgentSavedOutput(output) && (
-            <div className="rounded-xl border border-border/60 bg-card p-4 shadow-sm">
-              <div className="flex items-baseline gap-2">
-                <Image
-                  src={sparklesImg}
-                  alt="sparkles"
-                  width={24}
-                  height={24}
-                  className="relative top-1"
-                />
-                <Text
-                  variant="body-medium"
-                  className="mb-2 text-[16px] text-black"
-                >
-                  Agent{" "}
-                  <span className="text-violet-600">{output.agent_name}</span>{" "}
-                  has been updated!
-                </Text>
-              </div>
-              <div className="mt-3 flex flex-wrap gap-4">
-                <Button variant="outline" size="small">
-                  <NextLink
-                    href={output.library_agent_link}
-                    className="inline-flex items-center gap-1.5"
-                    target="_blank"
-                    rel="noopener noreferrer"
-                  >
-                    <BookOpenIcon size={14} weight="regular" />
-                    Open in library
-                  </NextLink>
-                </Button>
-                <Button variant="outline" size="small">
-                  <NextLink
-                    href={output.agent_page_link}
-                    target="_blank"
-                    rel="noopener noreferrer"
-                    className="inline-flex items-center gap-1.5"
-                  >
-                    <PencilSimpleIcon size={14} weight="regular" />
-                    Open in builder
-                  </NextLink>
-                </Button>
-              </div>
-            </div>
-          )}
+            {output && isAgentPreviewOutput(output) && (
+              <ContentGrid>
+                <ContentMessage>{output.message}</ContentMessage>
+                {output.description?.trim() && (
+                  <ContentCardDescription>
+                    {output.description}
+                  </ContentCardDescription>
+                )}
+                <ContentCodeBlock>
+                  {truncateText(formatMaybeJson(output.agent_json), 1600)}
+                </ContentCodeBlock>
+              </ContentGrid>
+            )}
+          </ToolAccordion>
+        )}
 
-          {output && isAgentPreviewOutput(output) && (
-            <ContentGrid>
-              <ContentMessage>{output.message}</ContentMessage>
-              {output.description?.trim() && (
-                <ContentCardDescription>
-                  {output.description}
-                </ContentCardDescription>
-              )}
-              <ContentCodeBlock>
-                {truncateText(formatMaybeJson(output.agent_json), 1600)}
-              </ContentCodeBlock>
-            </ContentGrid>
-          )}
+      {output && isAgentSavedOutput(output) && (
+        <AgentSavedCard
+          agentName={output.agent_name}
+          message="has been updated!"
+          libraryAgentLink={output.library_agent_link}
+          agentPageLink={output.agent_page_link}
+        />
+      )}
 
-          {output && isClarificationNeededOutput(output) && (
-            <ClarificationQuestionsCard
-              questions={(output.questions ?? []).map((q) => {
-                const item: ClarifyingQuestion = {
-                  question: q.question,
-                  keyword: q.keyword,
-                };
-                const example =
-                  typeof q.example === "string" && q.example.trim()
-                    ? q.example.trim()
-                    : null;
-                if (example) item.example = example;
-                return item;
-              })}
-              message={output.message}
-              onSubmitAnswers={handleClarificationAnswers}
-            />
-          )}
-        </ToolAccordion>
+      {output && isClarificationNeededOutput(output) && (
+        <ClarificationQuestionsCard
+          questions={normalizeClarifyingQuestions(output.questions ?? [])}
+          message={output.message}
+          onSubmitAnswers={handleClarificationAnswers}
+        />
       )}
     </div>
   );

autogpt_platform/frontend/src/app/(platform)/copilot/tools/RunAgent/components/AgentDetailsCard/AgentDetailsCard.tsx

@@ -2,13 +2,11 @@
 
 import type { AgentDetailsResponse } from "@/app/api/__generated__/models/agentDetailsResponse";
 import { Button } from "@/components/atoms/Button/Button";
-import { Text } from "@/components/atoms/Text/Text";
 import { FormRenderer } from "@/components/renderers/InputRenderer/FormRenderer";
-import { AnimatePresence, motion } from "framer-motion";
 import { useState } from "react";
 import { useCopilotChatActions } from "../../../../components/CopilotChatActionsProvider/useCopilotChatActions";
 import { ContentMessage } from "../../../../components/ToolAccordion/AccordionContent";
-import { buildInputSchema } from "./helpers";
+import { buildInputSchema, extractDefaults, isFormValid } from "./helpers";
 
 interface Props {
   output: AgentDetailsResponse;
@@ -16,16 +14,25 @@ interface Props {
 
 export function AgentDetailsCard({ output }: Props) {
   const { onSend } = useCopilotChatActions();
-  const [showInputForm, setShowInputForm] = useState(false);
-  const [inputValues, setInputValues] = useState<Record<string, unknown>>({});
+  const schema = buildInputSchema(output.agent.inputs);
 
-  function handleRunWithExamples() {
-    onSend(
-      `Run the agent "${output.agent.name}" with placeholder/example values so I can test it.`,
-    );
+  const defaults = schema ? extractDefaults(schema) : {};
+
+  const [inputValues, setInputValues] =
+    useState<Record<string, unknown>>(defaults);
+  const [valid, setValid] = useState(() =>
+    schema ? isFormValid(schema, defaults) : false,
+  );
+
+  function handleChange(v: { formData?: Record<string, unknown> }) {
+    const data = v.formData ?? {};
+    setInputValues(data);
+    if (schema) {
+      setValid(isFormValid(schema, data));
+    }
   }
 
-  function handleRunWithInputs() {
+  function handleProceed() {
     const nonEmpty = Object.fromEntries(
       Object.entries(inputValues).filter(
         ([, v]) => v !== undefined && v !== null && v !== "",
@@ -34,83 +41,61 @@ export function AgentDetailsCard({ output }: Props) {
     onSend(
       `Run the agent "${output.agent.name}" with these inputs: ${JSON.stringify(nonEmpty, null, 2)}`,
     );
-    setShowInputForm(false);
-    setInputValues({});
+  }
+
+  if (!schema) {
+    return (
+      <div className="grid gap-2">
+        <ContentMessage>This agent has no configurable inputs.</ContentMessage>
+        <div className="flex gap-2 pt-2">
+          <Button
+            size="small"
+            className="w-fit"
+            onClick={() =>
+              onSend(
+                `Run the agent "${output.agent.name}" with placeholder/example values so I can test it.`,
+              )
+            }
+          >
+            Proceed
+          </Button>
+        </div>
+      </div>
+    );
   }
 
   return (
     <div className="grid gap-2">
       <ContentMessage>
-        Run this agent with example values or your own inputs.
+        Review the inputs below and press Proceed to run.
       </ContentMessage>
 
-      <div className="flex gap-2 pt-4">
-        <Button size="small" className="w-fit" onClick={handleRunWithExamples}>
-          Run with example values
-        </Button>
-        <Button
-          variant="outline"
-          size="small"
-          className="w-fit"
-          onClick={() => setShowInputForm((prev) => !prev)}
-        >
-          Run with my inputs
-        </Button>
+      <div className="mt-2 rounded-2xl border bg-background p-3 pt-4">
+        <FormRenderer
+          jsonSchema={schema}
+          handleChange={handleChange}
+          uiSchema={{
+            "ui:submitButtonOptions": { norender: true },
+          }}
+          initialValues={inputValues}
+          formContext={{
+            showHandles: false,
+            size: "small",
+          }}
+        />
       </div>
 
-      <AnimatePresence initial={false}>
-        {showInputForm && buildInputSchema(output.agent.inputs) && (
-          <motion.div
-            initial={{ height: 0, opacity: 0, filter: "blur(6px)" }}
-            animate={{ height: "auto", opacity: 1, filter: "blur(0px)" }}
-            exit={{ height: 0, opacity: 0, filter: "blur(6px)" }}
-            transition={{
-              height: { type: "spring", bounce: 0.15, duration: 0.5 },
-              opacity: { duration: 0.25 },
-              filter: { duration: 0.2 },
-            }}
-            className="overflow-hidden"
-            style={{ willChange: "height, opacity, filter" }}
-          >
-            <div className="mt-4 rounded-2xl border bg-background p-3 pt-4">
-              <Text variant="body-medium">Enter your inputs</Text>
-              <FormRenderer
-                jsonSchema={buildInputSchema(output.agent.inputs)!}
-                handleChange={(v) => setInputValues(v.formData ?? {})}
-                uiSchema={{
-                  "ui:submitButtonOptions": { norender: true },
-                }}
-                initialValues={inputValues}
-                formContext={{
-                  showHandles: false,
-                  size: "small",
-                }}
-              />
-              <div className="-mt-8 flex gap-2">
-                <Button
-                  variant="primary"
-                  size="small"
-                  className="w-fit"
-                  onClick={handleRunWithInputs}
-                >
-                  Run
-                </Button>
-                <Button
-                  variant="secondary"
-                  size="small"
-                  className="w-fit"
-                  onClick={() => {
-                    setShowInputForm(false);
-                    setInputValues({});
-                  }}
-                >
-                  Cancel
-                </Button>
-              </div>
-            </div>
-          </motion.div>
-        )}
-      </AnimatePresence>
+      <div className="mt-4">
+        <Button
+          variant="primary"
+          size="small"
+          className="w-fit"
+          disabled={!valid}
+          onClick={handleProceed}
+        >
+          Proceed
+        </Button>
+      </div>
     </div>
   );
 }

autogpt_platform/frontend/src/app/(platform)/copilot/tools/RunAgent/components/AgentDetailsCard/helpers.ts

@@ -1,4 +1,5 @@
 import type { RJSFSchema } from "@rjsf/utils";
+import { customValidator } from "@/components/renderers/InputRenderer/utils/custom-validator";
 
 export function buildInputSchema(inputs: unknown): RJSFSchema | null {
   if (!inputs || typeof inputs !== "object") return null;
@@ -6,3 +7,31 @@ export function buildInputSchema(inputs: unknown): RJSFSchema | null {
   if (!properties || Object.keys(properties).length === 0) return null;
   return inputs as RJSFSchema;
 }
+
+export function extractDefaults(schema: RJSFSchema): Record<string, unknown> {
+  const defaults: Record<string, unknown> = {};
+  const props = schema.properties;
+  if (!props || typeof props !== "object") return defaults;
+
+  for (const [key, prop] of Object.entries(props)) {
+    if (typeof prop !== "object" || prop === null) continue;
+    if ("default" in prop && prop.default !== undefined) {
+      defaults[key] = prop.default;
+    } else if (
+      "examples" in prop &&
+      Array.isArray(prop.examples) &&
+      prop.examples.length > 0
+    ) {
+      defaults[key] = prop.examples[0];
+    }
+  }
+  return defaults;
+}
+
+export function isFormValid(
+  schema: RJSFSchema,
+  formData: Record<string, unknown>,
+): boolean {
+  const { errors } = customValidator.validateFormData(formData, schema);
+  return errors.length === 0;
+}

autogpt_platform/frontend/src/app/(platform)/copilot/tools/RunBlock/components/BlockDetailsCard/BlockDetailsCard.stories.tsx

@@ -1,188 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/nextjs";
-import { ResponseType } from "@/app/api/__generated__/models/responseType";
-import type { BlockDetailsResponse } from "../../helpers";
-import { BlockDetailsCard } from "./BlockDetailsCard";
-
-const meta: Meta<typeof BlockDetailsCard> = {
-  title: "Copilot/RunBlock/BlockDetailsCard",
-  component: BlockDetailsCard,
-  parameters: {
-    layout: "centered",
-  },
-  tags: ["autodocs"],
-  decorators: [
-    (Story) => (
-      <div style={{ maxWidth: 480 }}>
-        <Story />
-      </div>
-    ),
-  ],
-};
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-const baseBlock: BlockDetailsResponse = {
-  type: ResponseType.block_details,
-  message:
-    "Here are the details for the GetWeather block. Provide the required inputs to run it.",
-  session_id: "session-123",
-  user_authenticated: true,
-  block: {
-    id: "block-abc-123",
-    name: "GetWeather",
-    description: "Fetches current weather data for a given location.",
-    inputs: {
-      type: "object",
-      properties: {
-        location: {
-          title: "Location",
-          type: "string",
-          description:
-            "City name or coordinates (e.g. 'London' or '51.5,-0.1')",
-        },
-        units: {
-          title: "Units",
-          type: "string",
-          description: "Temperature units: 'metric' or 'imperial'",
-        },
-      },
-      required: ["location"],
-    },
-    outputs: {
-      type: "object",
-      properties: {
-        temperature: {
-          title: "Temperature",
-          type: "number",
-          description: "Current temperature in the requested units",
-        },
-        condition: {
-          title: "Condition",
-          type: "string",
-          description: "Weather condition description (e.g. 'Sunny', 'Rain')",
-        },
-      },
-    },
-    credentials: [],
-  },
-};
-
-export const Default: Story = {
-  args: {
-    output: baseBlock,
-  },
-};
-
-export const InputsOnly: Story = {
-  args: {
-    output: {
-      ...baseBlock,
-      message: "This block requires inputs. No outputs are defined.",
-      block: {
-        ...baseBlock.block,
-        outputs: {},
-      },
-    },
-  },
-};
-
-export const OutputsOnly: Story = {
-  args: {
-    output: {
-      ...baseBlock,
-      message: "This block has no required inputs.",
-      block: {
-        ...baseBlock.block,
-        inputs: {},
-      },
-    },
-  },
-};
-
-export const ManyFields: Story = {
-  args: {
-    output: {
-      ...baseBlock,
-      message: "Block with many input and output fields.",
-      block: {
-        ...baseBlock.block,
-        name: "SendEmail",
-        description: "Sends an email via SMTP.",
-        inputs: {
-          type: "object",
-          properties: {
-            to: {
-              title: "To",
-              type: "string",
-              description: "Recipient email address",
-            },
-            subject: {
-              title: "Subject",
-              type: "string",
-              description: "Email subject line",
-            },
-            body: {
-              title: "Body",
-              type: "string",
-              description: "Email body content",
-            },
-            cc: {
-              title: "CC",
-              type: "string",
-              description: "CC recipients (comma-separated)",
-            },
-            bcc: {
-              title: "BCC",
-              type: "string",
-              description: "BCC recipients (comma-separated)",
-            },
-          },
-          required: ["to", "subject", "body"],
-        },
-        outputs: {
-          type: "object",
-          properties: {
-            message_id: {
-              title: "Message ID",
-              type: "string",
-              description: "Unique ID of the sent email",
-            },
-            status: {
-              title: "Status",
-              type: "string",
-              description: "Delivery status",
-            },
-          },
-        },
-      },
-    },
-  },
-};
-
-export const NoFieldDescriptions: Story = {
-  args: {
-    output: {
-      ...baseBlock,
-      message: "Fields without descriptions.",
-      block: {
-        ...baseBlock.block,
-        name: "SimpleBlock",
-        inputs: {
-          type: "object",
-          properties: {
-            input_a: { title: "Input A", type: "string" },
-            input_b: { title: "Input B", type: "number" },
-          },
-          required: ["input_a"],
-        },
-        outputs: {
-          type: "object",
-          properties: {
-            result: { title: "Result", type: "string" },
-          },
-        },
-      },
-    },
-  },
-};

autogpt_platform/frontend/src/app/(platform)/copilot/tools/RunBlock/components/SetupRequirementsCard/SetupRequirementsCard.tsx

@@ -134,7 +134,7 @@ export function SetupRequirementsCard({ output }: Props) {
         <Button
           variant="primary"
           size="small"
-          className="w-fit"
+          className="mt-4 w-fit"
           disabled={!canRun}
           onClick={handleRun}
         >

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

@@ -18,7 +18,7 @@ export function useChatSession() {
   const sessionQuery = useGetV2GetSession(sessionId ?? "", {
     query: {
       enabled: !!sessionId,
-      staleTime: Infinity,
+      staleTime: Infinity, // Manual invalidation on session switch
       refetchOnWindowFocus: false,
       refetchOnReconnect: true,
       refetchOnMount: true,
@@ -47,7 +47,7 @@ export function useChatSession() {
   const hasActiveStream = useMemo(() => {
     if (sessionQuery.data?.status !== 200) return false;
     return !!sessionQuery.data.data.active_stream;
-  }, [sessionQuery.data]);
+  }, [sessionQuery.data, sessionId]);
 
   // Memoize so the effect in useCopilotPage doesn't infinite-loop on a new
   // array reference every render. Re-derives only when query data changes.
@@ -119,5 +119,6 @@ export function useChatSession() {
     isSessionError: sessionQuery.isError,
     createSession,
     isCreatingSession,
+    refetchSession: sessionQuery.refetch,
   };
 }

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

@@ -15,7 +15,9 @@ import type { UIMessage } from "ai";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { useChatSession } from "./useChatSession";
 
-const STREAM_START_TIMEOUT_MS = 12_000;
+const RECONNECT_BASE_DELAY_MS = 1_000;
+const RECONNECT_MAX_DELAY_MS = 30_000;
+const RECONNECT_MAX_ATTEMPTS = 5;
 
 /** Mark any in-progress tool parts as completed/errored so spinners stop. */
 function resolveInProgressTools(
@@ -35,42 +37,12 @@ function resolveInProgressTools(
   }));
 }
 
-/** Build a fingerprint from a message's role + text/tool content for cross-boundary dedup. */
-function messageFingerprint(msg: UIMessage): string {
-  const fragments = msg.parts.map((p) => {
-    if ("text" in p && typeof p.text === "string") return p.text;
-    if ("toolCallId" in p && typeof p.toolCallId === "string")
-      return `tool:${p.toolCallId}`;
-    return "";
-  });
-  return `${msg.role}::${fragments.join("\n")}`;
-}
-
-/**
- * Deduplicate messages by ID *and* by content fingerprint.
- * ID-based dedup catches duplicates within the same source (e.g. two
- * identical stream events).  Fingerprint-based dedup catches duplicates
- * across the hydration/stream boundary where IDs differ (synthetic
- * `${sessionId}-${index}` vs AI SDK nanoid).
- *
- * NOTE: Fingerprint dedup only applies to assistant messages, not user messages.
- * Users should be able to send the same message multiple times.
- */
+/** Simple ID-based deduplication - trust backend for correctness */
 function deduplicateMessages(messages: UIMessage[]): UIMessage[] {
   const seenIds = new Set<string>();
-  const seenFingerprints = new Set<string>();
   return messages.filter((msg) => {
     if (seenIds.has(msg.id)) return false;
     seenIds.add(msg.id);
-
-    // Only apply fingerprint deduplication to assistant messages
-    // User messages should allow duplicates (same text sent multiple times)
-    if (msg.role === "assistant") {
-      const fp = messageFingerprint(msg);
-      if (fp !== "::" && seenFingerprints.has(fp)) return false;
-      seenFingerprints.add(fp);
-    }
-
     return true;
   });
 }
@@ -94,6 +66,7 @@ export function useCopilotPage() {
     isSessionError,
     createSession,
     isCreatingSession,
+    refetchSession,
   } = useChatSession();
 
   const { mutate: deleteSessionMutation, isPending: isDeleting } =
@@ -153,6 +126,48 @@ export function useCopilotPage() {
     [sessionId],
   );
 
+  // Reconnect state
+  const [reconnectAttempts, setReconnectAttempts] = useState(0);
+  const [isReconnectScheduled, setIsReconnectScheduled] = useState(false);
+  const reconnectTimerRef = useRef<ReturnType<typeof setTimeout>>();
+  const hasShownDisconnectToast = useRef(false);
+
+  // Consolidated reconnect logic
+  function handleReconnect(sid: string) {
+    if (isReconnectScheduled || !sid) return;
+
+    const nextAttempt = reconnectAttempts + 1;
+    if (nextAttempt > RECONNECT_MAX_ATTEMPTS) {
+      toast({
+        title: "Connection lost",
+        description: "Unable to reconnect. Please refresh the page.",
+        variant: "destructive",
+      });
+      return;
+    }
+
+    setIsReconnectScheduled(true);
+    setReconnectAttempts(nextAttempt);
+
+    if (!hasShownDisconnectToast.current) {
+      hasShownDisconnectToast.current = true;
+      toast({
+        title: "Connection lost",
+        description: "Reconnecting...",
+      });
+    }
+
+    const delay = Math.min(
+      RECONNECT_BASE_DELAY_MS * 2 ** reconnectAttempts,
+      RECONNECT_MAX_DELAY_MS,
+    );
+
+    reconnectTimerRef.current = setTimeout(() => {
+      setIsReconnectScheduled(false);
+      resumeStream();
+    }, delay);
+  }
+
   const {
     messages: rawMessages,
     sendMessage,
@@ -164,9 +179,32 @@ export function useCopilotPage() {
   } = useChat({
     id: sessionId ?? undefined,
     transport: transport ?? undefined,
-    // Don't use resume: true — it fires before hydration completes, causing
-    // the hydrated messages to overwrite the resumed stream.  Instead we
-    // call resumeStream() manually after hydration + active_stream detection.
+    onFinish: async ({ isDisconnect, isAbort }) => {
+      if (isAbort || !sessionId) return;
+
+      if (isDisconnect) {
+        handleReconnect(sessionId);
+        return;
+      }
+
+      // Check if backend executor is still running after clean close
+      const result = await refetchSession();
+      const backendActive =
+        result.data?.status === 200 && !!result.data.data.active_stream;
+
+      if (backendActive) {
+        handleReconnect(sessionId);
+      }
+    },
+    onError: (error) => {
+      if (!sessionId) return;
+      // Only reconnect on network errors (not HTTP errors)
+      const isNetworkError =
+        error.name === "TypeError" || error.name === "AbortError";
+      if (isNetworkError) {
+        handleReconnect(sessionId);
+      }
+    },
   });
 
   // Deduplicate messages continuously to prevent duplicates when resuming streams
@@ -205,44 +243,31 @@ export function useCopilotPage() {
     }
   }
 
-  // Abort the stream if the backend doesn't start sending data within 12s.
-  const stopRef = useRef(stop);
-  stopRef.current = stop;
-  useEffect(() => {
-    if (status !== "submitted") return;
-
-    const timer = setTimeout(() => {
-      stopRef.current();
-      toast({
-        title: "Stream timed out",
-        description: "The server took too long to respond. Please try again.",
-        variant: "destructive",
-      });
-    }, STREAM_START_TIMEOUT_MS);
-
-    return () => clearTimeout(timer);
-  }, [status]);
-
-  // Hydrate messages from the REST session endpoint.
-  // Skip hydration while streaming to avoid overwriting the live stream.
+  // Hydrate messages from REST API when not actively streaming
   useEffect(() => {
     if (!hydratedMessages || hydratedMessages.length === 0) return;
     if (status === "streaming" || status === "submitted") return;
+    if (isReconnectScheduled) return;
     setMessages((prev) => {
       if (prev.length >= hydratedMessages.length) return prev;
-      // Deduplicate to handle rare cases where duplicate streams might occur
       return deduplicateMessages(hydratedMessages);
     });
-  }, [hydratedMessages, setMessages, status]);
+  }, [hydratedMessages, setMessages, status, isReconnectScheduled]);
 
-  // Ref: tracks whether we've already resumed for a given session.
-  // Format: Map<sessionId, hasResumed>
+  // Track resume state per session
   const hasResumedRef = useRef<Map<string, boolean>>(new Map());
 
-  // When the stream ends (or drops), invalidate the session cache so the
-  // next hydration fetches fresh messages from the backend.  Without this,
-  // staleTime: Infinity means the cache keeps the pre-stream data forever,
-  // and any messages added during streaming are lost on remount/navigation.
+  // Clean up reconnect state on session switch
+  useEffect(() => {
+    clearTimeout(reconnectTimerRef.current);
+    reconnectTimerRef.current = undefined;
+    setReconnectAttempts(0);
+    setIsReconnectScheduled(false);
+    hasShownDisconnectToast.current = false;
+    prevStatusRef.current = status; // Reset to avoid cross-session state bleeding
+  }, [sessionId, status]);
+
+  // Invalidate session cache when stream completes
   const prevStatusRef = useRef(status);
   useEffect(() => {
     const prev = prevStatusRef.current;
@@ -250,12 +275,17 @@ export function useCopilotPage() {
 
     const wasActive = prev === "streaming" || prev === "submitted";
     const isIdle = status === "ready" || status === "error";
-    if (wasActive && isIdle && sessionId) {
+
+    if (wasActive && isIdle && sessionId && !isReconnectScheduled) {
       queryClient.invalidateQueries({
         queryKey: getGetV2GetSessionQueryKey(sessionId),
       });
+      if (status === "ready") {
+        setReconnectAttempts(0);
+        hasShownDisconnectToast.current = false;
+      }
     }
-  }, [status, sessionId, queryClient]);
+  }, [status, sessionId, queryClient, isReconnectScheduled]);
 
   // Resume an active stream AFTER hydration completes.
   // IMPORTANT: Only runs when page loads with existing active stream (reconnection).
@@ -352,16 +382,16 @@ export function useCopilotPage() {
     }
   }, [isDeleting]);
 
-  // True while we know the backend has an active stream but haven't
-  // reconnected yet.  Used to disable the send button and show stop UI.
+  // True while reconnecting or backend has active stream but we haven't connected yet
   const isReconnecting =
-    hasActiveStream && status !== "streaming" && status !== "submitted";
+    isReconnectScheduled ||
+    (hasActiveStream && status !== "streaming" && status !== "submitted");
 
   return {
     sessionId,
     messages,
     status,
-    error,
+    error: isReconnecting ? undefined : error,
     stop,
     isReconnecting,
     isLoadingSession,

autogpt_platform/frontend/src/app/(platform)/library/components/FavoritesSection/FavoritesSection.tsx

@@ -1,17 +1,31 @@
 "use client";
 
 import { LibraryAgent } from "@/app/api/__generated__/models/libraryAgent";
+import { LibraryAgentSort } from "@/app/api/__generated__/models/libraryAgentSort";
 import { Text } from "@/components/atoms/Text/Text";
+import { LoadingSpinner } from "@/components/atoms/LoadingSpinner/LoadingSpinner";
 import { InfiniteScroll } from "@/components/contextual/InfiniteScroll/InfiniteScroll";
 import { HeartIcon } from "@phosphor-icons/react";
 import { useFavoriteAgents } from "../../hooks/useFavoriteAgents";
 import { LibraryAgentCard } from "../LibraryAgentCard/LibraryAgentCard";
+import { LibraryTabs, Tab } from "../LibraryTabs/LibraryTabs";
+import { LibraryActionSubHeader } from "../LibraryActionSubHeader/LibraryActionSubHeader";
 
 interface Props {
   searchTerm: string;
+  tabs: Tab[];
+  activeTab: string;
+  onTabChange: (tabId: string) => void;
+  setLibrarySort: (value: LibraryAgentSort) => void;
 }
 
-export function FavoritesSection({ searchTerm }: Props) {
+export function FavoritesSection({
+  searchTerm,
+  tabs,
+  activeTab,
+  onTabChange,
+  setLibrarySort,
+}: Props) {
   const {
     allAgents: favoriteAgents,
     agentLoading: isLoading,
@@ -21,38 +35,33 @@ export function FavoritesSection({ searchTerm }: Props) {
     isFetchingNextPage,
   } = useFavoriteAgents({ searchTerm });
 
-  if (isLoading || favoriteAgents.length === 0) {
-    return null;
-  }
-
   return (
-    <div className="!mb-8">
-      <div className="mb-3 flex items-center gap-2 p-2">
-        <HeartIcon className="h-5 w-5" weight="fill" />
-        <div className="flex items-baseline gap-2">
-          <Text variant="h4">Favorites</Text>
-          {!isLoading && (
-            <Text
-              variant="body"
-              data-testid="agents-count"
-              className="relative bottom-px text-zinc-500"
-            >
-              {agentCount}
-            </Text>
-          )}
-        </div>
-      </div>
+    <>
+      <LibraryActionSubHeader
+        agentCount={agentCount}
+        setLibrarySort={setLibrarySort}
+      />
+      <LibraryTabs
+        tabs={tabs}
+        activeTab={activeTab}
+        onTabChange={onTabChange}
+      />
 
-      <div className="relative">
+      {isLoading ? (
+        <div className="flex h-[200px] items-center justify-center">
+          <LoadingSpinner size="large" />
+        </div>
+      ) : favoriteAgents.length === 0 ? (
+        <div className="flex h-[200px] flex-col items-center justify-center gap-2 text-zinc-500">
+          <HeartIcon className="h-10 w-10" />
+          <Text variant="body">No favorite agents yet</Text>
+        </div>
+      ) : (
         <InfiniteScroll
           isFetchingNextPage={isFetchingNextPage}
           fetchNextPage={fetchNextPage}
           hasNextPage={hasNextPage}
-          loader={
-            <div className="flex h-8 w-full items-center justify-center">
-              <div className="h-6 w-6 animate-spin rounded-full border-b-2 border-t-2 border-neutral-800" />
-            </div>
-          }
+          loader={<LoadingSpinner size="medium" />}
         >
           <div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
             {favoriteAgents.map((agent: LibraryAgent) => (
@@ -60,9 +69,7 @@ export function FavoritesSection({ searchTerm }: Props) {
             ))}
           </div>
         </InfiniteScroll>
-      </div>
-
-      {favoriteAgents.length > 0 && <div className="!mt-10 border-t" />}
-    </div>
+      )}
+    </>
   );
 }

autogpt_platform/frontend/src/app/(platform)/library/components/FlyingHeart/FlyingHeart.tsx

@@ -0,0 +1,71 @@
+"use client";
+
+import { motion, AnimatePresence, useReducedMotion } from "framer-motion";
+import { HeartIcon } from "@phosphor-icons/react";
+import { useEffect, useState } from "react";
+
+interface FlyingHeartProps {
+  startPosition: { x: number; y: number } | null;
+  targetPosition: { x: number; y: number } | null;
+  onAnimationComplete: () => void;
+}
+
+export function FlyingHeart({
+  startPosition,
+  targetPosition,
+  onAnimationComplete,
+}: FlyingHeartProps) {
+  const [isVisible, setIsVisible] = useState(false);
+  const shouldReduceMotion = useReducedMotion();
+
+  useEffect(() => {
+    if (startPosition && targetPosition) {
+      setIsVisible(true);
+    }
+  }, [startPosition, targetPosition]);
+
+  if (!startPosition || !targetPosition) return null;
+
+  return (
+    <AnimatePresence>
+      {isVisible && (
+        <motion.div
+          className="pointer-events-none fixed z-50"
+          initial={{
+            x: startPosition.x,
+            y: startPosition.y,
+            scale: 1,
+            opacity: 1,
+          }}
+          animate={{
+            x: shouldReduceMotion ? targetPosition.x : targetPosition.x,
+            y: shouldReduceMotion ? targetPosition.y : targetPosition.y,
+            scale: 0.5,
+            opacity: 0,
+          }}
+          exit={{ opacity: 0 }}
+          transition={
+            shouldReduceMotion
+              ? { duration: 0 }
+              : {
+                  type: "spring",
+                  damping: 20,
+                  stiffness: 200,
+                  duration: 0.5,
+                }
+          }
+          onAnimationComplete={() => {
+            setIsVisible(false);
+            onAnimationComplete();
+          }}
+        >
+          <HeartIcon
+            size={24}
+            weight="fill"
+            className="text-red-500 drop-shadow-md"
+          />
+        </motion.div>
+      )}
+    </AnimatePresence>
+  );
+}

autogpt_platform/frontend/src/app/(platform)/library/components/LazyEmojiPicker.tsx

@@ -0,0 +1,25 @@
+"use client";
+
+import { EmojiPicker } from "@ferrucc-io/emoji-picker";
+
+interface Props {
+  onEmojiSelect: (emoji: string) => void;
+  containerHeight?: number;
+}
+
+export function LazyEmojiPicker({
+  onEmojiSelect,
+  containerHeight = 295,
+}: Props) {
+  return (
+    <EmojiPicker
+      onEmojiSelect={onEmojiSelect}
+      emojiSize={32}
+      className="w-full rounded-2xl px-2"
+    >
+      <EmojiPicker.Group>
+        <EmojiPicker.List hideStickyHeader containerHeight={containerHeight} />
+      </EmojiPicker.Group>
+    </EmojiPicker>
+  );
+}

autogpt_platform/frontend/src/app/(platform)/library/components/LibraryActionSubHeader/LibraryActionSubHeader.tsx

@@ -13,7 +13,7 @@ export function LibraryActionSubHeader({ agentCount, setLibrarySort }: Props) {
   return (
     <div className="flex items-baseline justify-between">
       <div className="flex items-baseline gap-4">
-        <Text variant="h4">My agents</Text>
+        <Text variant="h5">My agents</Text>
         <Text
           variant="body"
           data-testid="agents-count"

autogpt_platform/frontend/src/app/(platform)/library/components/LibraryAgentCard/LibraryAgentCard.tsx

@@ -4,6 +4,7 @@ import { Text } from "@/components/atoms/Text/Text";
 import { CaretCircleRightIcon } from "@phosphor-icons/react";
 import Image from "next/image";
 import NextLink from "next/link";
+import { motion } from "framer-motion";
 
 import { LibraryAgent } from "@/app/api/__generated__/models/libraryAgent";
 import Avatar, {
@@ -14,13 +15,21 @@ import { Link } from "@/components/atoms/Link/Link";
 import { AgentCardMenu } from "./components/AgentCardMenu";
 import { FavoriteButton } from "./components/FavoriteButton";
 import { useLibraryAgentCard } from "./useLibraryAgentCard";
+import { useFavoriteAnimation } from "../../context/FavoriteAnimationContext";
 
 interface Props {
   agent: LibraryAgent;
+  draggable?: boolean;
 }
 
-export function LibraryAgentCard({ agent }: Props) {
+export function LibraryAgentCard({ agent, draggable = true }: Props) {
   const { id, name, graph_id, can_access_graph, image_url } = agent;
+  const { triggerFavoriteAnimation } = useFavoriteAnimation();
+
+  function handleDragStart(e: React.DragEvent<HTMLDivElement>) {
+    e.dataTransfer.setData("application/agent-id", id);
+    e.dataTransfer.effectAllowed = "move";
+  }
 
   const {
     isFromMarketplace,
@@ -28,103 +37,119 @@ export function LibraryAgentCard({ agent }: Props) {
     profile,
     creator_image_url,
     handleToggleFavorite,
-  } = useLibraryAgentCard({ agent });
+  } = useLibraryAgentCard({
+    agent,
+    onFavoriteAdd: triggerFavoriteAnimation,
+  });
 
   return (
     <div
-      data-testid="library-agent-card"
-      data-agent-id={id}
-      className="group relative inline-flex h-[10.625rem] w-full max-w-[25rem] flex-col items-start justify-start gap-2.5 rounded-medium border border-zinc-100 bg-white transition-all duration-300 hover:shadow-md"
+      draggable={draggable}
+      onDragStart={handleDragStart}
+      className="[@media(pointer:fine)]:cursor-grab [@media(pointer:fine)]:active:cursor-grabbing"
     >
-      <NextLink href={`/library/agents/${id}`} className="flex-shrink-0">
-        <div className="relative flex items-center gap-2 px-4 pt-3">
-          <Avatar className="h-4 w-4 rounded-full">
-            <AvatarImage
-              src={
-                isFromMarketplace
-                  ? creator_image_url || "/avatar-placeholder.png"
-                  : profile?.avatar_url || "/avatar-placeholder.png"
-              }
-              alt={`${name} creator avatar`}
-            />
-            <AvatarFallback size={48}>{name.charAt(0)}</AvatarFallback>
-          </Avatar>
-          <Text
-            variant="small-medium"
-            className="uppercase tracking-wide text-zinc-400"
-          >
-            {isFromMarketplace ? "FROM MARKETPLACE" : "Built by you"}
-          </Text>
-        </div>
-      </NextLink>
-      <FavoriteButton
-        isFavorite={isFavorite}
-        onClick={handleToggleFavorite}
-        className="absolute right-10 top-0"
-      />
-      <AgentCardMenu agent={agent} />
+      <motion.div
+        layoutId={`agent-card-${id}`}
+        data-testid="library-agent-card"
+        data-agent-id={id}
+        className="group relative inline-flex h-[10.625rem] w-full max-w-[25rem] flex-col items-start justify-start gap-2.5 rounded-medium border border-zinc-100 bg-white hover:shadow-md"
+        transition={{
+          type: "spring",
+          damping: 25,
+          stiffness: 300,
+        }}
+        style={{ willChange: "transform" }}
+      >
+        <NextLink href={`/library/agents/${id}`} className="flex-shrink-0">
+          <div className="relative flex items-center gap-2 px-4 pt-3">
+            <Avatar className="h-4 w-4 rounded-full">
+              <AvatarImage
+                src={
+                  isFromMarketplace
+                    ? creator_image_url || "/avatar-placeholder.png"
+                    : profile?.avatar_url || "/avatar-placeholder.png"
+                }
+                alt={`${name} creator avatar`}
+              />
+              <AvatarFallback size={48}>{name.charAt(0)}</AvatarFallback>
+            </Avatar>
+            <Text
+              variant="small-medium"
+              className="uppercase tracking-wide text-zinc-400"
+            >
+              {isFromMarketplace ? "FROM MARKETPLACE" : "Built by you"}
+            </Text>
+          </div>
+        </NextLink>
+        <FavoriteButton
+          isFavorite={isFavorite}
+          onClick={handleToggleFavorite}
+          className="absolute right-10 top-0"
+        />
+        <AgentCardMenu agent={agent} />
 
-      <div className="flex w-full flex-1 flex-col px-4 pb-2">
-        <Link
-          href={`/library/agents/${id}`}
-          className="flex w-full items-start justify-between gap-2 no-underline hover:no-underline"
-        >
-          <Text
-            variant="h5"
-            data-testid="library-agent-card-name"
-            className="line-clamp-3 hyphens-auto break-words no-underline hover:no-underline"
-          >
-            {name}
-          </Text>
-
-          {!image_url ? (
-            <div
-              className={`h-[3.64rem] w-[6.70rem] flex-shrink-0 rounded-small ${
-                [
-                  "bg-gradient-to-r from-green-200 to-blue-200",
-                  "bg-gradient-to-r from-pink-200 to-purple-200",
-                  "bg-gradient-to-r from-yellow-200 to-orange-200",
-                  "bg-gradient-to-r from-blue-200 to-cyan-200",
-                  "bg-gradient-to-r from-indigo-200 to-purple-200",
-                ][parseInt(id.slice(0, 8), 16) % 5]
-              }`}
-              style={{
-                backgroundSize: "200% 200%",
-                animation: "gradient 15s ease infinite",
-              }}
-            />
-          ) : (
-            <Image
-              src={image_url}
-              alt={`${name} preview image`}
-              width={107}
-              height={58}
-              className="flex-shrink-0 rounded-small object-cover"
-            />
-          )}
-        </Link>
-
-        <div className="mt-auto flex w-full justify-start gap-6 border-t border-zinc-100 pb-1 pt-3">
+        <div className="flex w-full flex-1 flex-col px-4 pb-2">
           <Link
             href={`/library/agents/${id}`}
-            data-testid="library-agent-card-see-runs-link"
-            className="flex items-center gap-1 text-[13px]"
+            className="flex w-full items-start justify-between gap-2 no-underline hover:no-underline focus:ring-0"
           >
-            See runs <CaretCircleRightIcon size={20} />
+            <Text
+              variant="h5"
+              data-testid="library-agent-card-name"
+              className="line-clamp-3 hyphens-auto break-words no-underline hover:no-underline"
+            >
+              {name}
+            </Text>
+
+            {!image_url ? (
+              <div
+                className={`h-[3.64rem] w-[6.70rem] flex-shrink-0 rounded-small ${
+                  [
+                    "bg-gradient-to-r from-green-200 to-blue-200",
+                    "bg-gradient-to-r from-pink-200 to-purple-200",
+                    "bg-gradient-to-r from-yellow-200 to-orange-200",
+                    "bg-gradient-to-r from-blue-200 to-cyan-200",
+                    "bg-gradient-to-r from-indigo-200 to-purple-200",
+                  ][parseInt(id.slice(0, 8), 16) % 5]
+                }`}
+                style={{
+                  backgroundSize: "200% 200%",
+                  animation: "gradient 15s ease infinite",
+                }}
+              />
+            ) : (
+              <Image
+                src={image_url}
+                alt={`${name} preview image`}
+                width={107}
+                height={58}
+                className="flex-shrink-0 rounded-small object-cover"
+              />
+            )}
           </Link>
 
-          {can_access_graph && (
+          <div className="mt-auto flex w-full justify-start gap-6 border-t border-zinc-100 pb-1 pt-3">
             <Link
-              href={`/build?flowID=${graph_id}`}
-              data-testid="library-agent-card-open-in-builder-link"
+              href={`/library/agents/${id}`}
+              data-testid="library-agent-card-see-runs-link"
               className="flex items-center gap-1 text-[13px]"
-              isExternal
             >
-              Open in builder <CaretCircleRightIcon size={20} />
+              See runs <CaretCircleRightIcon size={20} />
             </Link>
-          )}
+
+            {can_access_graph && (
+              <Link
+                href={`/build?flowID=${graph_id}`}
+                data-testid="library-agent-card-open-in-builder-link"
+                className="flex items-center gap-1 text-[13px]"
+                isExternal
+              >
+                Open in builder <CaretCircleRightIcon size={20} />
+              </Link>
+            )}
+          </div>
         </div>
-      </div>
+      </motion.div>
     </div>
   );
 }

autogpt_platform/frontend/src/app/(platform)/library/components/LibraryAgentCard/components/AgentCardMenu.tsx

@@ -5,6 +5,10 @@ import {
   useDeleteV2DeleteLibraryAgent,
   usePostV2ForkLibraryAgent,
 } from "@/app/api/__generated__/endpoints/library/library";
+import {
+  usePostV2BulkMoveAgents,
+  getGetV2ListLibraryFoldersQueryKey,
+} from "@/app/api/__generated__/endpoints/folders/folders";
 import { LibraryAgent } from "@/app/api/__generated__/models/libraryAgent";
 import { Button } from "@/components/atoms/Button/Button";
 import { Text } from "@/components/atoms/Text/Text";
@@ -22,6 +26,7 @@ import { useQueryClient } from "@tanstack/react-query";
 import Link from "next/link";
 import { useRouter } from "next/navigation";
 import { useState } from "react";
+import { MoveToFolderDialog } from "../../MoveToFolderDialog/MoveToFolderDialog";
 
 interface AgentCardMenuProps {
   agent: LibraryAgent;
@@ -32,11 +37,25 @@ export function AgentCardMenu({ agent }: AgentCardMenuProps) {
   const queryClient = useQueryClient();
   const router = useRouter();
   const [showDeleteDialog, setShowDeleteDialog] = useState(false);
+  const [showMoveDialog, setShowMoveDialog] = useState(false);
   const [isDeletingAgent, setIsDeletingAgent] = useState(false);
   const [isDuplicatingAgent, setIsDuplicatingAgent] = useState(false);
+  const [isRemovingFromFolder, setIsRemovingFromFolder] = useState(false);
 
   const { mutateAsync: deleteAgent } = useDeleteV2DeleteLibraryAgent();
   const { mutateAsync: forkAgent } = usePostV2ForkLibraryAgent();
+  const { mutateAsync: bulkMoveAgents } = usePostV2BulkMoveAgents({
+    mutation: {
+      onSuccess: () => {
+        queryClient.invalidateQueries({
+          queryKey: getGetV2ListLibraryAgentsQueryKey(),
+        });
+        queryClient.invalidateQueries({
+          queryKey: getGetV2ListLibraryFoldersQueryKey(),
+        });
+      },
+    },
+  });
 
   async function handleDuplicateAgent() {
     if (!agent.id) return;
@@ -70,6 +89,37 @@ export function AgentCardMenu({ agent }: AgentCardMenuProps) {
     }
   }
 
+  async function handleRemoveFromFolder() {
+    if (!agent.id) return;
+
+    setIsRemovingFromFolder(true);
+
+    try {
+      await bulkMoveAgents({
+        data: {
+          agent_ids: [agent.id],
+          folder_id: null,
+        },
+      });
+
+      toast({
+        title: "Removed from folder",
+        description: "Agent has been moved back to your library.",
+      });
+    } catch (error: unknown) {
+      toast({
+        title: "Failed to remove from folder",
+        description:
+          error instanceof Error
+            ? error.message
+            : "An unexpected error occurred.",
+        variant: "destructive",
+      });
+    } finally {
+      setIsRemovingFromFolder(false);
+    }
+  }
+
   async function handleDeleteAgent() {
     if (!agent.id) return;
 
@@ -138,6 +188,31 @@ export function AgentCardMenu({ agent }: AgentCardMenuProps) {
             Duplicate agent
           </DropdownMenuItem>
           <DropdownMenuSeparator />
+          <DropdownMenuItem
+            onClick={(e) => {
+              e.stopPropagation();
+              setShowMoveDialog(true);
+            }}
+            className="flex items-center gap-2"
+          >
+            Move to folder
+          </DropdownMenuItem>
+          {agent.folder_id && (
+            <>
+              <DropdownMenuSeparator />
+              <DropdownMenuItem
+                onClick={(e) => {
+                  e.stopPropagation();
+                  handleRemoveFromFolder();
+                }}
+                disabled={isRemovingFromFolder}
+                className="flex items-center gap-2"
+              >
+                Remove from folder
+              </DropdownMenuItem>
+            </>
+          )}
+          <DropdownMenuSeparator />
           <DropdownMenuItem
             onClick={(e) => {
               e.stopPropagation();
@@ -183,6 +258,14 @@ export function AgentCardMenu({ agent }: AgentCardMenuProps) {
           </div>
         </Dialog.Content>
       </Dialog>
+
+      <MoveToFolderDialog
+        agentId={agent.id}
+        agentName={agent.name}
+        currentFolderId={agent.folder_id}
+        isOpen={showMoveDialog}
+        setIsOpen={setShowMoveDialog}
+      />
     </>
   );
 }

autogpt_platform/frontend/src/app/(platform)/library/components/LibraryAgentCard/components/FavoriteButton.tsx

@@ -3,10 +3,15 @@
 import { cn } from "@/lib/utils";
 import { HeartIcon } from "@phosphor-icons/react";
 import type { MouseEvent } from "react";
+import { useRef } from "react";
+import { motion, AnimatePresence } from "framer-motion";
 
 interface FavoriteButtonProps {
   isFavorite: boolean;
-  onClick: (e: MouseEvent<HTMLButtonElement>) => void;
+  onClick: (
+    e: MouseEvent<HTMLButtonElement>,
+    position: { x: number; y: number },
+  ) => void;
   className?: string;
 }
 
@@ -15,25 +20,49 @@ export function FavoriteButton({
   onClick,
   className,
 }: FavoriteButtonProps) {
+  const buttonRef = useRef<HTMLButtonElement>(null);
+
+  function handleClick(e: MouseEvent<HTMLButtonElement>) {
+    const rect = buttonRef.current?.getBoundingClientRect();
+    const position = rect
+      ? {
+          x: rect.left + rect.width / 2 - 12,
+          y: rect.top + rect.height / 2 - 12,
+        }
+      : { x: 0, y: 0 };
+    onClick(e, position);
+  }
+
   return (
     <button
-      onClick={onClick}
+      ref={buttonRef}
+      onClick={handleClick}
       className={cn(
         "rounded-full p-2 transition-all duration-200",
-        "hover:scale-110",
+        "hover:scale-110 active:scale-95",
         !isFavorite && "opacity-0 group-hover:opacity-100",
         className,
       )}
       aria-label={isFavorite ? "Remove from favorites" : "Add to favorites"}
     >
-      <HeartIcon
-        size={20}
-        weight={isFavorite ? "fill" : "regular"}
-        className={cn(
-          "transition-colors duration-200",
-          isFavorite ? "text-red-500" : "text-gray-600 hover:text-red-500",
-        )}
-      />
+      <AnimatePresence mode="wait" initial={false}>
+        <motion.div
+          key={isFavorite ? "filled" : "empty"}
+          initial={{ scale: 0.5, opacity: 0 }}
+          animate={{ scale: 1, opacity: 1 }}
+          exit={{ scale: 0.5, opacity: 0 }}
+          transition={{ type: "spring", damping: 15, stiffness: 300 }}
+        >
+          <HeartIcon
+            size={20}
+            weight={isFavorite ? "fill" : "regular"}
+            className={cn(
+              "transition-colors duration-200",
+              isFavorite ? "text-red-500" : "text-gray-600 hover:text-red-500",
+            )}
+          />
+        </motion.div>
+      </AnimatePresence>
     </button>
   );
 }

autogpt_platform/frontend/src/app/(platform)/library/components/LibraryAgentCard/useLibraryAgentCard.ts

@@ -14,11 +14,11 @@ import { updateFavoriteInQueries } from "./helpers";
 
 interface Props {
   agent: LibraryAgent;
+  onFavoriteAdd?: (position: { x: number; y: number }) => void;
 }
 
-export function useLibraryAgentCard({ agent }: Props) {
-  const { id, name, is_favorite, creator_image_url, marketplace_listing } =
-    agent;
+export function useLibraryAgentCard({ agent, onFavoriteAdd }: Props) {
+  const { id, is_favorite, creator_image_url, marketplace_listing } = agent;
 
   const isFromMarketplace = Boolean(marketplace_listing);
   const [isFavorite, setIsFavorite] = useState(is_favorite);
@@ -49,26 +49,31 @@ export function useLibraryAgentCard({ agent }: Props) {
     });
   }
 
-  async function handleToggleFavorite(e: React.MouseEvent) {
+  async function handleToggleFavorite(
+    e: React.MouseEvent,
+    position: { x: number; y: number },
+  ) {
     e.preventDefault();
     e.stopPropagation();
 
     const newIsFavorite = !isFavorite;
 
+    // Optimistic update - update UI immediately
     setIsFavorite(newIsFavorite);
     updateQueryData(newIsFavorite);
 
+    // Trigger animation immediately for adding to favorites
+    if (newIsFavorite && onFavoriteAdd) {
+      onFavoriteAdd(position);
+    }
+
     try {
       await updateLibraryAgent({
         libraryAgentId: id,
         data: { is_favorite: newIsFavorite },
       });
-
-      toast({
-        title: newIsFavorite ? "Added to favorites" : "Removed from favorites",
-        description: `${name} has been ${newIsFavorite ? "added to" : "removed from"} your favorites.`,
-      });
     } catch {
+      // Revert on failure
       setIsFavorite(!newIsFavorite);
       updateQueryData(!newIsFavorite);
 

autogpt_platform/frontend/src/app/(platform)/library/components/LibraryAgentList/LibraryAgentList.tsx

@@ -1,30 +1,123 @@
 "use client";
+
 import { LibraryAgentSort } from "@/app/api/__generated__/models/libraryAgentSort";
 import { LoadingSpinner } from "@/components/atoms/LoadingSpinner/LoadingSpinner";
 import { InfiniteScroll } from "@/components/contextual/InfiniteScroll/InfiniteScroll";
 import { LibraryActionSubHeader } from "../LibraryActionSubHeader/LibraryActionSubHeader";
 import { LibraryAgentCard } from "../LibraryAgentCard/LibraryAgentCard";
+import { LibraryFolder } from "../LibraryFolder/LibraryFolder";
+import { LibrarySubSection } from "../LibrarySubSection/LibrarySubSection";
+import { Button } from "@/components/atoms/Button/Button";
+import { ArrowLeftIcon, HeartIcon } from "@phosphor-icons/react";
+import { Text } from "@/components/atoms/Text/Text";
+import { Tab } from "../LibraryTabs/LibraryTabs";
+import {
+  AnimatePresence,
+  LayoutGroup,
+  motion,
+  useReducedMotion,
+} from "framer-motion";
+import { LibraryFolderEditDialog } from "../LibraryFolderEditDialog/LibraryFolderEditDialog";
+import { LibraryFolderDeleteDialog } from "../LibraryFolderDeleteDialog/LibraryFolderDeleteDialog";
 import { useLibraryAgentList } from "./useLibraryAgentList";
 
+// cancels the current spring and starts a new one from current state.
+const containerVariants = {
+  hidden: {},
+  show: {},
+  exit: {
+    opacity: 0,
+    filter: "blur(4px)",
+    transition: { duration: 0.12 },
+  },
+};
+
+const reducedContainerVariants = {
+  hidden: {},
+  show: {},
+  exit: {
+    opacity: 0,
+    transition: { duration: 0.12 },
+  },
+};
+
+const itemInitial = {
+  opacity: 0,
+  filter: "blur(4px)",
+};
+
+const itemAnimate = {
+  opacity: 1,
+  filter: "blur(0px)",
+};
+
+const itemTransition = {
+  type: "spring" as const,
+  stiffness: 300,
+  damping: 25,
+  opacity: { duration: 0.2 },
+  filter: { duration: 0.15 },
+};
+
+const reducedItemInitial = { opacity: 0 };
+const reducedItemAnimate = { opacity: 1 };
+const reducedItemTransition = { duration: 0.15 };
+
 interface Props {
   searchTerm: string;
   librarySort: LibraryAgentSort;
   setLibrarySort: (value: LibraryAgentSort) => void;
+  selectedFolderId: string | null;
+  onFolderSelect: (folderId: string | null) => void;
+  tabs: Tab[];
+  activeTab: string;
+  onTabChange: (tabId: string) => void;
 }
 
 export function LibraryAgentList({
   searchTerm,
   librarySort,
   setLibrarySort,
+  selectedFolderId,
+  onFolderSelect,
+  tabs,
+  activeTab,
+  onTabChange,
 }: Props) {
+  const shouldReduceMotion = useReducedMotion();
+  const activeContainerVariants = shouldReduceMotion
+    ? reducedContainerVariants
+    : containerVariants;
+  const activeInitial = shouldReduceMotion ? reducedItemInitial : itemInitial;
+  const activeAnimate = shouldReduceMotion ? reducedItemAnimate : itemAnimate;
+  const activeTransition = shouldReduceMotion
+    ? reducedItemTransition
+    : itemTransition;
+
   const {
+    isFavoritesTab,
     agentLoading,
     agentCount,
-    allAgents: agents,
+    agents,
     hasNextPage,
     isFetchingNextPage,
     fetchNextPage,
-  } = useLibraryAgentList({ searchTerm, librarySort });
+    foldersData,
+    currentFolder,
+    showFolders,
+    editingFolder,
+    setEditingFolder,
+    deletingFolder,
+    setDeletingFolder,
+    handleAgentDrop,
+    handleFolderDeleted,
+  } = useLibraryAgentList({
+    searchTerm,
+    librarySort,
+    selectedFolderId,
+    onFolderSelect,
+    activeTab,
+  });
 
   return (
     <>
@@ -32,11 +125,47 @@ export function LibraryAgentList({
         agentCount={agentCount}
         setLibrarySort={setLibrarySort}
       />
-      <div className="px-2">
+      {!selectedFolderId && (
+        <LibrarySubSection
+          tabs={tabs}
+          activeTab={activeTab}
+          onTabChange={onTabChange}
+        />
+      )}
+
+      <div>
+        {selectedFolderId && (
+          <div className="mb-4 flex items-center gap-2">
+            <Button
+              variant="ghost"
+              size="small"
+              onClick={() => onFolderSelect(null)}
+              className="gap-1 text-zinc-500 hover:text-zinc-900"
+            >
+              <ArrowLeftIcon className="h-4 w-4" />
+              My Library
+            </Button>
+            {currentFolder && (
+              <>
+                <Text variant="small" className="text-zinc-400">
+                  /
+                </Text>
+                <Text variant="h4" className="text-zinc-700">
+                  {currentFolder.icon} {currentFolder.name}
+                </Text>
+              </>
+            )}
+          </div>
+        )}
         {agentLoading ? (
           <div className="flex h-[200px] items-center justify-center">
             <LoadingSpinner size="large" />
           </div>
+        ) : isFavoritesTab && agents.length === 0 ? (
+          <div className="flex h-[200px] flex-col items-center justify-center gap-2 text-zinc-500">
+            <HeartIcon className="h-10 w-10" />
+            <Text variant="body">No favorite agents yet</Text>
+          </div>
         ) : (
           <InfiniteScroll
             isFetchingNextPage={isFetchingNextPage}
@@ -44,14 +173,85 @@ export function LibraryAgentList({
             hasNextPage={hasNextPage}
             loader={<LoadingSpinner size="medium" />}
           >
-            <div className="grid grid-cols-1 gap-6 sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
-              {agents.map((agent) => (
-                <LibraryAgentCard key={agent.id} agent={agent} />
-              ))}
-            </div>
+            <LayoutGroup>
+              <AnimatePresence mode="popLayout">
+                <motion.div
+                  key={`${activeTab}-${selectedFolderId || "all"}`}
+                  className="grid grid-cols-1 gap-6 sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4"
+                  variants={activeContainerVariants}
+                  initial="hidden"
+                  animate="show"
+                  exit="exit"
+                >
+                  {showFolders &&
+                    foldersData?.folders.map((folder, i) => (
+                      <motion.div
+                        key={folder.id}
+                        initial={activeInitial}
+                        animate={activeAnimate}
+                        transition={{
+                          ...activeTransition,
+                          delay: i * 0.04,
+                        }}
+                      >
+                        <LibraryFolder
+                          id={folder.id}
+                          name={folder.name}
+                          agentCount={folder.agent_count ?? 0}
+                          color={folder.color ?? undefined}
+                          icon={folder.icon ?? "📁"}
+                          onAgentDrop={handleAgentDrop}
+                          onClick={() => onFolderSelect(folder.id)}
+                          onEdit={() => setEditingFolder(folder)}
+                          onDelete={() => setDeletingFolder(folder)}
+                        />
+                      </motion.div>
+                    ))}
+                  {agents.map((agent, i) => (
+                    <motion.div
+                      key={agent.id}
+                      initial={activeInitial}
+                      animate={activeAnimate}
+                      transition={{
+                        ...activeTransition,
+                        delay:
+                          ((showFolders
+                            ? (foldersData?.folders.length ?? 0)
+                            : 0) +
+                            i) *
+                          0.04,
+                      }}
+                    >
+                      <LibraryAgentCard agent={agent} />
+                    </motion.div>
+                  ))}
+                </motion.div>
+              </AnimatePresence>
+            </LayoutGroup>
           </InfiniteScroll>
         )}
       </div>
+
+      {editingFolder && (
+        <LibraryFolderEditDialog
+          folder={editingFolder}
+          isOpen={!!editingFolder}
+          setIsOpen={(open) => {
+            if (!open) setEditingFolder(null);
+          }}
+        />
+      )}
+
+      {deletingFolder && (
+        <LibraryFolderDeleteDialog
+          folder={deletingFolder}
+          isOpen={!!deletingFolder}
+          setIsOpen={(open) => {
+            if (!open) setDeletingFolder(null);
+          }}
+          onDeleted={handleFolderDeleted}
+        />
+      )}
     </>
   );
 }

autogpt_platform/frontend/src/app/(platform)/library/components/LibraryAgentList/useLibraryAgentList.ts

@@ -1,36 +1,69 @@
 "use client";
 
 import { useGetV2ListLibraryAgentsInfinite } from "@/app/api/__generated__/endpoints/library/library";
+import { getGetV2ListLibraryAgentsQueryKey } from "@/app/api/__generated__/endpoints/library/library";
+import {
+  useGetV2ListLibraryFolders,
+  usePostV2BulkMoveAgents,
+  getGetV2ListLibraryFoldersQueryKey,
+} from "@/app/api/__generated__/endpoints/folders/folders";
+import type { getV2ListLibraryFoldersResponseSuccess } from "@/app/api/__generated__/endpoints/folders/folders";
+import type { LibraryFolder } from "@/app/api/__generated__/models/libraryFolder";
 import { LibraryAgentSort } from "@/app/api/__generated__/models/libraryAgentSort";
 import {
+  okData,
   getPaginatedTotalCount,
   getPaginationNextPageNumber,
   unpaginate,
 } from "@/app/api/helpers";
+import { useToast } from "@/components/molecules/Toast/use-toast";
+import { useFavoriteAgents } from "../../hooks/useFavoriteAgents";
 import { getQueryClient } from "@/lib/react-query/queryClient";
-import { useEffect, useRef } from "react";
+import { useQueryClient } from "@tanstack/react-query";
+import { useEffect, useRef, useState } from "react";
 
 interface Props {
   searchTerm: string;
   librarySort: LibraryAgentSort;
+  selectedFolderId: string | null;
+  onFolderSelect: (folderId: string | null) => void;
+  activeTab: string;
 }
 
-export function useLibraryAgentList({ searchTerm, librarySort }: Props) {
-  const queryClient = getQueryClient();
+export function useLibraryAgentList({
+  searchTerm,
+  librarySort,
+  selectedFolderId,
+  onFolderSelect,
+  activeTab,
+}: Props) {
+  const isFavoritesTab = activeTab === "favorites";
+  const { toast } = useToast();
+  const stableQueryClient = getQueryClient();
+  const queryClient = useQueryClient();
   const prevSortRef = useRef<LibraryAgentSort | null>(null);
 
+  const [editingFolder, setEditingFolder] = useState<LibraryFolder | null>(
+    null,
+  );
+  const [deletingFolder, setDeletingFolder] = useState<LibraryFolder | null>(
+    null,
+  );
+
   const {
     data: agentsQueryData,
     fetchNextPage,
     hasNextPage,
     isFetchingNextPage,
-    isLoading: agentLoading,
+    isLoading: allAgentsLoading,
   } = useGetV2ListLibraryAgentsInfinite(
     {
       page: 1,
       page_size: 20,
       search_term: searchTerm || undefined,
       sort_by: librarySort,
+      folder_id: selectedFolderId ?? undefined,
+      include_root_only: selectedFolderId === null ? true : undefined,
     },
     {
       query: {
@@ -39,28 +72,147 @@ export function useLibraryAgentList({ searchTerm, librarySort }: Props) {
     },
   );
 
-  // Reset queries when sort changes to ensure fresh data with correct sorting
   useEffect(() => {
     if (prevSortRef.current !== null && prevSortRef.current !== librarySort) {
-      // Reset all library agent queries to ensure fresh fetch with new sort
-      queryClient.resetQueries({
+      stableQueryClient.resetQueries({
         queryKey: ["/api/library/agents"],
       });
     }
     prevSortRef.current = librarySort;
-  }, [librarySort, queryClient]);
+  }, [librarySort, stableQueryClient]);
 
-  const allAgents = agentsQueryData
+  const allAgentsList = agentsQueryData
     ? unpaginate(agentsQueryData, "agents")
     : [];
-  const agentCount = getPaginatedTotalCount(agentsQueryData);
+  const allAgentsCount = getPaginatedTotalCount(agentsQueryData);
+
+  const favoriteAgentsData = useFavoriteAgents({ searchTerm });
+
+  const {
+    agentLoading,
+    agentCount,
+    allAgents: agents,
+    hasNextPage: agentsHasNextPage,
+    isFetchingNextPage: agentsIsFetchingNextPage,
+    fetchNextPage: agentsFetchNextPage,
+  } = isFavoritesTab
+    ? favoriteAgentsData
+    : {
+        agentLoading: allAgentsLoading,
+        agentCount: allAgentsCount,
+        allAgents: allAgentsList,
+        hasNextPage: hasNextPage,
+        isFetchingNextPage: isFetchingNextPage,
+        fetchNextPage: fetchNextPage,
+      };
+
+  const { data: rawFoldersData } = useGetV2ListLibraryFolders(undefined, {
+    query: { select: okData },
+  });
+
+  const foldersData = searchTerm ? undefined : rawFoldersData;
+
+  const { mutate: moveAgentToFolder } = usePostV2BulkMoveAgents({
+    mutation: {
+      onMutate: async ({ data }) => {
+        await queryClient.cancelQueries({
+          queryKey: getGetV2ListLibraryFoldersQueryKey(),
+        });
+        await queryClient.cancelQueries({
+          queryKey: getGetV2ListLibraryAgentsQueryKey(),
+        });
+
+        const previousFolders =
+          queryClient.getQueriesData<getV2ListLibraryFoldersResponseSuccess>({
+            queryKey: getGetV2ListLibraryFoldersQueryKey(),
+          });
+
+        if (data.folder_id) {
+          queryClient.setQueriesData<getV2ListLibraryFoldersResponseSuccess>(
+            { queryKey: getGetV2ListLibraryFoldersQueryKey() },
+            (old) => {
+              if (!old?.data?.folders) return old;
+              return {
+                ...old,
+                data: {
+                  ...old.data,
+                  folders: old.data.folders.map((f) =>
+                    f.id === data.folder_id
+                      ? {
+                          ...f,
+                          agent_count:
+                            (f.agent_count ?? 0) + data.agent_ids.length,
+                        }
+                      : f,
+                  ),
+                },
+              };
+            },
+          );
+        }
+
+        return { previousFolders };
+      },
+      onError: (_error, _variables, context) => {
+        if (context?.previousFolders) {
+          for (const [queryKey, data] of context.previousFolders) {
+            queryClient.setQueryData(queryKey, data);
+          }
+        }
+        toast({
+          title: "Error",
+          description: "Failed to move agent. Please try again.",
+          variant: "destructive",
+        });
+      },
+      onSettled: () => {
+        queryClient.invalidateQueries({
+          queryKey: getGetV2ListLibraryFoldersQueryKey(),
+        });
+        queryClient.invalidateQueries({
+          queryKey: getGetV2ListLibraryAgentsQueryKey(),
+        });
+      },
+    },
+  });
+
+  function handleAgentDrop(agentId: string, folderId: string) {
+    moveAgentToFolder({
+      data: {
+        agent_ids: [agentId],
+        folder_id: folderId,
+      },
+    });
+  }
+
+  const currentFolder = selectedFolderId
+    ? foldersData?.folders.find((f) => f.id === selectedFolderId)
+    : null;
+
+  const showFolders = !isFavoritesTab && !selectedFolderId;
+
+  function handleFolderDeleted() {
+    if (selectedFolderId === deletingFolder?.id) {
+      onFolderSelect(null);
+    }
+  }
 
   return {
-    allAgents,
+    isFavoritesTab,
     agentLoading,
-    hasNextPage,
     agentCount,
-    isFetchingNextPage,
-    fetchNextPage,
+    agents,
+    hasNextPage: agentsHasNextPage,
+    isFetchingNextPage: agentsIsFetchingNextPage,
+    fetchNextPage: agentsFetchNextPage,
+    foldersData,
+    currentFolder,
+    showFolders,
+    editingFolder,
+    setEditingFolder,
+    deletingFolder,
+    setDeletingFolder,
+    handleAgentDrop,
+    handleFolderDeleted,
   };
 }

autogpt_platform/frontend/src/app/(platform)/library/components/LibraryFolder/FolderIcon.tsx

@@ -0,0 +1,255 @@
+import { motion } from "framer-motion";
+import { Text } from "@/components/atoms/Text/Text";
+
+type FolderSize = "xs" | "sm" | "md" | "lg" | "xl";
+export type FolderColorName = "blue" | "purple" | "emerald" | "orange" | "pink";
+
+export type FolderColor = FolderColorName | (string & {});
+
+const hexToColorName: Record<string, FolderColorName> = {
+  "#3B82F6": "blue",
+  "#3b82f6": "blue",
+  "#A855F7": "purple",
+  "#a855f7": "purple",
+  "#10B981": "emerald",
+  "#10b981": "emerald",
+  "#F97316": "orange",
+  "#f97316": "orange",
+  "#EC4899": "pink",
+  "#ec4899": "pink",
+};
+
+export function resolveColor(color: FolderColor | undefined): FolderColorName {
+  if (!color) return "blue";
+  if (color in hexToColorName) return hexToColorName[color];
+  if (color in colorMap) return color as FolderColorName;
+  return "blue";
+}
+
+interface Props {
+  className?: string;
+  size?: FolderSize | number;
+  color?: FolderColor;
+  icon?: string;
+  isOpen?: boolean;
+}
+
+const sizeMap: Record<FolderSize, number> = {
+  xs: 0.4,
+  sm: 0.75,
+  md: 1,
+  lg: 1.25,
+  xl: 1.5,
+};
+
+const colorMap: Record<
+  FolderColorName,
+  {
+    bg: string;
+    border: string;
+    borderLight: string;
+    fill: string;
+    stroke: string;
+  }
+> = {
+  blue: {
+    bg: "bg-blue-300",
+    border: "border-blue-300",
+    borderLight: "border-blue-200",
+    fill: "fill-blue-300",
+    stroke: "stroke-blue-400",
+  },
+  purple: {
+    bg: "bg-purple-200",
+    border: "border-purple-200",
+    borderLight: "border-purple-200",
+    fill: "fill-purple-200",
+    stroke: "stroke-purple-400",
+  },
+  emerald: {
+    bg: "bg-emerald-300",
+    border: "border-emerald-300",
+    borderLight: "border-emerald-200",
+    fill: "fill-emerald-300",
+    stroke: "stroke-emerald-400",
+  },
+  orange: {
+    bg: "bg-orange-200",
+    border: "border-orange-200",
+    borderLight: "border-orange-200",
+    fill: "fill-orange-200",
+    stroke: "stroke-orange-400",
+  },
+  pink: {
+    bg: "bg-pink-300",
+    border: "border-pink-300",
+    borderLight: "border-pink-200",
+    fill: "fill-pink-300",
+    stroke: "stroke-pink-400",
+  },
+};
+
+export const folderCardStyles: Record<
+  FolderColorName,
+  { bg: string; border: string; buttonBase: string; buttonHover: string }
+> = {
+  blue: {
+    bg: "bg-blue-50",
+    border: "border-blue-200",
+    buttonBase: "border-zinc-600 text-black",
+    buttonHover: "hover:bg-blue-200",
+  },
+  purple: {
+    bg: "bg-purple-50",
+    border: "border-purple-200",
+    buttonBase: "border-zinc-600 text-black ",
+    buttonHover: "hover:bg-purple-200",
+  },
+  emerald: {
+    bg: "bg-emerald-50",
+    border: "border-emerald-200",
+    buttonBase: "border-zinc-600 text-black",
+    buttonHover: "hover:bg-emerald-200",
+  },
+  orange: {
+    bg: "bg-orange-50",
+    border: "border-orange-200",
+    buttonBase: "border-zinc-600 text-black",
+    buttonHover: "hover:bg-orange-200",
+  },
+  pink: {
+    bg: "bg-pink-50",
+    border: "border-pink-200",
+    buttonBase: "border-zinc-600 text-black",
+    buttonHover: "hover:bg-pink-200",
+  },
+};
+
+export function FolderIcon({
+  className = "",
+  size = "xs",
+  color = "blue",
+  icon,
+  isOpen = false,
+}: Props) {
+  const scale = typeof size === "number" ? size : sizeMap[size];
+  const resolvedColor = resolveColor(color);
+  const colors = colorMap[resolvedColor];
+
+  return (
+    <div
+      className={`group relative cursor-pointer ${className}`}
+      style={{
+        width: 320 * scale,
+        height: 208 * scale,
+      }}
+    >
+      <div
+        className="h-52 w-80 origin-top-left"
+        style={{ transform: `scale(${scale})`, perspective: "500px" }}
+      >
+        <div
+          className={`folder-back relative mx-auto flex h-full w-[87.5%] justify-center overflow-visible rounded-3xl ${colors.bg} ${colors.border}`}
+        >
+          {[
+            {
+              initial: { rotate: -3, x: -38, y: 2 },
+              open: { rotate: -8, x: -70, y: -75 },
+              transition: {
+                type: "spring" as const,
+                bounce: 0.15,
+                stiffness: 160,
+                damping: 22,
+              },
+              className: "z-10",
+            },
+            {
+              initial: { rotate: 0, x: 0, y: 0 },
+              open: { rotate: 1, x: 2, y: -95 },
+              transition: {
+                type: "spring" as const,
+                duration: 0.55,
+                bounce: 0.12,
+                stiffness: 190,
+                damping: 24,
+              },
+              className: "z-20",
+            },
+            {
+              initial: { rotate: 3.5, x: 42, y: 1 },
+              open: { rotate: 9, x: 75, y: -80 },
+              transition: {
+                type: "spring" as const,
+                duration: 0.58,
+                bounce: 0.17,
+                stiffness: 170,
+                damping: 21,
+              },
+              className: "z-10",
+            },
+          ].map((page, i) => (
+            <motion.div
+              key={i}
+              initial={page.initial}
+              animate={isOpen ? page.open : page.initial}
+              transition={page.transition}
+              className={`absolute top-2 h-fit w-32 rounded-xl shadow-lg ${page.className}`}
+            >
+              <Page color={resolvedColor} />
+            </motion.div>
+          ))}
+        </div>
+
+        <motion.div
+          animate={{
+            rotateX: isOpen ? -15 : 0,
+          }}
+          transition={{ type: "spring", duration: 0.5, bounce: 0.25 }}
+          className="absolute inset-x-0 -bottom-px z-30 mx-auto flex h-44 w-[87.5%] origin-bottom items-end justify-center overflow-visible"
+          style={{ transformStyle: "preserve-3d" }}
+        >
+          <svg
+            className="h-auto w-full"
+            viewBox="0 0 173 109"
+            fill="none"
+            xmlns="http://www.w3.org/2000/svg"
+            preserveAspectRatio="none"
+          >
+            <path
+              className={`${colors.fill} ${colors.stroke}`}
+              d="M15.0423 0.500003C0.5 0.500009 0.5 14.2547 0.5 14.2547V92.5C0.5 101.337 7.66344 108.5 16.5 108.5H156.5C165.337 108.5 172.5 101.337 172.5 92.5V34.3302C172.5 25.4936 165.355 18.3302 156.519 18.3302H108.211C98.1341 18.3302 91.2921 5.57144 82.0156 1.63525C80.3338 0.921645 78.2634 0.500002 75.7187 0.500003H15.0423Z"
+            />
+          </svg>
+          <div className="absolute inset-0 flex items-center justify-center text-7xl">
+            {icon}
+          </div>
+        </motion.div>
+      </div>
+    </div>
+  );
+}
+
+interface PageProps {
+  color: FolderColorName;
+}
+
+function Page({ color = "blue" }: PageProps) {
+  const colors = colorMap[color];
+  return (
+    <div
+      className={`h-full w-full rounded-xl border bg-white p-4 ${colors.borderLight}`}
+    >
+      <div className="flex flex-col gap-2">
+        <Text variant="h5" className="text-black">
+          agent.json
+        </Text>
+        {Array.from({ length: 8 }).map((_, i) => (
+          <div key={i} className="flex gap-2">
+            <div className="h-1.5 flex-1 rounded-full bg-neutral-100" />
+            <div className="h-1.5 flex-1 rounded-full bg-neutral-100" />
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}

autogpt_platform/frontend/src/app/(platform)/library/components/LibraryFolder/LibraryFolder.tsx

@@ -0,0 +1,136 @@
+"use client";
+
+import { Text } from "@/components/atoms/Text/Text";
+import { Button } from "@/components/atoms/Button/Button";
+import {
+  FolderIcon,
+  FolderColor,
+  folderCardStyles,
+  resolveColor,
+} from "./FolderIcon";
+import { useState } from "react";
+import { PencilSimpleIcon, TrashIcon } from "@phosphor-icons/react";
+
+interface Props {
+  id: string;
+  name: string;
+  agentCount: number;
+  color?: FolderColor;
+  icon: string;
+  onEdit?: () => void;
+  onDelete?: () => void;
+  onAgentDrop?: (agentId: string, folderId: string) => void;
+  onClick?: () => void;
+}
+
+export function LibraryFolder({
+  id,
+  name,
+  agentCount,
+  color,
+  icon,
+  onEdit,
+  onDelete,
+  onAgentDrop,
+  onClick,
+}: Props) {
+  const [isHovered, setIsHovered] = useState(false);
+  const [isDragOver, setIsDragOver] = useState(false);
+  const resolvedColor = resolveColor(color);
+  const cardStyle = folderCardStyles[resolvedColor];
+
+  function handleDragOver(e: React.DragEvent<HTMLDivElement>) {
+    if (e.dataTransfer.types.includes("application/agent-id")) {
+      e.preventDefault();
+      e.dataTransfer.dropEffect = "move";
+      setIsDragOver(true);
+    }
+  }
+
+  function handleDragLeave() {
+    setIsDragOver(false);
+  }
+
+  function handleDrop(e: React.DragEvent<HTMLDivElement>) {
+    e.preventDefault();
+    setIsDragOver(false);
+    const agentId = e.dataTransfer.getData("application/agent-id");
+    if (agentId && onAgentDrop) {
+      onAgentDrop(agentId, id);
+    }
+  }
+
+  return (
+    <div
+      data-testid="library-folder"
+      data-folder-id={id}
+      className={`group relative inline-flex h-[10.625rem] w-full max-w-[25rem] cursor-pointer flex-col items-start justify-between gap-2.5 rounded-medium border p-4 transition-all duration-200 hover:shadow-md ${
+        isDragOver
+          ? "border-blue-400 bg-blue-50 ring-2 ring-blue-200"
+          : `${cardStyle.border} ${cardStyle.bg}`
+      }`}
+      onMouseEnter={() => setIsHovered(true)}
+      onMouseLeave={() => setIsHovered(false)}
+      onDragOver={handleDragOver}
+      onDragLeave={handleDragLeave}
+      onDrop={handleDrop}
+      onClick={onClick}
+    >
+      <div className="flex w-full items-start justify-between gap-4">
+        {/* Left side - Folder name and agent count */}
+        <div className="flex flex-1 flex-col gap-2">
+          <Text
+            variant="h5"
+            data-testid="library-folder-name"
+            className="line-clamp-2 hyphens-auto break-words"
+          >
+            {name}
+          </Text>
+          <Text
+            variant="small"
+            className="text-zinc-500"
+            data-testid="library-folder-agent-count"
+          >
+            {agentCount} {agentCount === 1 ? "agent" : "agents"}
+          </Text>
+        </div>
+
+        {/* Right side - Custom folder icon */}
+        <div className="flex-shrink-0">
+          <FolderIcon isOpen={isHovered} color={color} icon={icon} />
+        </div>
+      </div>
+
+      {/* Action buttons - visible on hover */}
+      <div
+        className="flex items-center justify-end gap-2"
+        data-testid="library-folder-actions"
+      >
+        <Button
+          variant="icon"
+          size="icon"
+          aria-label="Edit folder"
+          onClick={(e) => {
+            e.stopPropagation();
+            onEdit?.();
+          }}
+          className={`h-8 w-8 border p-2 ${cardStyle.buttonBase} ${cardStyle.buttonHover}`}
+        >
+          <PencilSimpleIcon className="h-4 w-4" />
+        </Button>
+        <Button
+          variant="icon"
+          size="icon"
+          aria-label="Delete folder"
+          onClick={(e) => {
+            e.stopPropagation();
+            onDelete?.();
+          }}
+          className={`h-8 w-8 border p-2 ${cardStyle.buttonBase} ${cardStyle.buttonHover}`}
+        >
+          <TrashIcon className="h-4 w-4" />
+        </Button>
+      </div>
+    </div>
+  );
+}

autogpt_platform/frontend/src/app/(platform)/library/components/LibraryFolderCreationDialog/LibraryFolderCreationDialog.tsx

@@ -0,0 +1,224 @@
+"use client";
+import { Button } from "@/components/atoms/Button/Button";
+import { Input } from "@/components/atoms/Input/Input";
+import { Select } from "@/components/atoms/Select/Select";
+import { Text } from "@/components/atoms/Text/Text";
+import { Dialog } from "@/components/molecules/Dialog/Dialog";
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormMessage,
+} from "@/components/molecules/Form/Form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { FolderSimpleIcon } from "@phosphor-icons/react";
+import { useState } from "react";
+import { useForm } from "react-hook-form";
+import { z } from "zod";
+import dynamic from "next/dynamic";
+import {
+  usePostV2CreateFolder,
+  getGetV2ListLibraryFoldersQueryKey,
+} from "@/app/api/__generated__/endpoints/folders/folders";
+import { useToast } from "@/components/molecules/Toast/use-toast";
+import { useQueryClient } from "@tanstack/react-query";
+import { FOLDER_COLORS } from "../folder-constants";
+
+const LazyEmojiPicker = dynamic(
+  () =>
+    import("../LazyEmojiPicker").then((mod) => ({
+      default: mod.LazyEmojiPicker,
+    })),
+  { ssr: false },
+);
+
+export const libraryFolderCreationFormSchema = z.object({
+  folderName: z
+    .string()
+    .min(1, "Folder name is required")
+    .max(100, "Folder name must be 100 characters or less"),
+  folderColor: z.string().min(1, "Folder color is required"),
+  folderIcon: z.string().min(1, "Folder icon is required"),
+});
+
+export default function LibraryFolderCreationDialog() {
+  const [isOpen, setIsOpen] = useState(false);
+  const queryClient = useQueryClient();
+  const { toast } = useToast();
+
+  const { mutate: createFolder, isPending } = usePostV2CreateFolder({
+    mutation: {
+      onSuccess: () => {
+        queryClient.invalidateQueries({
+          queryKey: getGetV2ListLibraryFoldersQueryKey(),
+        });
+        setIsOpen(false);
+        form.reset();
+        toast({
+          title: "Folder created",
+          description: "Your folder has been created successfully.",
+        });
+      },
+      onError: () => {
+        toast({
+          title: "Error",
+          description: "Failed to create folder. Please try again.",
+          variant: "destructive",
+        });
+      },
+    },
+  });
+
+  const form = useForm<z.infer<typeof libraryFolderCreationFormSchema>>({
+    resolver: zodResolver(libraryFolderCreationFormSchema),
+    defaultValues: {
+      folderName: "",
+      folderColor: "",
+      folderIcon: "",
+    },
+  });
+
+  function onSubmit(values: z.infer<typeof libraryFolderCreationFormSchema>) {
+    createFolder({
+      data: {
+        name: values.folderName.trim(),
+        color: values.folderColor,
+        icon: values.folderIcon,
+      },
+    });
+  }
+
+  return (
+    <Dialog
+      title="Create Folder"
+      styling={{ maxWidth: "30rem" }}
+      controlled={{
+        isOpen,
+        set: setIsOpen,
+      }}
+      onClose={() => {
+        setIsOpen(false);
+      }}
+    >
+      <Dialog.Trigger>
+        <Button
+          data-testid="upload-agent-button"
+          variant="secondary"
+          className="h-fit w-fit"
+          size="small"
+        >
+          <FolderSimpleIcon width={18} height={18} />
+          <span className="create-folder">Create folder</span>
+        </Button>
+      </Dialog.Trigger>
+      <Dialog.Content>
+        <Form
+          form={form}
+          onSubmit={(values) => onSubmit(values)}
+          className="flex flex-col justify-center gap-2 px-1"
+        >
+          <FormField
+            control={form.control}
+            name="folderName"
+            render={({ field }) => (
+              <FormItem>
+                <FormControl>
+                  <Input
+                    {...field}
+                    id={field.name}
+                    label="Folder name"
+                    placeholder="Enter folder name"
+                    className="!mb-0 w-full"
+                    wrapperClassName="!mb-0"
+                  />
+                </FormControl>
+                <FormMessage />
+              </FormItem>
+            )}
+          />
+
+          <FormField
+            control={form.control}
+            name="folderColor"
+            render={({ field }) => (
+              <FormItem>
+                <FormControl>
+                  <Select
+                    id="folderColor"
+                    label="Folder color"
+                    placeholder="Select a color"
+                    value={field.value}
+                    onValueChange={field.onChange}
+                    options={FOLDER_COLORS.map((color) => ({
+                      value: color.value,
+                      label: color.label,
+                      icon: (
+                        <div
+                          className="h-4 w-4 rounded-full"
+                          style={{ backgroundColor: color.value }}
+                        />
+                      ),
+                    }))}
+                    wrapperClassName="!mb-0"
+                    renderItem={(option) => (
+                      <div className="flex items-center gap-2">
+                        {option.icon}
+                        <span>{option.label}</span>
+                      </div>
+                    )}
+                  />
+                </FormControl>
+                <FormMessage />
+              </FormItem>
+            )}
+          />
+
+          <FormField
+            control={form.control}
+            name="folderIcon"
+            render={({ field }) => (
+              <FormItem>
+                <div className="flex flex-col gap-2">
+                  <Text variant="large-medium" as="span" className="text-black">
+                    Folder icon
+                  </Text>
+                  <div className="flex flex-col gap-3">
+                    <div className="flex items-center gap-3">
+                      <Text variant="small" className="text-zinc-500">
+                        Selected:
+                      </Text>
+                      <div className="flex h-10 w-10 items-center justify-center rounded-lg border border-zinc-200 bg-zinc-50 text-2xl">
+                        {form.watch("folderIcon") || (
+                          <span className="text-sm text-zinc-400">—</span>
+                        )}
+                      </div>
+                    </div>
+                    <div className="h-[295px] w-full overflow-hidden">
+                      <LazyEmojiPicker
+                        onEmojiSelect={(emoji) => {
+                          field.onChange(emoji);
+                        }}
+                      />
+                    </div>
+                  </div>
+                  <FormMessage />
+                </div>
+              </FormItem>
+            )}
+          />
+
+          <Button
+            type="submit"
+            variant="primary"
+            className="mt-2 min-w-[18rem]"
+            disabled={!form.formState.isValid || isPending}
+            loading={isPending}
+          >
+            Create
+          </Button>
+        </Form>
+      </Dialog.Content>
+    </Dialog>
+  );
+}

autogpt_platform/frontend/src/app/(platform)/library/components/LibraryFolderDeleteDialog/LibraryFolderDeleteDialog.tsx

@@ -0,0 +1,96 @@
+"use client";
+
+import { Button } from "@/components/atoms/Button/Button";
+import { Text } from "@/components/atoms/Text/Text";
+import { Dialog } from "@/components/molecules/Dialog/Dialog";
+import { useToast } from "@/components/molecules/Toast/use-toast";
+import {
+  useDeleteV2DeleteFolder,
+  getGetV2ListLibraryFoldersQueryKey,
+} from "@/app/api/__generated__/endpoints/folders/folders";
+import { getGetV2ListLibraryAgentsQueryKey } from "@/app/api/__generated__/endpoints/library/library";
+import { useQueryClient } from "@tanstack/react-query";
+import type { LibraryFolder } from "@/app/api/__generated__/models/libraryFolder";
+
+interface Props {
+  folder: LibraryFolder;
+  isOpen: boolean;
+  setIsOpen: (open: boolean) => void;
+  onDeleted?: () => void;
+}
+
+export function LibraryFolderDeleteDialog({
+  folder,
+  isOpen,
+  setIsOpen,
+  onDeleted,
+}: Props) {
+  const queryClient = useQueryClient();
+  const { toast } = useToast();
+
+  const { mutate: deleteFolder, isPending } = useDeleteV2DeleteFolder({
+    mutation: {
+      onSuccess: () => {
+        queryClient.invalidateQueries({
+          queryKey: getGetV2ListLibraryFoldersQueryKey(),
+        });
+        queryClient.invalidateQueries({
+          queryKey: getGetV2ListLibraryAgentsQueryKey(),
+        });
+        toast({
+          title: "Folder deleted",
+          description: `"${folder.name}" has been deleted.`,
+        });
+        setIsOpen(false);
+        onDeleted?.();
+      },
+      onError: () => {
+        toast({
+          title: "Error",
+          description: "Failed to delete folder. Please try again.",
+          variant: "destructive",
+        });
+      },
+    },
+  });
+
+  function handleDelete() {
+    deleteFolder({ folderId: folder.id });
+  }
+
+  return (
+    <Dialog
+      controlled={{
+        isOpen,
+        set: setIsOpen,
+      }}
+      styling={{ maxWidth: "32rem" }}
+      title="Delete folder"
+    >
+      <Dialog.Content>
+        <div>
+          <Text variant="large">
+            Are you sure you want to delete &ldquo;{folder.name}&rdquo;? Agents
+            inside this folder will be moved back to your library.
+          </Text>
+          <Dialog.Footer>
+            <Button
+              variant="secondary"
+              disabled={isPending}
+              onClick={() => setIsOpen(false)}
+            >
+              Cancel
+            </Button>
+            <Button
+              variant="destructive"
+              onClick={handleDelete}
+              loading={isPending}
+            >
+              Delete Folder
+            </Button>
+          </Dialog.Footer>
+        </div>
+      </Dialog.Content>
+    </Dialog>
+  );
+}

autogpt_platform/frontend/src/app/(platform)/library/components/LibraryFolderEditDialog/LibraryFolderEditDialog.tsx

@@ -0,0 +1,282 @@
+"use client";
+
+import { Button } from "@/components/atoms/Button/Button";
+import { Input } from "@/components/atoms/Input/Input";
+import { Select } from "@/components/atoms/Select/Select";
+import { Text } from "@/components/atoms/Text/Text";
+import { Dialog } from "@/components/molecules/Dialog/Dialog";
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormMessage,
+} from "@/components/molecules/Form/Form";
+import { useToast } from "@/components/molecules/Toast/use-toast";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { z } from "zod";
+import dynamic from "next/dynamic";
+import {
+  usePatchV2UpdateFolder,
+  getGetV2ListLibraryFoldersQueryKey,
+} from "@/app/api/__generated__/endpoints/folders/folders";
+import { useQueryClient } from "@tanstack/react-query";
+import type { LibraryFolder } from "@/app/api/__generated__/models/libraryFolder";
+import type { getV2ListLibraryFoldersResponseSuccess } from "@/app/api/__generated__/endpoints/folders/folders";
+import { ApiError } from "@/lib/autogpt-server-api/helpers";
+import { FOLDER_COLORS } from "../folder-constants";
+
+const LazyEmojiPicker = dynamic(
+  () =>
+    import("../LazyEmojiPicker").then((mod) => ({
+      default: mod.LazyEmojiPicker,
+    })),
+  { ssr: false },
+);
+
+const editFolderSchema = z.object({
+  folderName: z
+    .string()
+    .min(1, "Folder name is required")
+    .max(100, "Folder name must be 100 characters or less"),
+  folderColor: z.string().min(1, "Folder color is required"),
+  folderIcon: z.string().min(1, "Folder icon is required"),
+});
+
+interface Props {
+  folder: LibraryFolder;
+  isOpen: boolean;
+  setIsOpen: (open: boolean) => void;
+}
+
+export function LibraryFolderEditDialog({ folder, isOpen, setIsOpen }: Props) {
+  const queryClient = useQueryClient();
+  const { toast } = useToast();
+
+  const form = useForm<z.infer<typeof editFolderSchema>>({
+    resolver: zodResolver(editFolderSchema),
+    defaultValues: {
+      folderName: folder.name,
+      folderColor: folder.color ?? "",
+      folderIcon: folder.icon ?? "",
+    },
+  });
+
+  useEffect(() => {
+    if (isOpen) {
+      form.reset({
+        folderName: folder.name,
+        folderColor: folder.color ?? "",
+        folderIcon: folder.icon ?? "",
+      });
+    }
+  }, [isOpen, folder, form]);
+
+  const { mutate: updateFolder, isPending } = usePatchV2UpdateFolder({
+    mutation: {
+      onMutate: async ({ folderId, data }) => {
+        await queryClient.cancelQueries({
+          queryKey: getGetV2ListLibraryFoldersQueryKey(),
+        });
+
+        const previousData =
+          queryClient.getQueriesData<getV2ListLibraryFoldersResponseSuccess>({
+            queryKey: getGetV2ListLibraryFoldersQueryKey(),
+          });
+
+        queryClient.setQueriesData<getV2ListLibraryFoldersResponseSuccess>(
+          { queryKey: getGetV2ListLibraryFoldersQueryKey() },
+          (old) => {
+            if (!old?.data?.folders) return old;
+            return {
+              ...old,
+              data: {
+                ...old.data,
+                folders: old.data.folders.map((f) =>
+                  f.id === folderId
+                    ? {
+                        ...f,
+                        name: data.name ?? f.name,
+                        color: data.color ?? f.color,
+                        icon: data.icon ?? f.icon,
+                      }
+                    : f,
+                ),
+              },
+            };
+          },
+        );
+
+        return { previousData };
+      },
+      onError: (error: unknown, _variables, context) => {
+        if (context?.previousData) {
+          for (const [queryKey, data] of context.previousData) {
+            queryClient.setQueryData(queryKey, data);
+          }
+        }
+        if (error instanceof ApiError) {
+          const detail = (error.response as any)?.detail ?? "";
+          if (
+            typeof detail === "string" &&
+            detail.toLowerCase().includes("already exists")
+          ) {
+            form.setError("folderName", {
+              message: "A folder with this name already exists",
+            });
+            return;
+          }
+        }
+        toast({
+          title: "Error",
+          description: "Failed to update folder. Please try again.",
+          variant: "destructive",
+        });
+      },
+      onSuccess: () => {
+        setIsOpen(false);
+        toast({
+          title: "Folder updated",
+          description: "Your folder has been updated successfully.",
+        });
+      },
+      onSettled: () => {
+        queryClient.invalidateQueries({
+          queryKey: getGetV2ListLibraryFoldersQueryKey(),
+        });
+      },
+    },
+  });
+
+  function onSubmit(values: z.infer<typeof editFolderSchema>) {
+    updateFolder({
+      folderId: folder.id,
+      data: {
+        name: values.folderName.trim(),
+        color: values.folderColor,
+        icon: values.folderIcon,
+      },
+    });
+  }
+
+  return (
+    <Dialog
+      title="Edit Folder"
+      styling={{ maxWidth: "30rem" }}
+      controlled={{
+        isOpen,
+        set: setIsOpen,
+      }}
+    >
+      <Dialog.Content>
+        <Form
+          form={form}
+          onSubmit={(values) => onSubmit(values)}
+          className="flex flex-col justify-center gap-2 px-1"
+        >
+          <FormField
+            control={form.control}
+            name="folderName"
+            render={({ field }) => (
+              <FormItem>
+                <FormControl>
+                  <Input
+                    {...field}
+                    id={field.name}
+                    label="Folder name"
+                    placeholder="Enter folder name"
+                    className="w-full"
+                    wrapperClassName="!mb-0"
+                  />
+                </FormControl>
+                <FormMessage />
+              </FormItem>
+            )}
+          />
+
+          <FormField
+            control={form.control}
+            name="folderColor"
+            render={({ field }) => (
+              <FormItem>
+                <FormControl>
+                  <Select
+                    id="folderColor"
+                    label="Folder color"
+                    placeholder="Select a color"
+                    value={field.value}
+                    onValueChange={field.onChange}
+                    wrapperClassName="!mb-0"
+                    options={FOLDER_COLORS.map((color) => ({
+                      value: color.value,
+                      label: color.label,
+                      icon: (
+                        <div
+                          className="h-4 w-4 rounded-full"
+                          style={{ backgroundColor: color.value }}
+                        />
+                      ),
+                    }))}
+                    renderItem={(option) => (
+                      <div className="flex items-center gap-2">
+                        {option.icon}
+                        <span>{option.label}</span>
+                      </div>
+                    )}
+                  />
+                </FormControl>
+                <FormMessage />
+              </FormItem>
+            )}
+          />
+
+          <FormField
+            control={form.control}
+            name="folderIcon"
+            render={({ field }) => (
+              <FormItem>
+                <div className="flex flex-col gap-2">
+                  <Text variant="large-medium" as="span" className="text-black">
+                    Folder icon
+                  </Text>
+                  <div className="flex flex-col gap-3">
+                    <div className="flex items-center gap-3">
+                      <Text variant="small" className="text-zinc-500">
+                        Selected:
+                      </Text>
+                      <div className="flex h-10 w-10 items-center justify-center rounded-lg border border-zinc-200 bg-zinc-50 text-2xl">
+                        {form.watch("folderIcon") || (
+                          <span className="text-sm text-zinc-400">—</span>
+                        )}
+                      </div>
+                    </div>
+                    <div className="h-[295px] w-full overflow-hidden">
+                      <LazyEmojiPicker
+                        onEmojiSelect={(emoji) => {
+                          field.onChange(emoji);
+                        }}
+                      />
+                    </div>
+                  </div>
+                  <FormMessage />
+                </div>
+              </FormItem>
+            )}
+          />
+
+          <Button
+            type="submit"
+            variant="primary"
+            className="mt-2 min-w-[18rem]"
+            disabled={!form.formState.isValid || isPending}
+            loading={isPending}
+          >
+            Save Changes
+          </Button>
+        </Form>
+      </Dialog.Content>
+    </Dialog>
+  );
+}

autogpt_platform/frontend/src/app/(platform)/library/components/LibrarySubSection/LibrarySubSection.tsx

@@ -0,0 +1,21 @@
+import LibraryFolderCreationDialog from "../LibraryFolderCreationDialog/LibraryFolderCreationDialog";
+import { LibraryTabs, Tab } from "../LibraryTabs/LibraryTabs";
+
+interface Props {
+  tabs: Tab[];
+  activeTab: string;
+  onTabChange: (tabId: string) => void;
+}
+
+export function LibrarySubSection({ tabs, activeTab, onTabChange }: Props) {
+  return (
+    <div className="flex items-center justify-between gap-4">
+      <LibraryTabs
+        tabs={tabs}
+        activeTab={activeTab}
+        onTabChange={onTabChange}
+      />
+      <LibraryFolderCreationDialog />
+    </div>
+  );
+}

autogpt_platform/frontend/src/app/(platform)/library/components/LibraryTabs/LibraryTabs.tsx

@@ -0,0 +1,147 @@
+"use client";
+
+import { useState, useEffect, useRef } from "react";
+import { motion } from "framer-motion";
+import { cn } from "@/lib/utils";
+import { Icon } from "@phosphor-icons/react";
+import { useFavoriteAnimation } from "../../context/FavoriteAnimationContext";
+
+export interface Tab {
+  id: string;
+  title: string;
+  icon: Icon;
+}
+
+interface Props {
+  tabs: Tab[];
+  activeTab: string;
+  onTabChange: (tabId: string) => void;
+  layoutId?: string;
+}
+
+export function LibraryTabs({
+  tabs,
+  activeTab,
+  onTabChange,
+  layoutId = "library-tabs",
+}: Props) {
+  const { registerFavoritesTabRef } = useFavoriteAnimation();
+
+  return (
+    <div className="flex items-center gap-2">
+      {tabs.map((tab) => (
+        <TabButton
+          key={tab.id}
+          tab={tab}
+          isActive={activeTab === tab.id}
+          onSelect={onTabChange}
+          layoutId={layoutId}
+          onRefReady={
+            tab.id === "favorites" ? registerFavoritesTabRef : undefined
+          }
+        />
+      ))}
+    </div>
+  );
+}
+
+interface TabButtonProps {
+  tab: Tab;
+  isActive: boolean;
+  onSelect: (tabId: string) => void;
+  layoutId: string;
+  onRefReady?: (element: HTMLElement | null) => void;
+}
+
+function TabButton({
+  tab,
+  isActive,
+  onSelect,
+  layoutId,
+  onRefReady,
+}: TabButtonProps) {
+  const [isLoaded, setIsLoaded] = useState(false);
+  const buttonRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    if (isActive && !isLoaded) {
+      setIsLoaded(true);
+    }
+  }, [isActive, isLoaded]);
+
+  useEffect(() => {
+    if (onRefReady) {
+      onRefReady(buttonRef.current);
+    }
+  }, [onRefReady]);
+
+  const ButtonIcon = tab.icon;
+  const activeColor = "text-primary";
+
+  return (
+    <motion.div
+      ref={buttonRef}
+      layoutId={`${layoutId}-button-${tab.id}`}
+      transition={{
+        layout: {
+          type: "spring",
+          damping: 20,
+          stiffness: 230,
+          mass: 1.2,
+          ease: [0.215, 0.61, 0.355, 1],
+        },
+      }}
+      onClick={() => {
+        onSelect(tab.id);
+        setIsLoaded(true);
+      }}
+      className="flex h-fit w-fit"
+      style={{ willChange: "transform" }}
+    >
+      <motion.div
+        layout
+        transition={{
+          layout: {
+            type: "spring",
+            damping: 20,
+            stiffness: 230,
+            mass: 1.2,
+          },
+        }}
+        className={cn(
+          "flex h-fit cursor-pointer items-center gap-1.5 overflow-hidden border border-zinc-200 px-3 py-2 text-black transition-colors duration-75 ease-out hover:border-zinc-300 hover:bg-zinc-300",
+          isActive && activeColor,
+          isActive ? "px-4" : "px-3",
+        )}
+        style={{
+          borderRadius: "25px",
+        }}
+      >
+        <motion.div
+          layoutId={`${layoutId}-icon-${tab.id}`}
+          className="shrink-0"
+        >
+          <ButtonIcon size={18} />
+        </motion.div>
+        {isActive && (
+          <motion.div
+            className="flex items-center"
+            initial={isLoaded ? { opacity: 0, filter: "blur(4px)" } : false}
+            animate={{ opacity: 1, filter: "blur(0px)" }}
+            transition={{
+              duration: isLoaded ? 0.2 : 0,
+              ease: [0.86, 0, 0.07, 1],
+            }}
+          >
+            <motion.span
+              layoutId={`${layoutId}-text-${tab.id}`}
+              className="font-sans text-sm font-medium text-black"
+            >
+              {tab.title}
+            </motion.span>
+          </motion.div>
+        )}
+      </motion.div>
+    </motion.div>
+  );
+}

autogpt_platform/frontend/src/app/(platform)/library/components/MoveToFolderDialog/MoveToFolderDialog.tsx

@@ -0,0 +1,170 @@
+"use client";
+
+import { Button } from "@/components/atoms/Button/Button";
+import { Input } from "@/components/atoms/Input/Input";
+import { Text } from "@/components/atoms/Text/Text";
+import { Dialog } from "@/components/molecules/Dialog/Dialog";
+import { useToast } from "@/components/molecules/Toast/use-toast";
+import {
+  useGetV2ListLibraryFolders,
+  usePostV2BulkMoveAgents,
+  getGetV2ListLibraryFoldersQueryKey,
+} from "@/app/api/__generated__/endpoints/folders/folders";
+import { getGetV2ListLibraryAgentsQueryKey } from "@/app/api/__generated__/endpoints/library/library";
+import { okData } from "@/app/api/helpers";
+import { useQueryClient } from "@tanstack/react-query";
+import { useMemo, useState } from "react";
+import type { LibraryFolder } from "@/app/api/__generated__/models/libraryFolder";
+
+interface Props {
+  agentId: string;
+  agentName: string;
+  currentFolderId?: string | null;
+  isOpen: boolean;
+  setIsOpen: (open: boolean) => void;
+}
+
+export function MoveToFolderDialog({
+  agentId,
+  agentName,
+  currentFolderId,
+  isOpen,
+  setIsOpen,
+}: Props) {
+  const queryClient = useQueryClient();
+  const { toast } = useToast();
+  const [search, setSearch] = useState("");
+
+  const { data: foldersData } = useGetV2ListLibraryFolders(undefined, {
+    query: { select: okData },
+  });
+
+  const { mutate: moveAgent, isPending } = usePostV2BulkMoveAgents({
+    mutation: {
+      onSuccess: () => {
+        queryClient.invalidateQueries({
+          queryKey: getGetV2ListLibraryAgentsQueryKey(),
+        });
+        queryClient.invalidateQueries({
+          queryKey: getGetV2ListLibraryFoldersQueryKey(),
+        });
+        setIsOpen(false);
+        setSearch("");
+        toast({
+          title: "Agent moved",
+          description: `"${agentName}" has been moved.`,
+        });
+      },
+      onError: () => {
+        toast({
+          title: "Error",
+          description: "Failed to move agent. Please try again.",
+          variant: "destructive",
+        });
+      },
+    },
+  });
+
+  const hierarchicalFolders = useMemo(() => {
+    const allFolders = foldersData?.folders ?? [];
+    const result: { folder: LibraryFolder; depth: number }[] = [];
+
+    function addChildren(parentId: string | null, depth: number) {
+      for (const f of allFolders) {
+        if ((f.parent_id ?? null) === parentId) {
+          result.push({ folder: f, depth });
+          addChildren(f.id, depth + 1);
+        }
+      }
+    }
+
+    addChildren(null, 0);
+    return result;
+  }, [foldersData]);
+
+  const folders = hierarchicalFolders.filter(
+    ({ folder: f }) =>
+      f.id !== currentFolderId &&
+      f.name.toLowerCase().includes(search.toLowerCase()),
+  );
+
+  function handleMoveToFolder(folderId: string | null) {
+    moveAgent({
+      data: {
+        agent_ids: [agentId],
+        folder_id: folderId,
+      },
+    });
+  }
+
+  return (
+    <Dialog
+      controlled={{ isOpen, set: setIsOpen }}
+      styling={{ maxWidth: "28rem" }}
+      title="Move to folder"
+      onClose={() => {
+        setSearch("");
+      }}
+    >
+      <Dialog.Content>
+        <div className="flex flex-col gap-3">
+          <Input
+            id="search-folders"
+            label="Search folders"
+            placeholder="Search folders..."
+            value={search}
+            onChange={(e) => setSearch(e.target.value)}
+            className="w-full"
+          />
+          <div className="max-h-[280px] overflow-y-auto">
+            {folders.length === 0 ? (
+              <div className="flex h-20 items-center justify-center">
+                <Text variant="small" className="text-zinc-400">
+                  No folders found
+                </Text>
+              </div>
+            ) : (
+              <div className="flex flex-col gap-1">
+                {currentFolderId && (
+                  <Button
+                    variant="ghost"
+                    className="w-full justify-start gap-3 px-3 py-2.5"
+                    disabled={isPending}
+                    onClick={() => handleMoveToFolder(null)}
+                  >
+                    <span className="text-lg">📂</span>
+                    <div className="flex flex-col items-start">
+                      <Text variant="small-medium">My Library (root)</Text>
+                      <Text variant="small" className="text-zinc-400">
+                        Remove from folder
+                      </Text>
+                    </div>
+                  </Button>
+                )}
+                {folders.map(({ folder, depth }) => (
+                  <Button
+                    key={folder.id}
+                    variant="ghost"
+                    className="w-full justify-start gap-3 py-2.5"
+                    style={{ paddingLeft: `${0.75 + depth * 1.25}rem` }}
+                    disabled={isPending}
+                    onClick={() => handleMoveToFolder(folder.id)}
+                  >
+                    <span className="text-lg">{folder.icon ?? "📁"}</span>
+                    <div className="flex flex-col items-start">
+                      <Text variant="small-medium">{folder.name}</Text>
+                      <Text variant="small" className="text-zinc-400">
+                        {folder.agent_count ?? 0}{" "}
+                        {(folder.agent_count ?? 0) === 1 ? "agent" : "agents"}
+                      </Text>
+                    </div>
+                  </Button>
+                ))}
+              </div>
+            )}
+          </div>
+        </div>
+      </Dialog.Content>
+    </Dialog>
+  );
+}

autogpt_platform/frontend/src/app/(platform)/library/components/folder-constants.ts

@@ -0,0 +1,7 @@
+export const FOLDER_COLORS = [
+  { value: "#3B82F6", label: "Blue" },
+  { value: "#A855F7", label: "Purple" },
+  { value: "#10B981", label: "Green" },
+  { value: "#F97316", label: "Orange" },
+  { value: "#EC4899", label: "Pink" },
+];

autogpt_platform/frontend/src/app/(platform)/library/context/FavoriteAnimationContext.tsx

@@ -0,0 +1,84 @@
+"use client";
+
+import {
+  createContext,
+  useContext,
+  useState,
+  useCallback,
+  useRef,
+} from "react";
+import { FlyingHeart } from "../components/FlyingHeart/FlyingHeart";
+
+interface FavoriteAnimationContextType {
+  triggerFavoriteAnimation: (startPosition: { x: number; y: number }) => void;
+  registerFavoritesTabRef: (element: HTMLElement | null) => void;
+}
+
+const FavoriteAnimationContext =
+  createContext<FavoriteAnimationContextType | null>(null);
+
+interface FavoriteAnimationProviderProps {
+  children: React.ReactNode;
+  onAnimationComplete?: () => void;
+}
+
+export function FavoriteAnimationProvider({
+  children,
+  onAnimationComplete,
+}: FavoriteAnimationProviderProps) {
+  const [animationState, setAnimationState] = useState<{
+    startPosition: { x: number; y: number } | null;
+    targetPosition: { x: number; y: number } | null;
+  }>({
+    startPosition: null,
+    targetPosition: null,
+  });
+
+  const favoritesTabRef = useRef<HTMLElement | null>(null);
+
+  const registerFavoritesTabRef = useCallback((element: HTMLElement | null) => {
+    favoritesTabRef.current = element;
+  }, []);
+
+  const triggerFavoriteAnimation = useCallback(
+    (startPosition: { x: number; y: number }) => {
+      if (favoritesTabRef.current) {
+        const rect = favoritesTabRef.current.getBoundingClientRect();
+        const targetPosition = {
+          x: rect.left + rect.width / 2 - 12,
+          y: rect.top + rect.height / 2 - 12,
+        };
+        setAnimationState({ startPosition, targetPosition });
+      }
+    },
+    [],
+  );
+
+  function handleAnimationComplete() {
+    setAnimationState({ startPosition: null, targetPosition: null });
+    onAnimationComplete?.();
+  }
+
+  return (
+    <FavoriteAnimationContext.Provider
+      value={{ triggerFavoriteAnimation, registerFavoritesTabRef }}
+    >
+      {children}
+      <FlyingHeart
+        startPosition={animationState.startPosition}
+        targetPosition={animationState.targetPosition}
+        onAnimationComplete={handleAnimationComplete}
+      />
+    </FavoriteAnimationContext.Provider>
+  );
+}
+
+export function useFavoriteAnimation() {
+  const context = useContext(FavoriteAnimationContext);
+  if (!context) {
+    throw new Error(
+      "useFavoriteAnimation must be used within FavoriteAnimationProvider",
+    );
+  }
+  return context;
+}

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

@@ -1,28 +1,55 @@
 "use client";
 
-import { useEffect } from "react";
-import { FavoritesSection } from "./components/FavoritesSection/FavoritesSection";
+import { useEffect, useState, useCallback } from "react";
+import { HeartIcon, ListIcon } from "@phosphor-icons/react";
 import { LibraryActionHeader } from "./components/LibraryActionHeader/LibraryActionHeader";
 import { LibraryAgentList } from "./components/LibraryAgentList/LibraryAgentList";
+import { Tab } from "./components/LibraryTabs/LibraryTabs";
 import { useLibraryListPage } from "./components/useLibraryListPage";
+import { FavoriteAnimationProvider } from "./context/FavoriteAnimationContext";
+
+const LIBRARY_TABS: Tab[] = [
+  { id: "all", title: "All", icon: ListIcon },
+  { id: "favorites", title: "Favorites", icon: HeartIcon },
+];
 
 export default function LibraryPage() {
   const { searchTerm, setSearchTerm, librarySort, setLibrarySort } =
     useLibraryListPage();
+  const [selectedFolderId, setSelectedFolderId] = useState<string | null>(null);
+  const [activeTab, setActiveTab] = useState(LIBRARY_TABS[0].id);
 
   useEffect(() => {
     document.title = "Library – AutoGPT Platform";
   }, []);
 
+  function handleTabChange(tabId: string) {
+    setActiveTab(tabId);
+    setSelectedFolderId(null);
+  }
+
+  const handleFavoriteAnimationComplete = useCallback(() => {
+    setActiveTab("favorites");
+    setSelectedFolderId(null);
+  }, []);
+
   return (
-    <main className="pt-160 container min-h-screen space-y-4 pb-20 pt-16 sm:px-8 md:px-12">
-      <LibraryActionHeader setSearchTerm={setSearchTerm} />
-      <FavoritesSection searchTerm={searchTerm} />
-      <LibraryAgentList
-        searchTerm={searchTerm}
-        librarySort={librarySort}
-        setLibrarySort={setLibrarySort}
-      />
-    </main>
+    <FavoriteAnimationProvider
+      onAnimationComplete={handleFavoriteAnimationComplete}
+    >
+      <main className="pt-160 container min-h-screen space-y-4 pb-20 pt-16 sm:px-8 md:px-12">
+        <LibraryActionHeader setSearchTerm={setSearchTerm} />
+        <LibraryAgentList
+          searchTerm={searchTerm}
+          librarySort={librarySort}
+          setLibrarySort={setLibrarySort}
+          selectedFolderId={selectedFolderId}
+          onFolderSelect={setSelectedFolderId}
+          tabs={LIBRARY_TABS}
+          activeTab={activeTab}
+          onTabChange={handleTabChange}
+        />
+      </main>
+    </FavoriteAnimationProvider>
   );
 }

autogpt_platform/frontend/src/app/(platform)/reset-password/page.tsx

@@ -2,6 +2,7 @@
 import { Button } from "@/components/atoms/Button/Button";
 import { Input } from "@/components/atoms/Input/Input";
 import { AuthCard } from "@/components/auth/AuthCard";
+import { ExpiredLinkMessage } from "@/components/auth/ExpiredLinkMessage";
 import { Form, FormField } from "@/components/__legacy__/ui/form";
 import LoadingBox from "@/components/__legacy__/ui/loading";
 import { useToast } from "@/components/molecules/Toast/use-toast";
@@ -21,18 +22,42 @@ function ResetPasswordContent() {
   const router = useRouter();
   const [isLoading, setIsLoading] = useState(false);
   const [disabled, setDisabled] = useState(false);
+  const [showExpiredMessage, setShowExpiredMessage] = useState(false);
 
   useEffect(() => {
     const error = searchParams.get("error");
-    if (error) {
-      toast({
-        title: "Password Reset Failed",
-        description: error,
-        variant: "destructive",
-      });
+    const errorCode = searchParams.get("error_code");
+    const errorDescription = searchParams.get("error_description");
 
+    if (error || errorCode) {
+      // Check if this is an expired/used link error
+      // Avoid broad checks like "invalid" which can match unrelated errors (e.g., PKCE errors)
+      const descLower = errorDescription?.toLowerCase() || "";
+      const isExpiredOrUsed =
+        error === "link_expired" ||
+        errorCode === "otp_expired" ||
+        descLower.includes("expired") ||
+        descLower.includes("already") ||
+        descLower.includes("used");
+
+      if (isExpiredOrUsed) {
+        setShowExpiredMessage(true);
+      } else {
+        // Show toast for other errors
+        const errorMessage =
+          errorDescription || error || "Password reset failed";
+        toast({
+          title: "Password Reset Failed",
+          description: errorMessage,
+          variant: "destructive",
+        });
+      }
+
+      // Clear all error params from URL
       const newUrl = new URL(window.location.href);
       newUrl.searchParams.delete("error");
+      newUrl.searchParams.delete("error_code");
+      newUrl.searchParams.delete("error_description");
       router.replace(newUrl.pathname + newUrl.search);
     }
   }, [searchParams, toast, router]);
@@ -82,6 +107,10 @@ function ResetPasswordContent() {
     [sendEmailForm, toast],
   );
 
+  function handleShowEmailForm() {
+    setShowExpiredMessage(false);
+  }
+
   const onChangePassword = useCallback(
     async (data: z.infer<typeof changePasswordFormSchema>) => {
       setIsLoading(true);
@@ -122,6 +151,17 @@ function ResetPasswordContent() {
     );
   }
 
+  // Show expired link message if detected
+  if (showExpiredMessage && !user) {
+    return (
+      <div className="flex h-full min-h-[85vh] w-full flex-col items-center justify-center">
+        <AuthCard title="Reset Password">
+          <ExpiredLinkMessage onRequestNewLink={handleShowEmailForm} />
+        </AuthCard>
+      </div>
+    );
+  }
+
   return (
     <div className="flex h-full min-h-[85vh] w-full flex-col items-center justify-center">
       <AuthCard title="Reset Password">

autogpt_platform/frontend/src/app/api/auth/callback/reset-password/route.ts

@@ -10,7 +10,7 @@ export async function GET(request: NextRequest) {
 
   if (!code) {
     return NextResponse.redirect(
-      `${origin}/reset-password?error=Missing verification code`,
+      `${origin}/reset-password?error=${encodeURIComponent("Missing verification code")}`,
     );
   }
 
@@ -26,8 +26,21 @@ export async function GET(request: NextRequest) {
     const result = await exchangePasswordResetCode(supabase, code);
 
     if (!result.success) {
+      // Check for expired or used link errors
+      // Avoid broad checks like "invalid" which can match unrelated errors (e.g., PKCE errors)
+      const errorMessage = result.error?.toLowerCase() || "";
+      const isExpiredOrUsed =
+        errorMessage.includes("expired") ||
+        errorMessage.includes("otp_expired") ||
+        errorMessage.includes("already") ||
+        errorMessage.includes("used");
+
+      const errorParam = isExpiredOrUsed
+        ? "link_expired"
+        : encodeURIComponent(result.error || "Password reset failed");
+
       return NextResponse.redirect(
-        `${origin}/reset-password?error=${encodeURIComponent(result.error || "Password reset failed")}`,
+        `${origin}/reset-password?error=${errorParam}`,
       );
     }
 
@@ -35,7 +48,7 @@ export async function GET(request: NextRequest) {
   } catch (error) {
     console.error("Password reset callback error:", error);
     return NextResponse.redirect(
-      `${origin}/reset-password?error=Password reset failed`,
+      `${origin}/reset-password?error=${encodeURIComponent("Password reset failed")}`,
     );
   }
 }

autogpt_platform/frontend/src/app/api/chat/sessions/[sessionId]/stream/route.ts

@@ -3,6 +3,20 @@ import { getServerAuthToken } from "@/lib/autogpt-server-api/helpers";
 import { NextRequest } from "next/server";
 import { normalizeSSEStream, SSE_HEADERS } from "../../../sse-helpers";
 
+export const maxDuration = 800;
+
+const DEBUG_SSE_TIMEOUT_MS = process.env.NEXT_PUBLIC_SSE_TIMEOUT_MS
+  ? Number(process.env.NEXT_PUBLIC_SSE_TIMEOUT_MS)
+  : undefined;
+
+function debugSignal(): AbortSignal | undefined {
+  if (!DEBUG_SSE_TIMEOUT_MS) return undefined;
+  console.warn(
+    `[SSE_DEBUG] Simulating proxy timeout in ${DEBUG_SSE_TIMEOUT_MS}ms`,
+  );
+  return AbortSignal.timeout(DEBUG_SSE_TIMEOUT_MS);
+}
+
 export async function POST(
   request: NextRequest,
   { params }: { params: Promise<{ sessionId: string }> },
@@ -47,6 +61,7 @@ export async function POST(
         is_user_message: is_user_message ?? true,
         context: context || null,
       }),
+      signal: debugSignal(),
     });
 
     if (!response.ok) {
@@ -110,6 +125,7 @@ export async function GET(
     const response = await fetch(streamUrl.toString(), {
       method: "GET",
       headers,
+      signal: debugSignal(),
     });
 
     if (response.status === 204) {

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

@@ -820,21 +820,7 @@
             "in": "query",
             "required": false,
             "schema": {
-              "anyOf": [
-                {
-                  "type": "array",
-                  "items": {
-                    "enum": [
-                      "blocks",
-                      "integrations",
-                      "marketplace_agents",
-                      "my_agents"
-                    ],
-                    "type": "string"
-                  }
-                },
-                { "type": "null" }
-              ],
+              "anyOf": [{ "type": "string" }, { "type": "null" }],
               "title": "Filter"
             }
           },
@@ -3510,6 +3496,29 @@
               "title": "Page Size"
             },
             "description": "Number of agents per page (must be >= 1)"
+          },
+          {
+            "name": "folder_id",
+            "in": "query",
+            "required": false,
+            "schema": {
+              "anyOf": [{ "type": "string" }, { "type": "null" }],
+              "description": "Filter by folder ID",
+              "title": "Folder Id"
+            },
+            "description": "Filter by folder ID"
+          },
+          {
+            "name": "include_root_only",
+            "in": "query",
+            "required": false,
+            "schema": {
+              "type": "boolean",
+              "description": "Only return agents without a folder (root-level agents)",
+              "default": false,
+              "title": "Include Root Only"
+            },
+            "description": "Only return agents without a folder (root-level agents)"
           }
         ],
         "responses": {
@@ -3877,6 +3886,338 @@
         }
       }
     },
+    "/api/library/folders": {
+      "get": {
+        "tags": ["v2", "library", "folders", "private"],
+        "summary": "List Library Folders",
+        "description": "List folders for the authenticated user.\n\nArgs:\n    user_id: ID of the authenticated user.\n    parent_id: Optional parent folder ID to filter by.\n    include_relations: Whether to include agent and subfolder relations for counts.\n\nReturns:\n    A FolderListResponse containing folders.",
+        "operationId": "getV2List library folders",
+        "security": [{ "HTTPBearerJWT": [] }],
+        "parameters": [
+          {
+            "name": "parent_id",
+            "in": "query",
+            "required": false,
+            "schema": {
+              "anyOf": [{ "type": "string" }, { "type": "null" }],
+              "description": "Filter by parent folder ID. If not provided, returns root-level folders.",
+              "title": "Parent Id"
+            },
+            "description": "Filter by parent folder ID. If not provided, returns root-level folders."
+          },
+          {
+            "name": "include_relations",
+            "in": "query",
+            "required": false,
+            "schema": {
+              "type": "boolean",
+              "description": "Include agent and subfolder relations (for counts)",
+              "default": true,
+              "title": "Include Relations"
+            },
+            "description": "Include agent and subfolder relations (for counts)"
+          }
+        ],
+        "responses": {
+          "200": {
+            "description": "List of folders",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/FolderListResponse" }
+              }
+            }
+          },
+          "401": {
+            "$ref": "#/components/responses/HTTP401NotAuthenticatedError"
+          },
+          "422": {
+            "description": "Validation Error",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/HTTPValidationError" }
+              }
+            }
+          },
+          "500": { "description": "Server error" }
+        }
+      },
+      "post": {
+        "tags": ["v2", "library", "folders", "private"],
+        "summary": "Create Folder",
+        "description": "Create a new folder.\n\nArgs:\n    payload: The folder creation request.\n    user_id: ID of the authenticated user.\n\nReturns:\n    The created LibraryFolder.",
+        "operationId": "postV2Create folder",
+        "security": [{ "HTTPBearerJWT": [] }],
+        "requestBody": {
+          "required": true,
+          "content": {
+            "application/json": {
+              "schema": { "$ref": "#/components/schemas/FolderCreateRequest" }
+            }
+          }
+        },
+        "responses": {
+          "201": {
+            "description": "Folder created successfully",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/LibraryFolder" }
+              }
+            }
+          },
+          "400": { "description": "Validation error" },
+          "401": {
+            "$ref": "#/components/responses/HTTP401NotAuthenticatedError"
+          },
+          "404": { "description": "Parent folder not found" },
+          "409": { "description": "Folder name conflict" },
+          "422": {
+            "description": "Validation Error",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/HTTPValidationError" }
+              }
+            }
+          },
+          "500": { "description": "Server error" }
+        }
+      }
+    },
+    "/api/library/folders/agents/bulk-move": {
+      "post": {
+        "tags": ["v2", "library", "folders", "private"],
+        "summary": "Bulk Move Agents",
+        "description": "Move multiple agents to a folder.\n\nArgs:\n    payload: The bulk move request with agent IDs and target folder.\n    user_id: ID of the authenticated user.\n\nReturns:\n    The updated LibraryAgents.",
+        "operationId": "postV2Bulk move agents",
+        "requestBody": {
+          "content": {
+            "application/json": {
+              "schema": { "$ref": "#/components/schemas/BulkMoveAgentsRequest" }
+            }
+          },
+          "required": true
+        },
+        "responses": {
+          "200": {
+            "description": "Agents moved successfully",
+            "content": {
+              "application/json": {
+                "schema": {
+                  "items": { "$ref": "#/components/schemas/LibraryAgent" },
+                  "type": "array",
+                  "title": "Response Postv2Bulk Move Agents"
+                }
+              }
+            }
+          },
+          "401": {
+            "$ref": "#/components/responses/HTTP401NotAuthenticatedError"
+          },
+          "404": { "description": "Folder not found" },
+          "422": {
+            "description": "Validation Error",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/HTTPValidationError" }
+              }
+            }
+          },
+          "500": { "description": "Server error" }
+        },
+        "security": [{ "HTTPBearerJWT": [] }]
+      }
+    },
+    "/api/library/folders/tree": {
+      "get": {
+        "tags": ["v2", "library", "folders", "private"],
+        "summary": "Get Folder Tree",
+        "description": "Get the full folder tree for the authenticated user.\n\nArgs:\n    user_id: ID of the authenticated user.\n\nReturns:\n    A FolderTreeResponse containing the nested folder structure.",
+        "operationId": "getV2Get folder tree",
+        "responses": {
+          "200": {
+            "description": "Folder tree structure",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/FolderTreeResponse" }
+              }
+            }
+          },
+          "401": {
+            "$ref": "#/components/responses/HTTP401NotAuthenticatedError"
+          },
+          "500": { "description": "Server error" }
+        },
+        "security": [{ "HTTPBearerJWT": [] }]
+      }
+    },
+    "/api/library/folders/{folder_id}": {
+      "delete": {
+        "tags": ["v2", "library", "folders", "private"],
+        "summary": "Delete Folder",
+        "description": "Soft-delete a folder and all its contents.\n\nArgs:\n    folder_id: ID of the folder to delete.\n    user_id: ID of the authenticated user.\n\nReturns:\n    204 No Content if successful.",
+        "operationId": "deleteV2Delete folder",
+        "security": [{ "HTTPBearerJWT": [] }],
+        "parameters": [
+          {
+            "name": "folder_id",
+            "in": "path",
+            "required": true,
+            "schema": { "type": "string", "title": "Folder Id" }
+          }
+        ],
+        "responses": {
+          "204": { "description": "Folder deleted successfully" },
+          "401": {
+            "$ref": "#/components/responses/HTTP401NotAuthenticatedError"
+          },
+          "404": { "description": "Folder not found" },
+          "422": {
+            "description": "Validation Error",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/HTTPValidationError" }
+              }
+            }
+          },
+          "500": { "description": "Server error" }
+        }
+      },
+      "get": {
+        "tags": ["v2", "library", "folders", "private"],
+        "summary": "Get Folder",
+        "description": "Get a specific folder.\n\nArgs:\n    folder_id: ID of the folder to retrieve.\n    user_id: ID of the authenticated user.\n\nReturns:\n    The requested LibraryFolder.",
+        "operationId": "getV2Get folder",
+        "security": [{ "HTTPBearerJWT": [] }],
+        "parameters": [
+          {
+            "name": "folder_id",
+            "in": "path",
+            "required": true,
+            "schema": { "type": "string", "title": "Folder Id" }
+          }
+        ],
+        "responses": {
+          "200": {
+            "description": "Folder details",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/LibraryFolder" }
+              }
+            }
+          },
+          "401": {
+            "$ref": "#/components/responses/HTTP401NotAuthenticatedError"
+          },
+          "404": { "description": "Folder not found" },
+          "422": {
+            "description": "Validation Error",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/HTTPValidationError" }
+              }
+            }
+          },
+          "500": { "description": "Server error" }
+        }
+      },
+      "patch": {
+        "tags": ["v2", "library", "folders", "private"],
+        "summary": "Update Folder",
+        "description": "Update a folder's properties.\n\nArgs:\n    folder_id: ID of the folder to update.\n    payload: The folder update request.\n    user_id: ID of the authenticated user.\n\nReturns:\n    The updated LibraryFolder.",
+        "operationId": "patchV2Update folder",
+        "security": [{ "HTTPBearerJWT": [] }],
+        "parameters": [
+          {
+            "name": "folder_id",
+            "in": "path",
+            "required": true,
+            "schema": { "type": "string", "title": "Folder Id" }
+          }
+        ],
+        "requestBody": {
+          "required": true,
+          "content": {
+            "application/json": {
+              "schema": { "$ref": "#/components/schemas/FolderUpdateRequest" }
+            }
+          }
+        },
+        "responses": {
+          "200": {
+            "description": "Folder updated successfully",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/LibraryFolder" }
+              }
+            }
+          },
+          "400": { "description": "Validation error" },
+          "401": {
+            "$ref": "#/components/responses/HTTP401NotAuthenticatedError"
+          },
+          "404": { "description": "Folder not found" },
+          "409": { "description": "Folder name conflict" },
+          "422": {
+            "description": "Validation Error",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/HTTPValidationError" }
+              }
+            }
+          },
+          "500": { "description": "Server error" }
+        }
+      }
+    },
+    "/api/library/folders/{folder_id}/move": {
+      "post": {
+        "tags": ["v2", "library", "folders", "private"],
+        "summary": "Move Folder",
+        "description": "Move a folder to a new parent.\n\nArgs:\n    folder_id: ID of the folder to move.\n    payload: The move request with target parent.\n    user_id: ID of the authenticated user.\n\nReturns:\n    The moved LibraryFolder.",
+        "operationId": "postV2Move folder",
+        "security": [{ "HTTPBearerJWT": [] }],
+        "parameters": [
+          {
+            "name": "folder_id",
+            "in": "path",
+            "required": true,
+            "schema": { "type": "string", "title": "Folder Id" }
+          }
+        ],
+        "requestBody": {
+          "required": true,
+          "content": {
+            "application/json": {
+              "schema": { "$ref": "#/components/schemas/FolderMoveRequest" }
+            }
+          }
+        },
+        "responses": {
+          "200": {
+            "description": "Folder moved successfully",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/LibraryFolder" }
+              }
+            }
+          },
+          "400": { "description": "Validation error (circular reference)" },
+          "401": {
+            "$ref": "#/components/responses/HTTP401NotAuthenticatedError"
+          },
+          "404": { "description": "Folder or target parent not found" },
+          "409": { "description": "Folder name conflict in target location" },
+          "422": {
+            "description": "Validation Error",
+            "content": {
+              "application/json": {
+                "schema": { "$ref": "#/components/schemas/HTTPValidationError" }
+              }
+            }
+          },
+          "500": { "description": "Server error" }
+        }
+      }
+    },
     "/api/library/presets": {
       "get": {
         "tags": ["v2", "presets"],
@@ -6313,9 +6654,11 @@
           "IDENTITY",
           "EXECUTE_GRAPH",
           "READ_GRAPH",
+          "WRITE_GRAPH",
           "EXECUTE_BLOCK",
           "READ_BLOCK",
           "READ_STORE",
+          "WRITE_LIBRARY",
           "USE_TOOLS",
           "MANAGE_INTEGRATIONS",
           "READ_INTEGRATIONS",
@@ -7425,6 +7768,23 @@
         "required": ["file"],
         "title": "Body_postV2Upload submission media"
       },
+      "BulkMoveAgentsRequest": {
+        "properties": {
+          "agent_ids": {
+            "items": { "type": "string" },
+            "type": "array",
+            "title": "Agent Ids"
+          },
+          "folder_id": {
+            "anyOf": [{ "type": "string" }, { "type": "null" }],
+            "title": "Folder Id"
+          }
+        },
+        "type": "object",
+        "required": ["agent_ids"],
+        "title": "BulkMoveAgentsRequest",
+        "description": "Request model for moving multiple agents to a folder."
+      },
       "CancelSessionResponse": {
         "properties": {
           "cancelled": { "type": "boolean", "title": "Cancelled" },
@@ -8161,6 +8521,96 @@
         "title": "ExecutionStartedResponse",
         "description": "Response for run/schedule actions."
       },
+      "FolderCreateRequest": {
+        "properties": {
+          "name": {
+            "type": "string",
+            "maxLength": 100,
+            "minLength": 1,
+            "title": "Name"
+          },
+          "icon": {
+            "anyOf": [{ "type": "string" }, { "type": "null" }],
+            "title": "Icon"
+          },
+          "color": {
+            "anyOf": [
+              { "type": "string", "pattern": "^#[0-9A-Fa-f]{6}$" },
+              { "type": "null" }
+            ],
+            "title": "Color",
+            "description": "Hex color code (#RRGGBB)"
+          },
+          "parent_id": {
+            "anyOf": [{ "type": "string" }, { "type": "null" }],
+            "title": "Parent Id"
+          }
+        },
+        "type": "object",
+        "required": ["name"],
+        "title": "FolderCreateRequest",
+        "description": "Request model for creating a folder."
+      },
+      "FolderListResponse": {
+        "properties": {
+          "folders": {
+            "items": { "$ref": "#/components/schemas/LibraryFolder" },
+            "type": "array",
+            "title": "Folders"
+          },
+          "pagination": { "$ref": "#/components/schemas/Pagination" }
+        },
+        "type": "object",
+        "required": ["folders", "pagination"],
+        "title": "FolderListResponse",
+        "description": "Response schema for a list of folders."
+      },
+      "FolderMoveRequest": {
+        "properties": {
+          "target_parent_id": {
+            "anyOf": [{ "type": "string" }, { "type": "null" }],
+            "title": "Target Parent Id"
+          }
+        },
+        "type": "object",
+        "title": "FolderMoveRequest",
+        "description": "Request model for moving a folder to a new parent."
+      },
+      "FolderTreeResponse": {
+        "properties": {
+          "tree": {
+            "items": { "$ref": "#/components/schemas/LibraryFolderTree" },
+            "type": "array",
+            "title": "Tree"
+          }
+        },
+        "type": "object",
+        "required": ["tree"],
+        "title": "FolderTreeResponse",
+        "description": "Response schema for folder tree structure."
+      },
+      "FolderUpdateRequest": {
+        "properties": {
+          "name": {
+            "anyOf": [
+              { "type": "string", "maxLength": 100, "minLength": 1 },
+              { "type": "null" }
+            ],
+            "title": "Name"
+          },
+          "icon": {
+            "anyOf": [{ "type": "string" }, { "type": "null" }],
+            "title": "Icon"
+          },
+          "color": {
+            "anyOf": [{ "type": "string" }, { "type": "null" }],
+            "title": "Color"
+          }
+        },
+        "type": "object",
+        "title": "FolderUpdateRequest",
+        "description": "Request model for updating a folder."
+      },
       "Graph": {
         "properties": {
           "id": { "type": "string", "title": "Id" },
@@ -9049,6 +9499,14 @@
             "title": "Is Latest Version"
           },
           "is_favorite": { "type": "boolean", "title": "Is Favorite" },
+          "folder_id": {
+            "anyOf": [{ "type": "string" }, { "type": "null" }],
+            "title": "Folder Id"
+          },
+          "folder_name": {
+            "anyOf": [{ "type": "string" }, { "type": "null" }],
+            "title": "Folder Name"
+          },
           "recommended_schedule_cron": {
             "anyOf": [{ "type": "string" }, { "type": "null" }],
             "title": "Recommended Schedule Cron"
@@ -9316,12 +9774,109 @@
               { "type": "null" }
             ],
             "description": "User-specific settings for this library agent"
+          },
+          "folder_id": {
+            "anyOf": [{ "type": "string" }, { "type": "null" }],
+            "title": "Folder Id",
+            "description": "Folder ID to move agent to (None to move to root)"
           }
         },
         "type": "object",
         "title": "LibraryAgentUpdateRequest",
         "description": "Schema for updating a library agent via PUT.\n\nIncludes flags for auto-updating version, marking as favorite,\narchiving, or deleting."
       },
+      "LibraryFolder": {
+        "properties": {
+          "id": { "type": "string", "title": "Id" },
+          "user_id": { "type": "string", "title": "User Id" },
+          "name": { "type": "string", "title": "Name" },
+          "icon": {
+            "anyOf": [{ "type": "string" }, { "type": "null" }],
+            "title": "Icon"
+          },
+          "color": {
+            "anyOf": [{ "type": "string" }, { "type": "null" }],
+            "title": "Color"
+          },
+          "parent_id": {
+            "anyOf": [{ "type": "string" }, { "type": "null" }],
+            "title": "Parent Id"
+          },
+          "created_at": {
+            "type": "string",
+            "format": "date-time",
+            "title": "Created At"
+          },
+          "updated_at": {
+            "type": "string",
+            "format": "date-time",
+            "title": "Updated At"
+          },
+          "agent_count": {
+            "type": "integer",
+            "title": "Agent Count",
+            "default": 0
+          },
+          "subfolder_count": {
+            "type": "integer",
+            "title": "Subfolder Count",
+            "default": 0
+          }
+        },
+        "type": "object",
+        "required": ["id", "user_id", "name", "created_at", "updated_at"],
+        "title": "LibraryFolder",
+        "description": "Represents a folder for organizing library agents."
+      },
+      "LibraryFolderTree": {
+        "properties": {
+          "id": { "type": "string", "title": "Id" },
+          "user_id": { "type": "string", "title": "User Id" },
+          "name": { "type": "string", "title": "Name" },
+          "icon": {
+            "anyOf": [{ "type": "string" }, { "type": "null" }],
+            "title": "Icon"
+          },
+          "color": {
+            "anyOf": [{ "type": "string" }, { "type": "null" }],
+            "title": "Color"
+          },
+          "parent_id": {
+            "anyOf": [{ "type": "string" }, { "type": "null" }],
+            "title": "Parent Id"
+          },
+          "created_at": {
+            "type": "string",
+            "format": "date-time",
+            "title": "Created At"
+          },
+          "updated_at": {
+            "type": "string",
+            "format": "date-time",
+            "title": "Updated At"
+          },
+          "agent_count": {
+            "type": "integer",
+            "title": "Agent Count",
+            "default": 0
+          },
+          "subfolder_count": {
+            "type": "integer",
+            "title": "Subfolder Count",
+            "default": 0
+          },
+          "children": {
+            "items": { "$ref": "#/components/schemas/LibraryFolderTree" },
+            "type": "array",
+            "title": "Children",
+            "default": []
+          }
+        },
+        "type": "object",
+        "required": ["id", "user_id", "name", "created_at", "updated_at"],
+        "title": "LibraryFolderTree",
+        "description": "Folder with nested children for tree view."
+      },
       "Link": {
         "properties": {
           "id": { "type": "string", "title": "Id" },
@@ -11539,11 +12094,6 @@
       },
       "SuggestionsResponse": {
         "properties": {
-          "otto_suggestions": {
-            "items": { "type": "string" },
-            "type": "array",
-            "title": "Otto Suggestions"
-          },
           "recent_searches": {
             "items": { "$ref": "#/components/schemas/SearchEntry" },
             "type": "array",
@@ -11564,12 +12114,7 @@
           }
         },
         "type": "object",
-        "required": [
-          "otto_suggestions",
-          "recent_searches",
-          "providers",
-          "top_blocks"
-        ],
+        "required": ["recent_searches", "providers", "top_blocks"],
         "title": "SuggestionsResponse"
       },
       "TimezoneResponse": {

autogpt_platform/frontend/src/app/globals.css

@@ -181,6 +181,11 @@ body[data-google-picker-open="true"] [data-dialog-content] {
   pointer-events: none !important;
 }
 
+/* Streamdown external link dialog: "Open link" button */
+[data-streamdown="link-safety-modal"] button:last-of-type {
+  color: black;
+}
+
 /* CoPilot chat table styling — remove left/right borders, increase padding */
 [data-streamdown="table-wrapper"] table {
   border-left: none;

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

@@ -0,0 +1,110 @@
+import type { Meta, StoryObj } from "@storybook/nextjs";
+
+import { Message, MessageContent, MessageResponse } from "./message";
+
+const meta: Meta<typeof Message> = {
+  title: "AI Elements/Message",
+  component: Message,
+  parameters: {
+    layout: "padded",
+  },
+};
+
+export default meta;
+type Story = StoryObj<typeof Message>;
+
+type MessageStoryProps = { children: string };
+
+function AssistantMessage({ children }: MessageStoryProps) {
+  return (
+    <Message from="assistant">
+      <MessageContent>
+        <MessageResponse>{children}</MessageResponse>
+      </MessageContent>
+    </Message>
+  );
+}
+
+function UserMessage({ children }: MessageStoryProps) {
+  return (
+    <Message from="user">
+      <MessageContent>
+        <MessageResponse>{children}</MessageResponse>
+      </MessageContent>
+    </Message>
+  );
+}
+
+export const Default: Story = {
+  render: () => (
+    <div className="flex flex-col gap-4">
+      <AssistantMessage>
+        {
+          "Here is a response with **bold text**, *italic text*, and `inline code`."
+        }
+      </AssistantMessage>
+    </div>
+  ),
+};
+
+export const UserMessageStory: Story = {
+  name: "User Message",
+  render: () => (
+    <div className="flex flex-col gap-4">
+      <UserMessage>{"How do I download my workspace files?"}</UserMessage>
+    </div>
+  ),
+};
+
+export const WithLinks: Story = {
+  name: "With Links (Internal & External)",
+  render: () => (
+    <div className="flex flex-col gap-4">
+      <AssistantMessage>
+        {[
+          "Here are some links:\n\n",
+          "- Internal link: [Download file](/api/proxy/api/v1/workspace/files/download/abc123)\n",
+          "- External link: [GitHub](https://github.com/Significant-Gravitas/AutoGPT)\n",
+          "- Another external: [Documentation](https://docs.agpt.co)\n\n",
+          "Internal links should open directly. External links should show a safety modal.\n\n",
+          "**Try clicking each link to verify behavior.**",
+        ].join("")}
+      </AssistantMessage>
+    </div>
+  ),
+};
+
+export const LinkSafetyModal: Story = {
+  name: "LinkSafetyModal",
+  render: () => (
+    <div className="flex flex-col gap-4">
+      <p className="text-sm text-muted-foreground">
+        Click the external link below to trigger the link safety modal. Verify
+        that both &quot;Copy link&quot; and &quot;Open link&quot; buttons are
+        visible.
+      </p>
+      <AssistantMessage>
+        {
+          "Click this external link to see the safety modal: [Example Site](https://example.com)"
+        }
+      </AssistantMessage>
+    </div>
+  ),
+};
+
+export const Conversation: Story = {
+  render: () => (
+    <div className="flex flex-col gap-4">
+      <UserMessage>{"Can you help me with my workspace files?"}</UserMessage>
+      <AssistantMessage>
+        {[
+          "Sure! Here's how to manage your workspace files:\n\n",
+          "1. Upload files using the attachment button\n",
+          "2. Download files by clicking the link in chat\n",
+          "3. View all files in the [workspace panel](/workspace)\n\n",
+          "For more details, check the [documentation](https://docs.agpt.co/workspace).",
+        ].join("")}
+      </AssistantMessage>
+    </div>
+  ),
+};

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

@@ -303,6 +303,15 @@ export const MessageBranchPage = ({
 
 export type MessageResponseProps = ComponentProps<typeof Streamdown>;
 
+function isSameOriginLink(url: string): boolean {
+  try {
+    const parsed = new URL(url, window.location.origin);
+    return parsed.origin === window.location.origin;
+  } catch {
+    return false;
+  }
+}
+
 export const MessageResponse = memo(
   ({ className, ...props }: MessageResponseProps) => (
     <Streamdown
@@ -311,6 +320,10 @@ export const MessageResponse = memo(
         className,
       )}
       plugins={{ code, mermaid, math, cjk }}
+      linkSafety={{
+        enabled: true,
+        onLinkCheck: isSameOriginLink,
+      }}
       {...props}
     />
   ),