refactor(agents): remove draggable functionality and simplify agent list rendering

Remove unused agent management hooks and replace DraggableList with simple map
Add cursor-pointer style to AgentItem for better UX
This commit is contained in:
icarus 2025-09-18 16:24:27 +08:00
parent be7399b3c4
commit 54de2341bd
2 changed files with 20 additions and 24 deletions

View File

@ -37,7 +37,7 @@ const Assistants: FC<AssistantsTabProps> = ({
const { getGroupedAssistants, collapsedTags, toggleTagCollapse } = useTags() const { getGroupedAssistants, collapsedTags, toggleTagCollapse } = useTags()
const { assistantsTabSortType = 'list', setAssistantsTabSortType } = useAssistantsTabSortType() const { assistantsTabSortType = 'list', setAssistantsTabSortType } = useAssistantsTabSortType()
const containerRef = useRef<HTMLDivElement>(null) const containerRef = useRef<HTMLDivElement>(null)
const { agents, setAgents, removeAgent } = useAgents() const { agents } = useAgents()
const onDelete = useCallback( const onDelete = useCallback(
(assistant: Assistant) => { (assistant: Assistant) => {
@ -53,10 +53,10 @@ const Assistants: FC<AssistantsTabProps> = ({
const onDeleteAgent = useCallback( const onDeleteAgent = useCallback(
(agent: AgentEntity) => { (agent: AgentEntity) => {
removeAgent(agent.id) // removeAgent(agent.id)
window.toast.success(t('common.delete_success')) window.toast.success(t('common.delete_success'))
}, },
[removeAgent, t] [t]
) )
const handleSortByChange = useCallback( const handleSortByChange = useCallback(
@ -149,27 +149,22 @@ const Assistants: FC<AssistantsTabProps> = ({
return ( return (
<Container className="assistants-tab" ref={containerRef}> <Container className="assistants-tab" ref={containerRef}>
<span className="mb-2 text-foreground-400 text-xs">{t('common.agent_other')}</span> <span className="mb-2 text-foreground-400 text-xs">{t('common.agent_other')}</span>
<DraggableList {agents.map((agent) => (
list={agents} <AgentItem key={agent.id} agent={agent} isActive={false} onDelete={onDeleteAgent} />
onUpdate={setAgents} ))}
onDragStart={() => setDragging(true)} <AgentModal
onDragEnd={() => setDragging(false)}> trigger={{
{(agent) => <AgentItem agent={agent} isActive={false} onDelete={onDeleteAgent} />} content: (
</DraggableList> <Button
{!dragging && ( onPress={(e) => e.continuePropagation()}
<AgentModal className="w-full justify-start bg-transparent text-foreground-500 hover:bg-accent">
trigger={{ <Plus size={16} className="mr-1 shrink-0" />
content: ( {t('agent.add.title')}
<Button </Button>
onPress={(e) => e.continuePropagation()} )
className="w-full justify-start bg-transparent text-foreground-500 hover:bg-accent"> }}
<Plus size={16} className="mr-1 shrink-0" /> />
{t('agent.add.title')}
</Button>
)
}}
/>
)}
<Divider className="my-2" /> <Divider className="my-2" />
<span className="mb-2 text-foreground-400 text-xs">{t('common.assistant_other')}</span> <span className="mb-2 text-foreground-400 text-xs">{t('common.assistant_other')}</span>
<DraggableList <DraggableList

View File

@ -85,6 +85,7 @@ const Container: React.FC<React.HTMLAttributes<HTMLDivElement>> = ({ className,
'border-[0.5px] border-transparent', 'border-[0.5px] border-transparent',
'w-[calc(var(--assistants-width)_-_20px)]', 'w-[calc(var(--assistants-width)_-_20px)]',
'hover:bg-[var(--color-list-item-hover)]', 'hover:bg-[var(--color-list-item-hover)]',
'cursor-pointer',
className?.includes('active') && 'bg-[var(--color-list-item)] shadow-sm', className?.includes('active') && 'bg-[var(--color-list-item)] shadow-sm',
className className
)} )}