@lobehub/lobehub 2.0.0-next.264 → 2.0.0-next.266

package/packages/database/src/repositories/home/__tests__/index.test.ts

@@ -36,6 +36,86 @@ describe('HomeRepository', () => {
       expect(result.groups).toEqual([]);
     });
 
+    it('should return non-virtual agents without agentsToSessions relationship', async () => {
+      // Create an agent without session relationship (e.g., duplicated agent)
+      const agentId = 'standalone-agent';
+
+      await clientDB.insert(Schema.agents).values({
+        id: agentId,
+        userId,
+        title: 'Standalone Agent',
+        description: 'Agent without session',
+        pinned: false,
+        virtual: false,
+      });
+
+      const result = await homeRepo.getSidebarAgentList();
+
+      // Agent should appear in ungrouped list even without agentsToSessions
+      expect(result.ungrouped).toHaveLength(1);
+      expect(result.ungrouped[0].id).toBe(agentId);
+      expect(result.ungrouped[0].title).toBe('Standalone Agent');
+    });
+
+    it('should return pinned non-virtual agents without agentsToSessions relationship', async () => {
+      // Create a pinned agent without session relationship
+      const agentId = 'pinned-standalone';
+
+      await clientDB.insert(Schema.agents).values({
+        id: agentId,
+        userId,
+        title: 'Pinned Standalone Agent',
+        pinned: true,
+        virtual: false,
+      });
+
+      const result = await homeRepo.getSidebarAgentList();
+
+      // Agent should appear in pinned list
+      expect(result.pinned).toHaveLength(1);
+      expect(result.pinned[0].id).toBe(agentId);
+      expect(result.pinned[0].pinned).toBe(true);
+    });
+
+    it('should return mixed agents with and without session relationships', async () => {
+      // Agent with session
+      await clientDB.transaction(async (tx) => {
+        await tx.insert(Schema.agents).values({
+          id: 'with-session',
+          userId,
+          title: 'Agent With Session',
+          pinned: false,
+          virtual: false,
+        });
+        await tx.insert(Schema.sessions).values({
+          id: 'session-1',
+          slug: 'session-1',
+          userId,
+        });
+        await tx.insert(Schema.agentsToSessions).values({
+          agentId: 'with-session',
+          sessionId: 'session-1',
+          userId,
+        });
+      });
+
+      // Agent without session (e.g., duplicated)
+      await clientDB.insert(Schema.agents).values({
+        id: 'without-session',
+        userId,
+        title: 'Agent Without Session',
+        pinned: false,
+        virtual: false,
+      });
+
+      const result = await homeRepo.getSidebarAgentList();
+
+      // Both agents should appear
+      expect(result.ungrouped).toHaveLength(2);
+      expect(result.ungrouped.map((a) => a.id)).toContain('with-session');
+      expect(result.ungrouped.map((a) => a.id)).toContain('without-session');
+    });
+
     it('should return agents with pinned status from agents table', async () => {
       // Create an agent with pinned=true
       const agentId = 'agent-1';
@@ -380,6 +460,16 @@ describe('HomeRepository', () => {
           sessionId: 'session-search-unpinned',
           userId,
         });
+
+        // Agent without session (e.g., duplicated agent)
+        await tx.insert(Schema.agents).values({
+          id: 'search-standalone',
+          userId,
+          title: 'Standalone Searchable Agent',
+          description: 'A standalone agent without session',
+          pinned: false,
+          virtual: false,
+        });
       });
     });
 
@@ -388,6 +478,24 @@ describe('HomeRepository', () => {
       expect(result).toEqual([]);
     });
 
+    it('should search agents without agentsToSessions relationship', async () => {
+      const result = await homeRepo.searchAgents('Standalone');
+
+      expect(result).toHaveLength(1);
+      expect(result[0].id).toBe('search-standalone');
+      expect(result[0].title).toBe('Standalone Searchable Agent');
+    });
+
+    it('should search and return mixed agents with and without session relationships', async () => {
+      // Search for "Searchable" should return all 3 agents
+      const result = await homeRepo.searchAgents('Searchable');
+
+      expect(result).toHaveLength(3);
+      expect(result.map((a) => a.id)).toContain('search-pinned');
+      expect(result.map((a) => a.id)).toContain('search-unpinned');
+      expect(result.map((a) => a.id)).toContain('search-standalone');
+    });
+
     it('should search agents by title and return correct pinned status', async () => {
       const result = await homeRepo.searchAgents('Searchable Pinned');
 
@@ -407,15 +515,19 @@ describe('HomeRepository', () => {
     it('should return multiple matching agents with correct pinned status', async () => {
       const result = await homeRepo.searchAgents('Searchable');
 
-      expect(result).toHaveLength(2);
+      // 3 agents: search-pinned, search-unpinned, search-standalone
+      expect(result).toHaveLength(3);
 
       const pinnedAgent = result.find((a) => a.id === 'search-pinned');
       const unpinnedAgent = result.find((a) => a.id === 'search-unpinned');
+      const standaloneAgent = result.find((a) => a.id === 'search-standalone');
 
       expect(pinnedAgent).toBeDefined();
       expect(pinnedAgent!.pinned).toBe(true);
       expect(unpinnedAgent).toBeDefined();
       expect(unpinnedAgent!.pinned).toBe(false);
+      expect(standaloneAgent).toBeDefined();
+      expect(standaloneAgent!.pinned).toBe(false);
     });
 
     it('should not return virtual agents in search', async () => {

package/packages/database/src/repositories/home/index.ts

@@ -1,6 +1,6 @@
 import { SidebarAgentItem, SidebarAgentListResponse, SidebarGroup } from '@lobechat/types';
 import { cleanObject } from '@lobechat/utils';
-import { and, desc, eq, ilike, inArray, or } from 'drizzle-orm';
+import { and, desc, eq, ilike, inArray, not, or } from 'drizzle-orm';
 
 import {
   agents,
@@ -36,11 +36,7 @@ export class HomeRepository {
    * Get sidebar agent list with pinned, grouped, and ungrouped items
    */
   async getSidebarAgentList(): Promise<SidebarAgentListResponse> {
-    // 1. Query all agents (non-virtual) with their session info
-    // Note: We query both agents.pinned and sessions.pinned for backward compatibility
-    // agents.pinned takes priority, falling back to sessions.pinned for legacy data
-    // Note: We query both agents.sessionGroupId and sessions.groupId for backward compatibility
-    // agents.sessionGroupId takes priority, falling back to sessions.groupId for legacy data
+    // 1. Query all agents (non-virtual) with their session info (if exists)
     const agentList = await this.db
       .select({
         agentSessionGroupId: agents.sessionGroupId,
@@ -55,9 +51,9 @@ export class HomeRepository {
         updatedAt: agents.updatedAt,
       })
       .from(agents)
-      .innerJoin(agentsToSessions, eq(agents.id, agentsToSessions.agentId))
-      .innerJoin(sessions, eq(agentsToSessions.sessionId, sessions.id))
-      .where(and(eq(agents.userId, this.userId), eq(agents.virtual, false)))
+      .leftJoin(agentsToSessions, eq(agents.id, agentsToSessions.agentId))
+      .leftJoin(sessions, eq(agentsToSessions.sessionId, sessions.id))
+      .where(and(eq(agents.userId, this.userId), not(eq(agents.virtual, true))))
       .orderBy(desc(agents.updatedAt));
 
     // 2. Query all chatGroups (group chats)
@@ -75,32 +71,7 @@ export class HomeRepository {
       .orderBy(desc(chatGroups.updatedAt));
 
     // 2.1 Query member avatars for each chat group
-    const chatGroupIds = chatGroupList.map((g) => g.id);
-    const memberAvatarsMap = new Map<string, Array<{ avatar: string; background?: string }>>();
-
-    if (chatGroupIds.length > 0) {
-      const memberAvatars = await this.db
-        .select({
-          avatar: agents.avatar,
-          backgroundColor: agents.backgroundColor,
-          chatGroupId: chatGroupsAgents.chatGroupId,
-        })
-        .from(chatGroupsAgents)
-        .innerJoin(agents, eq(chatGroupsAgents.agentId, agents.id))
-        .where(inArray(chatGroupsAgents.chatGroupId, chatGroupIds))
-        .orderBy(chatGroupsAgents.order);
-
-      for (const member of memberAvatars) {
-        const existing = memberAvatarsMap.get(member.chatGroupId) || [];
-        if (member.avatar) {
-          existing.push({
-            avatar: member.avatar,
-            background: member.backgroundColor ?? undefined,
-          });
-        }
-        memberAvatarsMap.set(member.chatGroupId, existing);
-      }
-    }
+    const memberAvatarsMap = await this.getChatGroupMemberAvatars(chatGroupList.map((g) => g.id));
 
     // 3. Query all sessionGroups (user-defined folders)
     const groupList = await this.db
@@ -125,7 +96,7 @@ export class HomeRepository {
       id: string;
       pinned: boolean | null;
       sessionGroupId: string | null;
-      sessionId: string;
+      sessionId: string | null;
       sessionPinned: boolean | null;
       title: string | null;
       updatedAt: Date;
@@ -217,7 +188,6 @@ export class HomeRepository {
     const searchPattern = `%${keyword.toLowerCase()}%`;
 
     // 1. Search agents by title or description
-    // Note: We query both agents.pinned and sessions.pinned for backward compatibility
     const agentResults = await this.db
       .select({
         avatar: agents.avatar,
@@ -230,12 +200,12 @@ export class HomeRepository {
         updatedAt: agents.updatedAt,
       })
       .from(agents)
-      .innerJoin(agentsToSessions, eq(agents.id, agentsToSessions.agentId))
-      .innerJoin(sessions, eq(agentsToSessions.sessionId, sessions.id))
+      .leftJoin(agentsToSessions, eq(agents.id, agentsToSessions.agentId))
+      .leftJoin(sessions, eq(agentsToSessions.sessionId, sessions.id))
       .where(
         and(
           eq(agents.userId, this.userId),
-          eq(agents.virtual, false),
+          not(eq(agents.virtual, true)),
           or(ilike(agents.title, searchPattern), ilike(agents.description, searchPattern)),
         ),
       )
@@ -260,35 +230,11 @@ export class HomeRepository {
       .orderBy(desc(chatGroups.updatedAt));
 
     // 2.1 Query member avatars for matching chat groups
-    const chatGroupIds = chatGroupResults.map((g) => g.id);
-    const memberAvatarsMap = new Map<string, Array<{ avatar: string; background?: string }>>();
-
-    if (chatGroupIds.length > 0) {
-      const memberAvatars = await this.db
-        .select({
-          avatar: agents.avatar,
-          backgroundColor: agents.backgroundColor,
-          chatGroupId: chatGroupsAgents.chatGroupId,
-        })
-        .from(chatGroupsAgents)
-        .innerJoin(agents, eq(chatGroupsAgents.agentId, agents.id))
-        .where(inArray(chatGroupsAgents.chatGroupId, chatGroupIds))
-        .orderBy(chatGroupsAgents.order);
-
-      for (const member of memberAvatars) {
-        const existing = memberAvatarsMap.get(member.chatGroupId) || [];
-        if (member.avatar) {
-          existing.push({
-            avatar: member.avatar,
-            background: member.backgroundColor ?? undefined,
-          });
-        }
-        memberAvatarsMap.set(member.chatGroupId, existing);
-      }
-    }
+    const memberAvatarsMap = await this.getChatGroupMemberAvatars(
+      chatGroupResults.map((g) => g.id),
+    );
 
     // 3. Combine and format results
-    // For pinned status: agents.pinned takes priority, fallback to sessions.pinned for backward compatibility
     const results: SidebarAgentItem[] = [
       ...agentResults.map((a) =>
         cleanObject({
@@ -320,4 +266,39 @@ export class HomeRepository {
 
     return results;
   }
+
+  /**
+   * Query member avatars for chat groups
+   */
+  private async getChatGroupMemberAvatars(
+    chatGroupIds: string[],
+  ): Promise<Map<string, Array<{ avatar: string; background?: string }>>> {
+    const memberAvatarsMap = new Map<string, Array<{ avatar: string; background?: string }>>();
+
+    if (chatGroupIds.length === 0) return memberAvatarsMap;
+
+    const memberAvatars = await this.db
+      .select({
+        avatar: agents.avatar,
+        backgroundColor: agents.backgroundColor,
+        chatGroupId: chatGroupsAgents.chatGroupId,
+      })
+      .from(chatGroupsAgents)
+      .innerJoin(agents, eq(chatGroupsAgents.agentId, agents.id))
+      .where(inArray(chatGroupsAgents.chatGroupId, chatGroupIds))
+      .orderBy(chatGroupsAgents.order);
+
+    for (const member of memberAvatars) {
+      const existing = memberAvatarsMap.get(member.chatGroupId) || [];
+      if (member.avatar) {
+        existing.push({
+          avatar: member.avatar,
+          background: member.backgroundColor ?? undefined,
+        });
+      }
+      memberAvatarsMap.set(member.chatGroupId, existing);
+    }
+
+    return memberAvatarsMap;
+  }
 }

package/pnpm-workspace.yaml

@@ -6,6 +6,7 @@ packages:
 
 onlyBuiltDependencies:
   - '@vercel/speed-insights'
+  - '@lobehub/editor'
 
 overrides:
   '@lobehub/chat-plugin-sdk>swagger-client': 3.36.0

package/src/app/[variants]/(main)/agent/_layout/Sidebar/Body.tsx

@@ -1,8 +1,8 @@
 import { Accordion, Flexbox } from '@lobehub/ui';
 import React, { memo } from 'react';
 
+import CronTopicList from './Cron';
 import Topic from './Topic';
-import CronTopicList from './Topic/CronTopicList';
 
 export enum ChatSidebarKey {
   CronTopics = 'cronTopics',

package/src/app/[variants]/(main)/agent/_layout/Sidebar/Cron/CronTopicGroup.tsx

@@ -0,0 +1,84 @@
+'use client';
+
+import { AccordionItem, ActionIcon, Flexbox, Icon, Text } from '@lobehub/ui';
+import { Settings2Icon, TimerIcon, TimerOffIcon } from 'lucide-react';
+import { memo, useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useParams } from 'react-router-dom';
+
+import { useRouter } from '@/app/[variants]/(main)/hooks/useRouter';
+import type { AgentCronJob } from '@/database/schemas/agentCronJob';
+
+import CronTopicItem from './CronTopicItem';
+
+interface CronTopicGroupProps {
+  cronJob: AgentCronJob | null;
+  cronJobId: string;
+  topics: Array<{
+    createdAt: Date | string;
+    favorite?: boolean | null;
+    historySummary?: string | null;
+    id: string;
+    metadata?: any;
+    title?: string | null;
+    trigger?: string | null;
+    updatedAt: Date | string;
+  }>;
+}
+
+const CronTopicGroup = memo<CronTopicGroupProps>(({ cronJob, cronJobId, topics }) => {
+  const { t } = useTranslation('setting');
+  const { aid, cronId } = useParams<{ aid?: string; cronId?: string }>();
+  const router = useRouter();
+
+  const handleOpenCronJob = useCallback(() => {
+    if (!aid) return;
+    router.push(`/agent/${aid}/cron/${cronJobId}`);
+  }, [aid, cronJobId, router]);
+
+  const cronJobName = cronJob?.name || t('agentCronJobs.unnamedTask');
+  const isEnabled = cronJob?.enabled ?? false;
+  const isActive = cronId === cronJobId;
+
+  return (
+    <AccordionItem
+      action={
+        <ActionIcon
+          icon={Settings2Icon}
+          onClick={handleOpenCronJob}
+          size="small"
+          title={t('agentCronJobs.editJob')}
+        />
+      }
+      itemKey={cronJobId}
+      paddingBlock={4}
+      paddingInline={'8px 4px'}
+      title={
+        <Flexbox align="center" gap={6} height={24} horizontal style={{ overflow: 'hidden' }}>
+          <Icon icon={isEnabled ? TimerIcon : TimerOffIcon} style={{ opacity: 0.5 }} />
+          <Text ellipsis style={{ flex: 1 }} type={isActive ? undefined : 'secondary'}>
+            {cronJobName}
+          </Text>
+          {topics.length > 0 && (
+            <Text fontSize={11} type="secondary">
+              {topics.length}
+            </Text>
+          )}
+        </Flexbox>
+      }
+      variant={isActive ? 'filled' : 'borderless'}
+    >
+      <Flexbox gap={1} paddingBlock={1}>
+        {topics.length > 0 ? (
+          topics.map((topic) => <CronTopicItem key={topic.id} topic={topic} />)
+        ) : (
+          <Text fontSize={12} style={{ padding: '8px 12px' }} type="secondary">
+            {t('agentCronJobs.noExecutionResults')}
+          </Text>
+        )}
+      </Flexbox>
+    </AccordionItem>
+  );
+});
+
+export default CronTopicGroup;

package/src/app/[variants]/(main)/agent/_layout/Sidebar/{Topic/CronTopicList → Cron}/CronTopicItem.tsx

@@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next';
 
 import { useChatStore } from '@/store/chat';
 
-import TopicItem from '../List/Item';
+import TopicItem from '../Topic/List/Item';
 
 interface CronTopicItemProps {
   topic: {

package/src/app/[variants]/(main)/agent/_layout/Sidebar/{Topic/CronTopicList → Cron}/index.tsx

@@ -1,9 +1,8 @@
 'use client';
 
 import { ENABLE_BUSINESS_FEATURES } from '@lobechat/business-const';
-import { AccordionItem, ActionIcon, Flexbox, Icon, Text } from '@lobehub/ui';
-import { message } from 'antd';
-import { Calendar, Plus } from 'lucide-react';
+import { Accordion, AccordionItem, ActionIcon, Flexbox, Text } from '@lobehub/ui';
+import { Plus } from 'lucide-react';
 import { memo, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import urlJoin from 'url-join';
@@ -11,9 +10,7 @@ import urlJoin from 'url-join';
 import NeuralNetworkLoading from '@/components/NeuralNetworkLoading';
 import EmptyNavItem from '@/features/NavPanel/components/EmptyNavItem';
 import SkeletonList from '@/features/NavPanel/components/SkeletonList';
-import { useFetchCronTopicsWithJobInfo } from '@/hooks/useFetchCronTopicsWithJobInfo';
 import { useQueryRoute } from '@/hooks/useQueryRoute';
-import { agentCronJobService } from '@/services/agentCronJob';
 import { useAgentStore } from '@/store/agent';
 
 import CronTopicGroup from './CronTopicGroup';
@@ -25,33 +22,22 @@ interface CronTopicListProps {
 const CronTopicList = memo<CronTopicListProps>(({ itemKey }) => {
   const { t } = useTranslation('setting');
   const router = useQueryRoute();
-  const agentId = useAgentStore((s) => s.activeAgentId);
-  const { cronTopicsGroupsWithJobInfo, isLoading, mutate } = useFetchCronTopicsWithJobInfo();
-  const totalTopics = cronTopicsGroupsWithJobInfo.reduce(
-    (acc, group) => acc + group.topics.length,
-    0,
-  );
+  const [agentId, createAgentCronJob, useFetchCronTopicsWithJobInfo] = useAgentStore((s) => [
+    s.activeAgentId,
+    s.createAgentCronJob,
+    s.useFetchCronTopicsWithJobInfo,
+  ]);
+  const { data: cronTopicsGroupsWithJobInfo = [], isLoading } =
+    useFetchCronTopicsWithJobInfo(agentId);
 
   const handleCreateCronJob = useCallback(async () => {
     if (!agentId) return;
-    try {
-      const result = await agentCronJobService.create({
-        agentId,
-        content: t('agentCronJobs.form.content.placeholder') || 'This is a cron job',
-        cronPattern: '*/30 * * * *',
-        enabled: true,
-        name: t('agentCronJobs.addJob') || 'Cron Job Task',
-      });
 
-      if (result.success) {
-        await mutate();
-        router.push(urlJoin('/agent', agentId, 'cron', result.data.id));
-      }
-    } catch (error) {
-      console.error('Failed to create cron job:', error);
-      message.error('Failed to create scheduled task');
+    const cronJobId = await createAgentCronJob();
+    if (cronJobId) {
+      router.push(urlJoin('/agent', agentId, 'cron', cronJobId));
     }
-  }, [agentId, mutate, router, t]);
+  }, [agentId, createAgentCronJob, router]);
 
   if (!ENABLE_BUSINESS_FEATURES) return null;
 
@@ -74,7 +60,6 @@ const CronTopicList = memo<CronTopicListProps>(({ itemKey }) => {
         paddingInline={'8px 4px'}
         title={
           <Flexbox align="center" gap={4} horizontal>
-            <Icon icon={Calendar} size={12} />
             <Text ellipsis fontSize={12} type={'secondary'} weight={500}>
               {t('agentCronJobs.title')}
             </Text>
@@ -96,7 +81,6 @@ const CronTopicList = memo<CronTopicListProps>(({ itemKey }) => {
         paddingInline={'8px 4px'}
         title={
           <Flexbox align="center" gap={4} horizontal>
-            <Icon icon={Calendar} size={12} />
             <Text ellipsis fontSize={12} type={'secondary'} weight={500}>
               {t('agentCronJobs.title')}
             </Text>
@@ -108,6 +92,8 @@ const CronTopicList = memo<CronTopicListProps>(({ itemKey }) => {
     );
   }
 
+  const totalCronJobs = cronTopicsGroupsWithJobInfo.length;
+
   return (
     <AccordionItem
       action={addAction}
@@ -116,14 +102,18 @@ const CronTopicList = memo<CronTopicListProps>(({ itemKey }) => {
       paddingInline={'8px 4px'}
       title={
         <Flexbox align="center" gap={4} horizontal>
-          <Icon icon={Calendar} size={12} />
           <Text ellipsis fontSize={12} type={'secondary'} weight={500}>
-            {`${t('agentCronJobs.title')} ${totalTopics > 0 ? totalTopics : ''}`}
+            {t('agentCronJobs.title')}
           </Text>
+          {totalCronJobs > 0 && (
+            <Text fontSize={11} type="secondary">
+              {totalCronJobs}
+            </Text>
+          )}
         </Flexbox>
       }
     >
-      <Flexbox gap={2} paddingBlock={2}>
+      <Accordion defaultExpandedKeys={cronTopicsGroupsWithJobInfo.map((g) => g.cronJobId)} gap={2}>
         {cronTopicsGroupsWithJobInfo.map((group) => (
           <CronTopicGroup
             cronJob={group.cronJob}
@@ -132,7 +122,7 @@ const CronTopicList = memo<CronTopicListProps>(({ itemKey }) => {
             topics={group.topics}
           />
         ))}
-      </Flexbox>
+      </Accordion>
     </AccordionItem>
   );
 });

package/src/app/[variants]/(main)/agent/_layout/Sidebar/Topic/List/Item/Editing.tsx

@@ -1,7 +1,6 @@
-import { Input, type InputProps, Popover } from '@lobehub/ui';
-import type { InputRef } from 'antd';
-import { memo, useCallback, useEffect, useRef, useState } from 'react';
+import { memo, useCallback } from 'react';
 
+import InlineRename from '@/components/InlineRename';
 import { useChatStore } from '@/store/chat';
 
 interface EditingProps {
@@ -10,27 +9,14 @@ interface EditingProps {
   toggleEditing: (visible?: boolean) => void;
 }
 
-function FocusableInput({ ...props }: InputProps) {
-  const ref = useRef<InputRef>(null);
-  useEffect(() => {
-    queueMicrotask(() => {
-      if (ref.current) {
-        ref.current.input?.focus();
-      }
-    });
-  }, []);
-  return <Input {...props} ref={ref} />;
-}
-
 const Editing = memo<EditingProps>(({ id, title, toggleEditing }) => {
-  const [newTitle, setNewTitle] = useState(title);
   const [editing, updateTopicTitle] = useChatStore((s) => [
     s.topicRenamingId === id,
     s.updateTopicTitle,
   ]);
 
-  const handleUpdate = useCallback(async () => {
-    if (newTitle && title !== newTitle) {
+  const handleSave = useCallback(
+    async (newTitle: string) => {
       try {
         // Set loading state
         useChatStore.setState(
@@ -53,40 +39,17 @@ const Editing = memo<EditingProps>(({ id, title, toggleEditing }) => {
           'clearTopicUpdating',
         );
       }
-    }
-  }, [newTitle, title, id, updateTopicTitle, toggleEditing]);
+    },
+    [id, updateTopicTitle],
+  );
 
   return (
-    <Popover
-      content={
-        <FocusableInput
-          defaultValue={title}
-          onBlur={handleUpdate}
-          onChange={(e) => setNewTitle(e.target.value)}
-          onClick={(e) => e.stopPropagation()}
-          onPressEnter={() => {
-            handleUpdate();
-            toggleEditing(false);
-          }}
-        />
-      }
-      onOpenChange={(open) => {
-        if (!open) handleUpdate();
-
-        toggleEditing(open);
-      }}
+    <InlineRename
+      onOpenChange={(open) => toggleEditing(open)}
+      onSave={handleSave}
       open={editing}
-      placement="bottomLeft"
-      styles={{
-        content: {
-          padding: 4,
-          width: 320,
-        },
-      }}
-      trigger="click"
-    >
-      <div />
-    </Popover>
+      title={title}
+    />
   );
 });
 

package/src/app/[variants]/(main)/agent/_layout/Sidebar/Topic/List/index.tsx

@@ -18,6 +18,8 @@ import AllTopicsDrawer from '../AllTopicsDrawer';
 import ByTimeMode from '../TopicListContent/ByTimeMode';
 import FlatMode from '../TopicListContent/FlatMode';
 
+const fetchParams = { excludeTriggers: ['cron'] };
+
 const TopicList = memo(() => {
   const { t } = useTranslation('topic');
   const router = useQueryRoute();
@@ -32,7 +34,7 @@ const TopicList = memo(() => {
 
   const [topicDisplayMode] = useUserStore((s) => [preferenceSelectors.topicDisplayMode(s)]);
 
-  useFetchTopics({ excludeTriggers: ['cron'] });
+  useFetchTopics(fetchParams);
 
   // Show skeleton when current session's topic data is not yet loaded
   if (isUndefinedTopics) return <SkeletonList />;